RageStudio/comty
1
0
Fork 0
mirror of https://github.com/ragestudio/comty.git synced 2025-06-11 03:24:16 +00:00
Code Issues Packages Projects Releases Wiki Activity

update drawer style

Browse Source
This commit is contained in:
SrGooglo 2023-06-24 12:00:23 +00:00
parent 7397b14d3e
commit 26b5d2e054
1 changed files with 74 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

92
packages/app/src/components/Layout/drawer/index.less
View File

@ -1,26 +1,82 @@
.drawer { .draggable-drawer {
.body { position: fixed;
position: absolute;
top: 50px; top: 0;
left: 0;
right: 0;
bottom: 0;
display: flex;
justify-content: center;
flex-shrink: 0;
align-items: center;
z-index: 40;
transition: background-color 0.2s linear;
overflow-y: hidden;
overscroll-behavior: none;
.draggable-drawer_body {
position: absolute;
bottom: 0px;
padding: 30px 10px 10px 10px;
background-color: var(--background-color-primary);
width: 100%; width: 100%;
max-width: 700px; max-width: 700px;
min-height: 100%;
height: fit-content;
max-height: 90%;
padding: 30px 10px 10px 10px;
background-color: var(--background-color-primary);
border-top-left-radius: 8px; border-top-left-radius: 8px;
border-top-right-radius: 8px; border-top-right-radius: 8px;
} z-index: 50;
.body::before{ .dragger-area {
content: ""; width: 100%;
background-color: var(--background-color-contrast); height: 10px;
width: 100px;
height: 8px; position: absolute;
position: absolute; display: flex;
top: 10px; align-items: center;
left: 50%; justify-content: center;
transform: translateX(-50%);
border-radius: 8px; top: 10px;
left: 0;
z-index: 55;
.dragger-indicator {
background-color: var(--background-color-contrast);
width: 100px;
height: 8px;
border-radius: 8px;
}
}
&::after {
content: "";
display: block;
position: fixed;
left: 0;
bottom: 0;
width: 100%;
height: 120px;
z-index: 45;
background-color: var(--background-color-primary);
transform: translateY(95%);
}
} }
} }