ansxor.ca
forked from
jollywhoppers.com/witchsky.app
Bluesky app fork with some witchin' additions 💫
Merge #4492, fixes profile menu hover (#4580)
* Fix button hover color (#4492)
* Update ProfileMenu.tsx
* Update Button.tsx
* Update ProfileFeed.tsx
* Update ProfileFeed.tsx
* Re-add change post conflict
---------
Co-authored-by: Minseo Lee <itoupluk427@gmail.com>
authored by
Eric Bailey
Minseo Lee
and committed by
GitHub
eac4668d
80197556
+1
-1
src/components/Button.tsx
+1
-1
src/components/Button.tsx
+11
-12
src/view/com/profile/ProfileMenu.tsx
+11
-12
src/view/com/profile/ProfileMenu.tsx
···
9
9
import {logger} from '#/logger'
10
10
import {useAnalytics} from 'lib/analytics/analytics'
11
11
import {HITSLOP_10} from 'lib/constants'
12
-
import {usePalette} from 'lib/hooks/usePalette'
13
12
import {makeProfileLink} from 'lib/routes/links'
14
13
import {shareUrl} from 'lib/sharing'
15
14
import {toShareUrl} from 'lib/strings/url-helpers'
···
24
23
import {useSession} from 'state/session'
25
24
import {EventStopper} from 'view/com/util/EventStopper'
26
25
import * as Toast from 'view/com/util/Toast'
27
-
import {useTheme} from '#/alf'
26
+
import {atoms as a, useTheme} from '#/alf'
28
27
import {ArrowOutOfBox_Stroke2_Corner0_Rounded as Share} from '#/components/icons/ArrowOutOfBox'
29
28
import {Flag_Stroke2_Corner0_Rounded as Flag} from '#/components/icons/Flag'
30
29
import {ListSparkle_Stroke2_Corner0_Rounded as List} from '#/components/icons/ListSparkle'
···
49
48
const {currentAccount, hasSession} = useSession()
50
49
const t = useTheme()
51
50
// TODO ALF this
52
-
const pal = usePalette('default')
51
+
const alf = useTheme()
53
52
const {track} = useAnalytics()
54
53
const {openModal} = useModalControls()
55
54
const reportDialogControl = useReportDialogControl()
···
187
186
<EventStopper onKeyDown={false}>
188
187
<Menu.Root>
189
188
<Menu.Trigger label={_(`More options`)}>
190
-
{({props}) => {
189
+
{({props, state}) => {
191
190
return (
192
191
<TouchableOpacity
193
192
{...props}
194
193
hitSlop={HITSLOP_10}
195
194
testID="profileHeaderDropdownBtn"
196
195
style={[
197
-
{
198
-
flexDirection: 'row',
199
-
alignItems: 'center',
200
-
justifyContent: 'center',
201
-
padding: 8,
202
-
borderRadius: 50,
203
-
},
204
-
pal.btn,
196
+
a.rounded_full,
197
+
a.justify_center,
198
+
a.align_center,
199
+
{width: 36, height: 36},
200
+
alf.atoms.bg_contrast_25,
201
+
(state.hovered || state.pressed) && [
202
+
alf.atoms.bg_contrast_50,
203
+
],
205
204
]}>
206
205
<FontAwesomeIcon
207
206
icon="ellipsis"
+7
-6
src/view/screens/ProfileFeed.tsx
+7
-6
src/view/screens/ProfileFeed.tsx
···
1
1
import React, {useCallback, useMemo} from 'react'
2
2
import {Pressable, StyleSheet, View} from 'react-native'
3
+
import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome'
3
4
import {msg, Plural, Trans} from '@lingui/macro'
4
5
import {useLingui} from '@lingui/react'
5
6
import {useIsFocused, useNavigation} from '@react-navigation/native'
···
54
55
import {Button as NewButton, ButtonText} from '#/components/Button'
55
56
import {ArrowOutOfBox_Stroke2_Corner0_Rounded as Share} from '#/components/icons/ArrowOutOfBox'
56
57
import {CircleInfo_Stroke2_Corner0_Rounded as CircleInfo} from '#/components/icons/CircleInfo'
57
-
import {DotGrid_Stroke2_Corner0_Rounded as Ellipsis} from '#/components/icons/DotGrid'
58
58
import {
59
59
Heart2_Filled_Stroke2_Corner0_Rounded as HeartFilled,
60
60
Heart2_Stroke2_Corner0_Rounded as HeartOutline,
···
303
303
a.align_center,
304
304
a.rounded_full,
305
305
{height: 36, width: 36},
306
-
t.atoms.bg_contrast_50,
306
+
t.atoms.bg_contrast_25,
307
307
(state.hovered || state.pressed) && [
308
-
t.atoms.bg_contrast_100,
308
+
t.atoms.bg_contrast_50,
309
309
],
310
310
]}
311
311
testID="headerDropdownBtn">
312
-
<Ellipsis
313
-
size="lg"
314
-
fill={t.atoms.text_contrast_medium.color}
312
+
<FontAwesomeIcon
313
+
icon="ellipsis"
314
+
size={20}
315
+
style={t.atoms.text}
315
316
/>
316
317
</Pressable>
317
318
)