Chosto
/
blog
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Design of blog posts' hero starting to be ok

master
Quentin Duchemin 2021-05-25 03:25:30 +02:00
parent a5095a465a
commit c7e8c504f8
Signed by: Chosto
GPG Key ID: 0547178FEEDE7D6B
1 changed files with 32 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

53
themes/chosto/layouts/partials/header.html
View File

@ -1,31 +1,42 @@
<header>
<section class="hero is-primary is-medium has-bg-img">
<div class="hero-body has-text-centered">
<p class="title is-1 is-uppercase">{{ .Title }}</p>
{{ with .Params.subtitle }}
<p class="subtitle is-2">{{ . }}</p>
{{ end }}
<section class="hero is-primary has-text-centered is-medium">
<div class="hero-head mt-5">
{{ with .Params.categories }}
<div class="tags colums is-centered is-rounded">
<div class="tags colums mb-2 mx-5">
{{ range . }}
<span class="tag is-large mx-2"><a href="{{ "categories" | absURL }}/{{ . | urlize }}">{{ . }}</a></span>
<span class="tag is-info is-light is-large mr-4"><a href="{{ "categories" | absURL }}/{{ . | urlize }}">{{ . }}</a></span>
{{ end }}
</div>
{{ end }}
<!-- Words and date stuff makes sens only for blog posts, not other pages -->
{{ if (and .IsPage (eq .FirstSection.Section "posts"))}}
<aside>
<div>
<section>
<time class="post-date" datetime="{{ .Date.Format `2006-01-02T15:04:05Z07:00` | safeHTML }}">
Article publié le {{ .Date.Day }} {{ index $.Site.Data.months_fr (printf "%d" .Date.Month) }} {{ .Date.Year }} (dernière modification le {{ .Lastmod.Day }} {{ index $.Site.Data.months_fr (printf "%d" .Lastmod.Month) }}
{{ .Lastmod.Year }})
</time>
<h4>{{ .FuzzyWordCount }} mots </h4>
</section>
</div>
</aside>
</div>
<div class="hero-body">
<p class="title is-1 is-uppercase">{{ .Title }}</p>
{{ with .Params.subtitle }}
<p class="subtitle is-2">{{ . }}</p>
{{ end }}
</div>
<!-- Words and date stuff makes sens only for blog posts, not other pages -->
{{ if (and .IsPage (eq .FirstSection.Section "posts"))}}
<div class="hero-foot mb-5 mx-5">
<div class="level subtitle is-5">
<div class="level-left">
<div class="level-item has-text-left">
<time class="" datetime="{{ .Date.Format `2006-01-02T15:04:05Z07:00` | safeHTML }}">
<p class="mb-2">📅&nbsp;&nbsp;Article publié le {{ .Date.Day }} {{ index $.Site.Data.months_fr (printf "%d" .Date.Month) }} {{ .Date.Year }}</p>
<p>✏️&nbsp;&nbsp;Dernière modification le {{ .Lastmod.Day }} {{ index $.Site.Data.months_fr (printf "%d" .Lastmod.Month) }} {{ .Lastmod.Year }}</p>
</time>
</div>
</div>
<div class="level-right">
<div class="level-item has-text-right">
<div>
<p class="mb-2">🕑&nbsp;&nbsp;Environ {{ div .FuzzyWordCount 230 }} minutes de lecture</p>
<p>#️{{ .FuzzyWordCount }} mots</p>
</div>
</div>
</div>
</div>
</div>
{{ end }}
</section>
</header>