[THEME] Fix the archives layout for smartphones

layouts/archives/li.html

@@ -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>

static/css/style.css

@@ -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 {
 		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 {
 	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%;