diff options
| -rw-r--r-- | src/alf/atoms.ts | 5 | ||||
| -rw-r--r-- | src/view/shell/desktop/LeftNav.tsx | 9 |
2 files changed, 12 insertions, 2 deletions
diff --git a/src/alf/atoms.ts b/src/alf/atoms.ts index 434420a97..fe8cf9a78 100644 --- a/src/alf/atoms.ts +++ b/src/alf/atoms.ts @@ -1,4 +1,4 @@ -import {Platform, StyleSheet, ViewStyle} from 'react-native' +import {Platform, StyleProp, StyleSheet, ViewStyle} from 'react-native' import * as tokens from '#/alf/tokens' import {native, web} from '#/alf/util/platform' @@ -887,6 +887,9 @@ export const atoms = { user_select_all: { userSelect: 'all', }, + outline_inset_1: { + outlineOffset: '-1px', + } as StyleProp<ViewStyle>, /* * Text decoration diff --git a/src/view/shell/desktop/LeftNav.tsx b/src/view/shell/desktop/LeftNav.tsx index 1a9ce2005..de3a8190d 100644 --- a/src/view/shell/desktop/LeftNav.tsx +++ b/src/view/shell/desktop/LeftNav.tsx @@ -185,7 +185,14 @@ function NavItem({count, href, icon, iconFilled, label}: NavItemProps) { return ( <PressableWithHover - style={[a.flex_row, a.align_center, a.p_md, a.rounded_sm, a.gap_sm]} + style={[ + a.flex_row, + a.align_center, + a.p_md, + a.rounded_sm, + a.gap_sm, + a.outline_inset_1, + ]} hoverStyle={t.atoms.bg_contrast_25} // @ts-ignore the function signature differs on web -prf onPress={onPressWrapped} |