mirrors/owncast
1
0
Fork 0
mirror of https://github.com/owncast/owncast.git synced 2024-11-24 21:59:43 +03:00
Code Issues Projects Releases Packages Wiki Activity

Experiment with using image component for logo. Closes #2019

Browse source
This commit is contained in:
Gabe Kangas 2022-08-09 14:38:23 -07:00
parent d12f25f556
commit 9187a7a435
No known key found for this signature in database
GPG key ID: 9A56337728BC81EA
3 changed files with 7 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
web/components/PageLogo.tsx
View file

@ -1,3 +0,0 @@
export default function PageLogo() {
return <div>Pimary logo component goes here</div>;
}

3
web/components/ui/Logo/Logo.tsx
View file

@ -1,3 +1,4 @@
import { Image } from 'antd';
import s from './Logo.module.scss'; import s from './Logo.module.scss';
interface Props { interface Props {
@ -8,7 +9,7 @@ export default function Logo({ src }: Props) {
return ( return (
<div className={s.root}> <div className={s.root}>
<div className={s.container}> <div className={s.container}>
<div className={s.image} style={{ backgroundImage: `url(${src})` }} /> <Image src={src} alt="Logo" className={s.image} rootClassName={s.image} />
</div> </div>
</div> </div>
); );

5
web/stories/PageLogo.stories.tsx
View file

@ -21,3 +21,8 @@ export const DemoServer = Template.bind({});
DemoServer.args = { DemoServer.args = {
src: 'https://watch.owncast.online/logo', src: 'https://watch.owncast.online/logo',
}; };
export const NotSquare = Template.bind({});
NotSquare.args = {
src: 'https://via.placeholder.com/150x325/FF0000/FFFFFF?text=Rectangle',
};