diff --git a/src/alf/tokens.ts b/src/alf/tokens.ts index b1468f461d..4045c831c5 100644 --- a/src/alf/tokens.ts +++ b/src/alf/tokens.ts @@ -12,6 +12,9 @@ export const dimScale = generateScale(12, 100) export const color = { trueBlack: '#000000', + temp_purple: 'rgb(105 0 255)', + temp_purple_dark: 'rgb(83 0 202)', + gray_0: `hsl(${BLUE_HUE}, 20%, ${scale[14]}%)`, gray_25: `hsl(${BLUE_HUE}, 20%, ${scale[13]}%)`, gray_50: `hsl(${BLUE_HUE}, 20%, ${scale[12]}%)`, diff --git a/src/screens/Profile/Header/ProfileHeaderLabeler.tsx b/src/screens/Profile/Header/ProfileHeaderLabeler.tsx index b7f89ab369..8664fd4875 100644 --- a/src/screens/Profile/Header/ProfileHeaderLabeler.tsx +++ b/src/screens/Profile/Header/ProfileHeaderLabeler.tsx @@ -24,7 +24,7 @@ import {Haptics} from '#/lib/haptics' import {pluralize} from '#/lib/strings/helpers' import {isAppLabeler} from '#/lib/moderation' -import {atoms as a, useTheme} from '#/alf' +import {atoms as a, useTheme, tokens} from '#/alf' import {Button, ButtonText} from '#/components/Button' import {Text} from '#/components/Typography' import * as Toast from '#/view/com/util/Toast' @@ -177,25 +177,51 @@ let ProfileHeaderLabeler = ({ <> ) : null} diff --git a/src/screens/Profile/Header/Shell.tsx b/src/screens/Profile/Header/Shell.tsx index 5f6bc85dbd..1348b394cd 100644 --- a/src/screens/Profile/Header/Shell.tsx +++ b/src/screens/Profile/Header/Shell.tsx @@ -72,6 +72,7 @@ let ProfileHeaderShell = ({ /> ) : ( diff --git a/src/view/com/util/UserAvatar.tsx b/src/view/com/util/UserAvatar.tsx index c71a41342e..39bc723032 100644 --- a/src/view/com/util/UserAvatar.tsx +++ b/src/view/com/util/UserAvatar.tsx @@ -24,7 +24,7 @@ import { } from '#/components/icons/Camera' import {StreamingLive_Stroke2_Corner0_Rounded as Library} from '#/components/icons/StreamingLive' import {Trash_Stroke2_Corner0_Rounded as Trash} from '#/components/icons/Trash' -import {useTheme} from '#/alf' +import {useTheme, tokens} from '#/alf' export type UserAvatarType = 'user' | 'algo' | 'list' | 'labeler' @@ -112,7 +112,7 @@ let DefaultAvatar = ({ stroke="none"> void @@ -167,7 +169,10 @@ export function UserBanner({ ) : ( ) } @@ -191,4 +196,7 @@ const styles = StyleSheet.create({ defaultBanner: { backgroundColor: '#0070ff', }, + labelerBanner: { + backgroundColor: tokens.color.temp_purple, + }, })