Better responsiveness

This commit is contained in:
Sasha Koshka 2022-10-08 21:27:33 -04:00
parent 7102e4fc0d
commit 24a6cd99f2

View File

@ -113,11 +113,7 @@ header {
padding: 1rem; padding: 1rem;
} }
@media screen and not (min-width: 70rem) { @media screen and not (min-width: 67rem) {
aside {
margin-bottom: 1rem;
}
nav .buttonListWrap { nav .buttonListWrap {
position: relative; position: relative;
} }
@ -142,15 +138,13 @@ header {
transparent 0%, transparent 0%,
var(--background) 100%); var(--background) 100%);
} }
nav > .buttonListWrap:last-child {
margin-top: 1rem;
}
} }
@media screen and (min-width: 70rem) { @media screen and (min-width: 67rem) {
#contentWrap {
display: grid;
grid-gap: 1rem;
grid-template-columns: 24rem auto;
}
nav { nav {
display: grid; display: grid;
grid-grid: 1rem; grid-grid: 1rem;
@ -162,6 +156,20 @@ header {
} }
} }
@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;
}
}
@media screen and (min-width: 80rem) { @media screen and (min-width: 80rem) {
#contentWrap { #contentWrap {
grid-template-columns: 36rem auto; grid-template-columns: 36rem auto;
@ -176,12 +184,16 @@ header {
.files tr { .files tr {
display: grid; display: grid;
grid-template-columns: 30% auto 30%; grid-template-columns: 30% auto min-content;
gap: 1rem;
} }
.files td { .files td {
border: none; border: none;
padding: 0; padding: 0;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
} }
.files td:last-child { .files td:last-child {