raghnarok/hugo_frigg
1
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

[THEME] Fix the archives layout for smartphones

Browse source
This commit is contained in:
Gregory Trolliet 2021-10-31 12:35:58 +01:00
parent 8dd30f6eb8
commit 6bcfb62486
2 changed files with 17 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
layouts/archives/li.html
View file

@ -1,5 +1,8 @@
<a class="archive hidden_link" href="{{ .Params.ExternalLink | default .RelPermalink }}"> <a class="archive hidden_link" href="{{ .Params.ExternalLink | default .RelPermalink }}">
<img class="thumbnail" src="{{ .RelPermalink }}/thumb.jpg" /> <img class="thumbnail" src="{{ .RelPermalink }}/thumb.jpg" />
<span class="description">{{ .Title }}</span> <div class="description">
<span class="title">{{ .Title }}</span>
<p>{{ .Description }}</p>
<span class="more">&rarr; plus d'infos</span> <span class="more">&rarr; plus d'infos</span>
</div>
</a> </a>

17
static/css/style.css
View file

@ -351,11 +351,10 @@ a.not(.anchor):focus {
height: 100px; height: 100px;
} }
.archives-list .thumbnail { .archives-list .thumbnail {
display: block; display: inline-block;
width: 15em; width: 15em;
text-align: left; text-align: left;
padding-right: 1.5em; margin-right: 1.5em;
float: left;
} }
@media only screen and (min-width: 768px) { @media only screen and (min-width: 768px) {
.archives-list .thumbnail { .archives-list .thumbnail {
@ -363,8 +362,16 @@ a.not(.anchor):focus {
text-align: right; text-align: right;
} }
} }
.archives-list .title {
font-weight: bold;
}
.archives-list .description { .archives-list .description {
height: 100%; display: inline-block;
min-width: 10em;
vertical-align: top;
}
.archives-list .description>p {
min-height: 3em;
} }
.archive .more { .archive .more {
position: absolute; position: absolute;
@ -849,7 +856,7 @@ blockquote:after {
color: #fafafa; color: #fafafa;
background-color: var(--background-color-dark); background-color: var(--background-color-dark);
border: solid 5px var(--font-color-em); border: solid 5px var(--font-color-em);
padding: 10px 15px; padding: 0.7em 0.9em 0.6em 0.9em;
border-radius: 1px; border-radius: 1px;
text-decoration: none; text-decoration: none;
opacity: 50%; opacity: 50%;