prehistoric-systems/omnivore
1
0
Fork 0
mirror of https://github.com/omnivore-app/omnivore.git synced 2026-03-11 08:54:26 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Different alphas for light and dark highlights

Browse source
This commit is contained in:
Jackson Harper 2023-06-27 13:24:11 +08:00
parent 976a0cb88c
commit c5cb6097b3
1 changed files with 4 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

7
packages/web/components/patterns/HighlightView.tsx
View file

@ -74,6 +74,8 @@ export function HighlightView(props: HighlightViewProps): JSX.Element {
const { getReferenceProps, getFloatingProps } = useInteractions([hover])
const highlightAlpha = isDark ? 1.0 : 0.35
return (
<VStack
ref={refs.setReference}
@ -115,9 +117,8 @@ export function HighlightView(props: HighlightViewProps): JSX.Element {
m: '0px',
display: 'inline',
padding: '2px',
backgroundColor: 'rgba(var(--colors-highlightBackground), 1)',
boxShadow:
'1px 0 0 rgba(var(--colors-highlightBackground), 1), -1px 0 0 rgba(var(--colors-highlightBackground),1)',
backgroundColor: `rgba(var(--colors-highlightBackground), ${highlightAlpha})`,
boxShadow: `1px 0 0 rgba(var(--colors-highlightBackground), ${highlightAlpha}), -1px 0 0 rgba(var(--colors-highlightBackground), ${highlightAlpha})`,
boxDecorationBreak: 'clone',
borderRadius: '2px',
},