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