diff --git a/src/screens/Profile/Header/ProfileHeaderStandard.tsx b/src/screens/Profile/Header/ProfileHeaderStandard.tsx index 340621398a..67408ea9ea 100644 --- a/src/screens/Profile/Header/ProfileHeaderStandard.tsx +++ b/src/screens/Profile/Header/ProfileHeaderStandard.tsx @@ -22,6 +22,7 @@ import { import {useRequireAuth, useSession} from '#/state/session' import {ProfileMenu} from '#/view/com/profile/ProfileMenu' import * as Toast from '#/view/com/util/Toast' +import {useProfileTheme} from '#/view/screens/Profile' import {atoms as a} from '#/alf' import {Button, ButtonIcon, ButtonText} from '#/components/Button' import {useDialogControl} from '#/components/Dialog' @@ -148,6 +149,8 @@ let ProfileHeaderStandard = ({ [currentAccount, profile], ) + const pTheme = useProfileTheme() + return ( + style={[{backgroundColor: pTheme.lightPalette.primary_50}]}> Edit Profile @@ -197,7 +200,10 @@ let ProfileHeaderStandard = ({ label={_(msg`Unblock`)} disabled={!hasSession} onPress={() => unblockPromptControl.open()} - style={[a.rounded_full]}> + style={[ + a.rounded_full, + {backgroundColor: pTheme.lightPalette.primary_50}, + ]}> Unblock @@ -220,7 +226,10 @@ let ProfileHeaderStandard = ({ onPress={ profile.viewer?.following ? onPressUnfollow : onPressFollow } - style={[a.rounded_full]}> + style={[ + a.rounded_full, + {backgroundColor: pTheme.lightPalette.primary_50}, + ]}> + + diff --git a/src/view/com/profile/ProfileMenu.tsx b/src/view/com/profile/ProfileMenu.tsx index f01fb5e172..7af85aaaef 100644 --- a/src/view/com/profile/ProfileMenu.tsx +++ b/src/view/com/profile/ProfileMenu.tsx @@ -20,6 +20,7 @@ import { import {useSession} from '#/state/session' import {EventStopper} from '#/view/com/util/EventStopper' import * as Toast from '#/view/com/util/Toast' +import {useProfileTheme} from '#/view/screens/Profile' import {Button, ButtonIcon} from '#/components/Button' import {ArrowOutOfBox_Stroke2_Corner0_Rounded as Share} from '#/components/icons/ArrowOutOfBox' import {DotGrid_Stroke2_Corner0_Rounded as Ellipsis} from '#/components/icons/DotGrid' @@ -167,6 +168,8 @@ let ProfileMenu = ({ reportDialogControl.open() }, [reportDialogControl]) + const pTheme = useProfileTheme() + return ( @@ -181,7 +184,8 @@ let ProfileMenu = ({ variant="solid" color="secondary" size="small" - shape="round"> + shape="round" + style={{backgroundColor: pTheme.lightPalette.primary_50}}> ) diff --git a/src/view/screens/Profile.tsx b/src/view/screens/Profile.tsx index 677fe09f47..e60ee9b424 100644 --- a/src/view/screens/Profile.tsx +++ b/src/view/screens/Profile.tsx @@ -44,13 +44,26 @@ import {CenteredView} from '#/view/com/util/Views' import {ProfileHeader, ProfileHeaderLoading} from '#/screens/Profile/Header' import {ProfileFeedSection} from '#/screens/Profile/Sections/Feed' import {ProfileLabelsSection} from '#/screens/Profile/Sections/Labels' -import {web} from '#/alf' +import {Palette, Theme, web} from '#/alf' +import {createThemes} from '#/alf/themes' import * as Layout from '#/components/Layout' import {ScreenHider} from '#/components/moderation/ScreenHider' import {ProfileStarterPacks} from '#/components/StarterPack/ProfileStarterPacks' import {navigate} from '#/Navigation' import {ExpoScrollForwarderView} from '../../../modules/expo-scroll-forwarder' +type ThemeType = { + lightPalette: Palette + darkPalette: Palette + dimPalette: Palette + light: Theme + dark: Theme + dim: Theme +} + +const ProfileThemeContext = React.createContext({} as ThemeType) +export const useProfileTheme = () => React.useContext(ProfileThemeContext) + interface SectionRef { scrollToTop: () => void } @@ -341,17 +354,27 @@ function ProfileScreenLoaded({ // rendering // = + const theme = createThemes({ + hues: { + primary: 350, + negative: 0, + positive: 0, + }, + }) + const renderHeader = () => { return ( - + + + ) }