diff --git a/src/Avatar.module.css b/src/Avatar.module.css index 516dca1..52b20a5 100644 --- a/src/Avatar.module.css +++ b/src/Avatar.module.css @@ -49,7 +49,7 @@ width: 42px; height: 42px; border-radius: 42px; - font-size: 36px; + font-size: 24px; } .xl { diff --git a/src/Header.jsx b/src/Header.jsx index c2d7db3..8f82185 100644 --- a/src/Header.jsx +++ b/src/Header.jsx @@ -7,6 +7,7 @@ import { ReactComponent as VideoIcon } from "./icons/Video.svg"; import { ReactComponent as ArrowLeftIcon } from "./icons/ArrowLeft.svg"; import { useButton } from "@react-aria/button"; import { Subtitle } from "./typography/Typography"; +import { Avatar } from "./Avatar"; export function Header({ children, className, ...rest }) { return ( @@ -60,6 +61,11 @@ export function RoomHeaderInfo({ roomName }) { return ( <>
+
{roomName} diff --git a/src/home/CallList.jsx b/src/home/CallList.jsx index 07b46e0..55469b9 100644 --- a/src/home/CallList.jsx +++ b/src/home/CallList.jsx @@ -49,7 +49,7 @@ function CallTile({ size="lg" bgKey={name} src={avatarUrl} - fallback={} + fallback={name.slice(0, 1).toUpperCase()} className={styles.avatar} />