Edit opacity from 0.8 to 0.5 and remove forBackdropFilter (#5291)

Update for #4836 

- edit primary and secondary transparency opacities from 0.8 to 0.5
- remove forBackdropFilter from themes
- update components referencing transparency/primary and
transparency/secondary to have the following backdrop-filter: blur(12px)
saturate(200%) contrast(50%) brightness(130%)

---------

Co-authored-by: Félix Malfait <felix.malfait@gmail.com>
This commit is contained in:
Joe S
2024-05-16 11:19:27 -04:00
committed by GitHub
parent a75eb0a569
commit 9bc9513845
14 changed files with 29 additions and 31 deletions

View File

@ -12,9 +12,9 @@ import { useSetHotkeyScope } from '@/ui/utilities/hotkey/hooks/useSetHotkeyScope
import { getOperandsForFilterType } from '../utils/getOperandsForFilterType';
export const StyledInput = styled.input`
background: ${({ theme }) => theme.background.secondary};
background: transparent;
border: none;
border-top: 1px solid ${({ theme }) => theme.border.color.light};
border-top: none;
border-bottom: 1px solid ${({ theme }) => theme.border.color.light};
border-radius: 0;
border-top-left-radius: ${({ theme }) => theme.border.radius.md};
@ -23,7 +23,7 @@ export const StyledInput = styled.input`
margin: 0;
outline: none;
padding: ${({ theme }) => theme.spacing(2)};
height: 20px;
height: 19px;
font-family: inherit;
font-size: ${({ theme }) => theme.font.size.sm};

View File

@ -15,16 +15,16 @@ import { HotkeyScope } from '@/ui/utilities/hotkey/types/HotkeyScope';
import { SORT_DIRECTIONS } from '../types/SortDirection';
export const StyledInput = styled.input`
background: ${({ theme }) => theme.background.secondary};
background: transparent;
border: none;
border-top: 1px solid ${({ theme }) => theme.border.color.light};
border-top: none;
border-bottom: 1px solid ${({ theme }) => theme.border.color.light};
border-radius: 0;
color: ${({ theme }) => theme.font.color.primary};
margin: 0;
outline: none;
padding: ${({ theme }) => theme.spacing(2)};
height: 20px;
height: 19px;
font-family: inherit;
font-size: ${({ theme }) => theme.font.size.sm};