Tools/Notes
1
0
Fork 0
mirror of https://github.com/TriliumNext/Notes.git synced 2025-07-29 19:12:27 +08:00
Code Issues Packages Projects Releases Wiki Activity

style(mobile): improve sidebar animation

Browse Source
This commit is contained in:
Elian Doran 2024-12-28 14:22:38 +02:00
parent 8568e4b898
commit cd0df29307
No known key found for this signature in database
1 changed files with 12 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
src/public/stylesheets/style.css
View File

@ -1176,21 +1176,27 @@ body:not(.mobile) #launcher-pane.horizontal .dropdown-submenu > .dropdown-menu {
#mobile-sidebar-container { #mobile-sidebar-container {
position: absolute; position: absolute;
top: 0; top: 0;
left: 0; left: 0;
right: 0;
bottom: var(--launcher-pane-size); bottom: var(--launcher-pane-size);
z-index: -1000;
}
#mobile-sidebar-container.show {
padding-top: env(safe-area-inset-top); padding-top: env(safe-area-inset-top);
z-index: 1000; z-index: 1000;
transform: translateX(-100%); background-color: rgba(0, 0, 0, 0.3);
transition: transform 250ms ease-in-out; transition: background-color 250ms ease-in-out;
backdrop-filter: blur(20px);
} }
#mobile-sidebar-wrapper { #mobile-sidebar-wrapper {
width: 85vw; width: 85vw;
transform: translateX(-100%);
transition: transform 250ms ease-in-out;
background: var(--main-background-color); background: var(--main-background-color);
} }
#mobile-sidebar-container.show { #mobile-sidebar-container.show #mobile-sidebar-wrapper {
transform: translateX(0); transform: translateX(0);
} }