Use flexbox for more stuff

This commit is contained in:
BBaoVanC 2021-11-13 17:23:30 -06:00
parent 96893d7de6
commit 240476061b
Signed by: bbaovanc
GPG Key ID: 18089E4E3CCF1D3A
2 changed files with 49 additions and 38 deletions

View File

@ -4,10 +4,19 @@
/* Post layout (in list pages) */
.list-page-content {
display: flex;
flex-direction: column;
gap: 40px;
}
.page-list ul,
.series-taxonomy ul {
display: flex;
flex-direction: column;
list-style: none;
padding: 0;
gap: 40px;
}
.page-list li,
@ -20,11 +29,6 @@
background-color: #222;
}
.page-list li+li,
.series-taxonomy > ul > li+li {
margin: 40px 0;
}
.post-title {
margin-bottom: 10px;
}
@ -81,8 +85,13 @@
/* Subsection formatting */
.sections {
display: flex;
flex-direction: column;
gap: 40px;
}
.section {
margin-bottom: 40px;
background-color: #222;
border-radius: 12px;
padding: 1px 25px;

View File

@ -10,43 +10,45 @@
</span>
</h1>
{{ with .Sections }}
<div class="sections">
{{ range . }}
<div class="list-page-content">
{{ with .Sections }}
<div class="sections">
{{ range . }}
<a class="section-anchor" href="{{ .Permalink }}">
<div class="section">
<h2 class="section-title">
{{ with .Params.icon }}{{ partial "icon.html" . }}{{ end }}
{{ .Title | markdownify }}
</h2>
<a class="section-anchor" href="{{ .Permalink }}">
<div class="section">
<h2 class="section-title">
{{ with .Params.icon }}{{ partial "icon.html" . }}{{ end }}
{{ .Title | markdownify }}
</h2>
<div class="section-description">
{{ if .Description }}
<p>
{{ .Description | markdownify }}
</p>
{{ else }}
{{ .Summary }}
{{ end }}
<div class="section-description">
{{ if .Description }}
<p>
{{ .Description | markdownify }}
</p>
{{ else }}
{{ .Summary }}
{{ end }}
</div>
</div>
</div>
</a>
</a>
{{ end }}
</div>
{{ end }}
<div class="page-list">
<ul>
{{ range .Paginator.Pages }}
<li>{{ .Render "summary" }}</li>
{{ else }}
<div>
{{ i18n "no_posts" }}
</div>
{{ end }}
</ul>
</div>
{{ end }}
<div class="page-list">
<ul>
{{ range .Paginator.Pages }}
<li>{{ .Render "summary" }}</li>
{{ else }}
<div>
{{ i18n "no_posts" }}
</div>
{{ end }}
</ul>
</div>
</div>
{{ if gt .Paginator.TotalPages 1 }}