css: single column index on small screens
Anirudh Oppiliappan x@icyphox.sh
PGP Signature
-----BEGIN PGP SIGNATURE----- iQEzBAABCgAdFiEE/huPz+bBYiLxVxyOipP5b3jF1MQFAmOfJcEACgkQipP5b3jF 1MTLMwf8DxqPyXPfqYCeI/1w65xB+79iLYEVgp1uIiCiz7TB8HBvDunY0Znjm7Wi KFVdF+wqACF617uANfm0yBLcFlIt5RHn3wxyyTk3IIMmzNI+gnw9zM72e7rvz0Q+ vJJCgBoPGPD/FTaQKldHD5ygJkpRGF0uT0e/n6bTP4mZ8rmHLN876arTjRyxL0Gf BU/5FswtTNfE5UC7GSkbRZSdLO1n7sc6whm2Hio0pbs5SBIsfFd7lXuw3dTqtThZ yQ5jhIG4Qi5+QmZN5+Cz7XTMEuNCtk6Zf6mdDEQ/KPB7+kNWJ452Nny4QdBk0CyZ YC5b0AZscaeBfxHpxJdT+Ed46CdgaQ== =xxsd -----END PGP SIGNATURE-----
2 files changed,
13 insertions(+),
15 deletions(-)
M
static/style.css
→
static/style.css
@@ -41,7 +41,7 @@ padding: 0;
line-height: 160%; } -main h1, h2, h3, .small-heading { +main h1, h2, h3, strong { font-family: var(--display-font); font-weight: 500; }@@ -97,26 +97,20 @@ border-bottom: 1.5px solid var(--gray);
} .index { + padding-top: 2em; display: grid; grid-template-columns: 6em 1fr minmax(0, 7em); grid-row-gap: 0.5em; min-width: 0; } -.index-headings { - display: grid; - grid-template-columns: 6em 1fr minmax(0, 7em); - padding-bottom: 1.2em; - padding-top: 1.2em; - min-width: 0; -} - .clone-url { padding-top: 2rem; } .clone-url pre { color: var(--dark); + white-space: pre-wrap; } .desc {@@ -250,6 +244,15 @@
.log { grid-template-columns: 1fr; grid-row-gap: 0em; + } + + .index { + grid-template-columns: 1fr; + grid-row-gap: 0em; + } + + .index-name:not(:first-child) { + padding-top: 1.5rem; } .commit-info:not(:last-child) {
M
templates/index.html
→
templates/index.html
@@ -12,14 +12,9 @@ <h2>{{ .meta.Description }}</h2>
</header> <body> <main> - <div class="index-headings small-heading"> - <div>repository</div> - <div>description</div> - <div>idle</div> - </div> <div class="index"> {{ range .info }} - <div><a href="/{{ .Name }}">{{ .Name }}</a></div> + <div class="index-name"><a href="/{{ .Name }}">{{ .Name }}</a></div> <div class="desc">{{ .Desc }}</div> <div>{{ .Idle }}</div> {{ end }}