mirror of
https://github.com/zombieFox/nightTab.git
synced 2025-06-26 12:31:47 +02:00
[design] improve menu layout
This commit is contained in:
parent
588fc3654d
commit
a046c3c40e
17
css/menu.css
17
css/menu.css
@ -44,7 +44,7 @@
|
|||||||
|
|
||||||
.menu-content-area {
|
.menu-content-area {
|
||||||
display: grid;
|
display: grid;
|
||||||
grid-template-columns: repeat(auto-fill, 1fr);
|
grid-template-columns: 1fr;
|
||||||
grid-gap: 2em;
|
grid-gap: 2em;
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -81,16 +81,19 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.menu-content-area {
|
.menu-content-area {
|
||||||
grid-template-columns: repeat(auto-fill, minmax(12em, 1fr));
|
grid-template-columns: repeat(2, 1fr);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@media (min-width: 900px) {
|
@media (min-width: 900px) {
|
||||||
.menu {
|
.menu {
|
||||||
width: calc(50vw - 2em);
|
width: calc(60vw - 2em);
|
||||||
}
|
max-height: calc(100vh - 2em);
|
||||||
|
}
|
||||||
.menu-content-area {
|
}
|
||||||
grid-template-columns: repeat(auto-fill, minmax(20em, 1fr));
|
|
||||||
|
@media (min-width: 1100px) {
|
||||||
|
.menu {
|
||||||
|
width: calc(50vw - 2em);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
Loading…
x
Reference in New Issue
Block a user