mobile styling

This commit is contained in:
caandt 2024-09-19 19:45:39 -05:00
parent 611688bdb6
commit f947a95f49
2 changed files with 13 additions and 6 deletions

View file

@ -164,7 +164,7 @@ def index_dir(dir):
title: '{dir}' title: '{dir}'
--- ---
<div class="container"> <div class="container">
<div class="panel"> <div class="panel m">
<h2>{dir}</h2> <h2>{dir}</h2>
<a href="..">back</a> <a href="..">back</a>
<ul> <ul>

View file

@ -69,17 +69,17 @@ a:hover, .a:hover, .fa:hover span, #vol:hover span {
.dn { display: none; } .dn { display: none; }
.f { flex: 1 } .f { flex: 1 }
.fg { flex-grow: 1; } .fg { flex-grow: 1; }
.c { text-align: center; }
.c2 {
justify-content: center;
padding: 10vh;
}
.container { .container {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
margin: 0 auto; margin: 0 auto;
max-width: var(--width); max-width: var(--width);
} }
@media (max-width: 450px) {
#content .container {
flex-flow: column;
}
}
.panel { .panel {
margin: 10px; margin: 10px;
padding: 15px; padding: 15px;
@ -88,6 +88,13 @@ a:hover, .a:hover, .fa:hover span, #vol:hover span {
min-width: 130px; min-width: 130px;
overflow: hidden; overflow: hidden;
} }
.m { width: max-content; }
.c {
text-align: center;
width: min-content;
margin: 10vh auto;
}
.c2 { justify-content: center; }
header { header {
position: sticky; position: sticky;
top: 0; top: 0;