Bluesky app fork with some witchin' additions 💫
0
fork

Configure Feed

Select the types of activity you want to include in your feed.

Fix default loader color (#2891)

authored by

Eric Bailey and committed by
GitHub
4e66c9b8 1d729721

+20 -2
+11 -2
src/components/Loader.tsx
··· 7 7 withTiming, 8 8 } from 'react-native-reanimated' 9 9 10 - import {atoms as a} from '#/alf' 10 + import {atoms as a, useTheme, flatten} from '#/alf' 11 11 import {Props, useCommonSVGProps} from '#/components/icons/common' 12 12 import {Loader_Stroke2_Corner0_Rounded as Icon} from '#/components/icons/Loader' 13 13 14 14 export function Loader(props: Props) { 15 + const t = useTheme() 15 16 const common = useCommonSVGProps(props) 16 17 const rotation = useSharedValue(0) 17 18 ··· 35 36 {width: common.size, height: common.size}, 36 37 animatedStyles, 37 38 ]}> 38 - <Icon {...props} style={[a.absolute, a.inset_0, props.style]} /> 39 + <Icon 40 + {...props} 41 + style={[ 42 + a.absolute, 43 + a.inset_0, 44 + t.atoms.text_contrast_high, 45 + flatten(props.style), 46 + ]} 47 + /> 39 48 </Animated.View> 40 49 ) 41 50 }
+9
src/view/screens/Storybook/Icons.tsx
··· 6 6 import {Globe_Stroke2_Corner0_Rounded as Globe} from '#/components/icons/Globe' 7 7 import {ArrowTopRight_Stroke2_Corner0_Rounded as ArrowTopRight} from '#/components/icons/ArrowTopRight' 8 8 import {CalendarDays_Stroke2_Corner0_Rounded as CalendarDays} from '#/components/icons/CalendarDays' 9 + import {Loader} from '#/components/Loader' 9 10 10 11 export function Icons() { 11 12 const t = useTheme() ··· 35 36 <CalendarDays size="md" fill={t.atoms.text.color} /> 36 37 <CalendarDays size="lg" fill={t.atoms.text.color} /> 37 38 <CalendarDays size="xl" fill={t.atoms.text.color} /> 39 + </View> 40 + 41 + <View style={[a.flex_row, a.gap_xl]}> 42 + <Loader size="xs" fill={t.atoms.text.color} /> 43 + <Loader size="sm" fill={t.atoms.text.color} /> 44 + <Loader size="md" fill={t.atoms.text.color} /> 45 + <Loader size="lg" fill={t.atoms.text.color} /> 46 + <Loader size="xl" fill={t.atoms.text.color} /> 38 47 </View> 39 48 </View> 40 49 )