Neshweb-Sites/main-site
Neshweb-Sites/main-site
1
0
Fork 0
Code Issues 2 Pull requests Releases 9 Packages Activity Actions

Added blur to sidebar for transparent background colors

Browse source
This commit is contained in:
Neshura 2022-12-19 21:36:41 +01:00
parent 0a1592db73
commit 26ac430d7e
No known key found for this signature in database
GPG key ID: ACDF5B6EBECF6B0A
1 changed files with 4 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

7
components/styles/navbar/mobile.tsx
View file

@ -54,12 +54,13 @@ export const NavSideMenu = styled.div <ActivePropType>`
} }
return ret; return ret;
}}; }};
backdrop-filter: ${props => props.active ? "blur(5px)" : ""};
overflow-x: hidden; overflow-x: hidden;
transition-property: max-width, max-height, border-right, background-color; transition-property: max-width, max-height, border-right, background-color, backdrop-filter;
transition-timing-function: ease-in-out; transition-timing-function: ease-in-out;
transition-duration: 0.15s, 0s, 0s, 0s; transition-duration: 0.15s, 0s;
transition-delay: ${props => props.active ? "0s, 0s, 0s, 0s" : "0s, 0.15s, 0.15s, 0.15s"}; transition-delay: ${props => props.active ? "0s" : "0s, 0.15s"};
` `
export const NavSideMenuPanel = styled.div <ActivePropType>` export const NavSideMenuPanel = styled.div <ActivePropType>`