nilix/legit
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

css: single column index on small screens

Browse source
This commit is contained in:
Anirudh Oppiliappan 2022-12-18 20:07:27 +05:30
parent d0d636aa89
commit 0e6eaa2113
No known key found for this signature in database
GPG key ID: 8A93F96F78C5D4C4
2 changed files with 13 additions and 15 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

21
static/style.css
View file

@ -41,7 +41,7 @@ main, footer {
line-height: 160%; line-height: 160%;
} }
main h1, h2, h3, .small-heading { main h1, h2, h3, strong {
font-family: var(--display-font); font-family: var(--display-font);
font-weight: 500; font-weight: 500;
} }
@ -97,26 +97,20 @@ a:hover {
} }
.index { .index {
padding-top: 2em;
display: grid; display: grid;
grid-template-columns: 6em 1fr minmax(0, 7em); grid-template-columns: 6em 1fr minmax(0, 7em);
grid-row-gap: 0.5em; grid-row-gap: 0.5em;
min-width: 0; 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 { .clone-url {
padding-top: 2rem; padding-top: 2rem;
} }
.clone-url pre { .clone-url pre {
color: var(--dark); color: var(--dark);
white-space: pre-wrap;
} }
.desc { .desc {
@ -252,6 +246,15 @@ a:hover {
grid-row-gap: 0em; 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) { .commit-info:not(:last-child) {
padding-bottom: 1.5rem; padding-bottom: 1.5rem;
} }

7
templates/index.html
View file

@ -12,14 +12,9 @@
</header> </header>
<body> <body>
<main> <main>
<div class="index-headings small-heading">
<div>repository</div>
<div>description</div>
<div>idle</div>
</div>
<div class="index"> <div class="index">
{{ range .info }} {{ 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 class="desc">{{ .Desc }}</div>
<div>{{ .Idle }}</div> <div>{{ .Idle }}</div>
{{ end }} {{ end }}