Something went wrong. Try again.
hardened bluesky app fork with microcosm
Something went wrong. Try again.
1.2 kB · 52 lines
TSX
at main
1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253import {View} from 'react-native'
import {atoms as a, useTheme, type ViewStyleProp, web as webOnly} from '#/alf'import {IS_NATIVE, IS_WEB, IS_WEB_TOUCH_DEVICE} from '#/env'
export function SubtleHover({ style, hover, web = true, native = false,}: ViewStyleProp & {hover: boolean; web?: boolean; native?: boolean}) { const t = useTheme()
let opacity: number switch (t.name) { case 'dark': opacity = 0.4 break case 'dim': opacity = 0.45 break case 'light': opacity = 0.5 break }
const el = ( <View style={[ a.absolute, a.inset_0, a.pointer_events_none, a.transition_opacity, t.atoms.bg_contrast_50, style, // Force Safari to composite the overlay on its own GPU layer. // This fixes a layout shift that happens due to different subpixel // rounding when the overlay is composited on hover. webOnly({willChange: 'opacity'}), {opacity: hover ? opacity : 0}, ]} /> )
if (IS_WEB && web) { return IS_WEB_TOUCH_DEVICE ? null : el } else if (IS_NATIVE && native) { return el }
return null}