Simplified media queries

This commit is contained in:
Sasha Koshka 2022-10-09 14:40:18 -04:00
parent f4818a5a31
commit aeb2e68f34
1 changed files with 19 additions and 20 deletions

View File

@ -100,8 +100,11 @@ header .buttonList {
padding: 1rem;
}
/* smallest */
@media screen and not (min-width: 67rem) {
@media screen and not (min-width: 60rem) {
aside {
margin-bottom: 1rem;
}
nav .buttonListWrap {
position: relative;
}
@ -127,35 +130,31 @@ header .buttonList {
var(--background) 100%);
}
nav > .buttonListWrap:first-child {
text-align: center;
}
nav > .buttonListWrap:last-child {
margin-top: 1rem;
}
}
@media screen and (min-width: 67rem) {
nav {
display: grid;
grid-grid: 1rem;
grid-template-columns: auto auto;
}
nav > .buttonListWrap:last-child {
text-align: right;
}
}
@media screen and not (min-width: 60rem) {
aside {
margin-bottom: 1rem;
}
}
@media screen and (min-width: 60rem) {
#contentWrap {
display: grid;
grid-gap: 2rem;
grid-template-columns: 24rem auto;
}
nav {
display: grid;
grid-grid: 1rem;
grid-template-columns: auto auto;
}
nav > .buttonListWrap:last-child {
text-align: right;
}
}
@media screen and not (min-width: 80rem) {