CodeCow/stack
1
0
Fork 0
mirror of https://github.com/stack-auth/stack.git synced 2026-06-13 21:01:21 +08:00
Code Issues Actions 2 Packages Projects Releases Wiki Activity

improved styling

Browse Source
This commit is contained in:
Zai Shi 2024-05-16 16:37:25 +02:00
parent 85d167ed3c
commit 4d3500141a
1 changed files with 11 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
packages/stack/src/components/user-avatar.tsx
View File

@ -1,6 +1,16 @@
import { RxPerson } from "react-icons/rx";
import { Avatar, AvatarFallback, AvatarImage, Text } from "..";
import { User } from "../lib/stack-app";
import { SECONDARY_FONT_COLORS } from "../utils/constants";
import styled from "styled-components";
const StyledIcon = styled(RxPerson)`
color: ${SECONDARY_FONT_COLORS.light};
html[data-stack-theme='dark'] & {
color: ${SECONDARY_FONT_COLORS.dark};
}
`;
export default function UserAvatar(props: { size?: number, user: User | null }) {
const user = props.user;
@ -12,7 +22,7 @@ export default function UserAvatar(props: { size?: number, user: User | null })
<Text style={{ fontWeight: 500 }}>
{(user?.displayName || user?.primaryEmail)?.slice(0, 2).toUpperCase()}
</Text> :
<RxPerson size={props.size} />}
<StyledIcon size={props.size} />}
</AvatarFallback>
</Avatar>
);