feat: 添加对 100dvh 支持的样式调整,优化布局适应性
This commit is contained in:
@ -20,4 +20,7 @@ a {
|
||||
|
||||
.layout-wrapper {
|
||||
min-height: 100vh;
|
||||
@supports (min-height: 100dvh) {
|
||||
min-height: 100dvh;
|
||||
}
|
||||
}
|
||||
|
@ -5,6 +5,9 @@
|
||||
justify-content: space-between;
|
||||
padding: 6rem 2rem 0 2rem;
|
||||
transition: margin-left var(--layout-section-transition-duration);
|
||||
@supports (min-height: 100dvh) {
|
||||
min-height: 100dvh;
|
||||
}
|
||||
}
|
||||
|
||||
.layout-main {
|
||||
|
@ -15,6 +15,10 @@
|
||||
background-color: var(--surface-overlay);
|
||||
border-radius: var(--content-border-radius);
|
||||
padding: 0.5rem 1.5rem;
|
||||
|
||||
@supports (height: 100dvh) {
|
||||
height: calc(100dvh - 8rem);
|
||||
}
|
||||
}
|
||||
|
||||
.layout-menu {
|
||||
|
@ -30,6 +30,10 @@
|
||||
0px 3px 5px rgba(0, 0, 0, 0.02),
|
||||
0px 0px 2px rgba(0, 0, 0, 0.05),
|
||||
0px 1px 4px rgba(0, 0, 0, 0.08);
|
||||
|
||||
@supports (height: 100dvh) {
|
||||
height: 100dvh;
|
||||
}
|
||||
}
|
||||
|
||||
&.layout-overlay-active {
|
||||
@ -84,6 +88,10 @@
|
||||
transition:
|
||||
transform 0.4s cubic-bezier(0.05, 0.74, 0.2, 0.99),
|
||||
left 0.4s cubic-bezier(0.05, 0.74, 0.2, 0.99);
|
||||
|
||||
@supports (height: 100dvh) {
|
||||
height: 100dvh;
|
||||
}
|
||||
}
|
||||
|
||||
.layout-mask {
|
||||
|
Reference in New Issue
Block a user