Browse Source

[THEME] Fix the archives layout for smartphones

main
Gregory Trolliet 8 months ago
parent
commit
6bcfb62486
  1. 7
      layouts/archives/li.html
  2. 17
      static/css/style.css

7
layouts/archives/li.html

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

17
static/css/style.css

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

Loading…
Cancel
Save