Browse Source

First version of the theme

main v0.1.0
Gregory Trolliet 8 months ago
commit
8dd30f6eb8
  1. 11
      CHANGELOG.md
  2. 20
      LICENSE
  3. 104
      README.md
  4. 10
      archetypes/default.md
  5. 12
      data/snotra/mois.yaml
  6. 51
      i18n/fr.toml
  7. 20
      layouts/404.html
  8. 7
      layouts/_default/_markup/render-heading.html
  9. 12
      layouts/_default/baseof.html
  10. 6
      layouts/_default/li.html
  11. 28
      layouts/_default/list.html
  12. 26
      layouts/_default/rss.xml
  13. 16
      layouts/_default/single.html
  14. 5
      layouts/archives/li.html
  15. 24
      layouts/archives/list.html
  16. 63
      layouts/archives/single.html
  17. 21
      layouts/index.html
  18. 24
      layouts/partials/article-footer.html
  19. 9
      layouts/partials/author.html
  20. 13
      layouts/partials/categories.html
  21. 5
      layouts/partials/footer.html
  22. 0
      layouts/partials/head.html
  23. 46
      layouts/partials/header.html
  24. 22
      layouts/partials/navigation.html
  25. 38
      layouts/partials/opengraph.html
  26. 51
      layouts/partials/pagination.html
  27. 11
      layouts/partials/social.html
  28. 11
      layouts/partials/tags.html
  29. 42
      layouts/shortcodes/img.html
  30. 18
      layouts/shortcodes/quote.html
  31. 3
      layouts/shortcodes/table_of_contents.html
  32. 8
      layouts/shortcodes/tabular.html
  33. 876
      static/css/style.css
  34. 1
      static/svg/500px.svg
  35. 3
      static/svg/bars.svg
  36. 1
      static/svg/calendar.svg
  37. 1
      static/svg/clock.svg
  38. 1
      static/svg/codepen.svg
  39. 1
      static/svg/envelope.svg
  40. 1
      static/svg/facebook.svg
  41. 1
      static/svg/file-text.svg
  42. 1
      static/svg/flickr.svg
  43. 1
      static/svg/folder.svg
  44. 1
      static/svg/gitea.svg
  45. 1
      static/svg/github.svg
  46. 1
      static/svg/gitlab.svg
  47. 1
      static/svg/instagram.svg
  48. 1
      static/svg/key-modern.svg
  49. 1
      static/svg/linkedin.svg
  50. 1
      static/svg/mastodon.svg
  51. 1
      static/svg/peertube.svg
  52. 1
      static/svg/phone.svg
  53. 1
      static/svg/pinterest.svg
  54. 1
      static/svg/pixelfed.svg
  55. 1
      static/svg/rss.svg
  56. 1
      static/svg/tag.svg
  57. 1
      static/svg/threema.svg
  58. 1
      static/svg/tumblr.svg
  59. 1
      static/svg/twitter.svg
  60. 1
      static/svg/youtube.svg
  61. 16
      theme.toml

11
CHANGELOG.md

@ -0,0 +1,11 @@ @@ -0,0 +1,11 @@
# Changelog
All notable changes to this project will be documented in this file.
The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
## [Unreleased]
## [v0.1.0] - 2021-10-26
### Added
* First version of the theme

20
LICENSE

@ -0,0 +1,20 @@ @@ -0,0 +1,20 @@
The MIT License (MIT)
Copyright (c) 2021 Gregory Trolliet
Permission is hereby granted, free of charge, to any person obtaining a copy of
this software and associated documentation files (the "Software"), to deal in
the Software without restriction, including without limitation the rights to
use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of
the Software, and to permit persons to whom the Software is furnished to do so,
subject to the following conditions:
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS
FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR
COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER
IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

104
README.md

@ -0,0 +1,104 @@ @@ -0,0 +1,104 @@
# Hugo theme : Frigg
This is a dark and classy Hugo theme.
## Installation
To install Simple-site theme, you can simply clone the repository
to your site's theme directory.
```bash
$ mkdir themes
$ cd themes
$ git clone https://git.vulgarisons.info/raghnarok/hugo_frigg.git snotra
```
Don't forget to change the theme in your config.toml file.
## Configuration
### Base
```toml
baseurl = "https://yourdoma.in" # The base url of your Hugo website
title = "Title" # The title of your website
author = "Author" # The author of the website
language = "fr"
theme = "frigg" # The Hugo theme
```
### Menu
The menu is generated following all the files in the root directory
and the articles in the *blog* directory.
To avoid the *blog* entry to be pluralized,
add the following option to your config file:
```toml
pluralizeListTitles = false
```
### Description
You can use some parameters to fill meta tags and bases images:
```toml
[params]
description = "" # Description for the meta tag
favicon = "" # Favicon URL
logo = "" # Logo URL
keyword = "" # Keywords for the meta tag
```
The favicon is only the filename,
the file should be in *static/images* directory.
If favicon isn't set, the default test values are favicon.svg and favicon.png.
If none exists, there will be no favicon.
### Home page
The home page use one avatar, the name and one description.
Every pages get a list of social networks and others links.
For the social networks, see *Social Networks* chapter.
```toml
[params]
author = "Author" # The author of the website
info = "Your infos" # Displayed under author name
avatar = "file.png" # Placed in static/images
```
### Twitter:card
Twitter cards are automaticly generated.
If you want tho have the twitter:site meta generated,
add the following option to your config file:
```toml
[params]
twitterUser = "youruser" # Your Twitter account without @
```
### Custom CSS
```toml
[params]
custom_css = ["style.css"] # Your own css files
```
### Social Networks
You can also set some of your networks accounts to display on the home page.
Every social network (or not so network) have to be described with thoses
options:
```toml
[[params.social]]
name = "Title of the entry" # Title, used on hover
icon = "gitea" # Icon to use
weight = 1 # Sort order
url = "https://gitea.io/user" # Link to your account
```
You can also add some non social elements, you only need to have an icon.

10
archetypes/default.md

@ -0,0 +1,10 @@ @@ -0,0 +1,10 @@
---
author: "Gregory Trolliet"
title: "{{ replace .Name "-" " " | title }}"
date: {{ .Date }}
description: ""
images: []
categories: [""]
tags: ["",""]
draft: true
---

12
data/snotra/mois.yaml

@ -0,0 +1,12 @@ @@ -0,0 +1,12 @@
1: "janvier"
2: "février"
3: "mars"
4: "avril"
5: "mai"
6: "juin"
7: "juillet"
8: "août"
9: "septembre"
10: "octobre"
11: "novembre"
12: "décembre"

51
i18n/fr.toml

@ -0,0 +1,51 @@ @@ -0,0 +1,51 @@
[categories]
one = "catégorie"
other = "catégories"
[tags]
one = "tag"
other = "tags"
[articles]
one = "archive"
other = "archives"
[reading_time]
one = "Une minute de lecture"
other = "{{ .Count }} minutes de lecture"
[previous_article]
other = "article précédent"
[next_article]
other = "article suivant"
[alt_image]
other = "Image de l'article:"
[alt_avatar]
other = "Avatar de {{ .Site.Params.author }}"
[go_home]
other = "Retour à la page d'accueil"
[error_404]
other = "Erreur 404 : Page non trouvée"
[error_404_title]
other = "Title link"
[error_404_txt]
other = "Désolé, la page à laquelle vous essayez d'accéder n'existe pas."
[error_404_reasons]
other = """Raisons possibles :
<ul>
<li>La page que vous cherchez a été déplacée ou supprimée&#8239;;</li>
<li>Vous avez peut-être utilisé un lien obsolète ou rompu&#8239;;</li>
<li>Vous avez peut-être mal saisi l'adresse
(<abbr title="Uniform Resource Locator">URL</abbr>).</li>
</ul>"""
[page_top]
other = "revenir en haut de page"

20
layouts/404.html

@ -0,0 +1,20 @@ @@ -0,0 +1,20 @@
{{ define "main"}}
<main id="wrapper">
<section class="container error_page">
<div>
<h1 id="title">
{{ with .Site.Params.error404_definitionUrl }}
<a title="{{ i18n "error_404_title" }}" href="{{ . }}">
{{ end }}
{{ htmlUnescape (i18n "error_404") }}
{{ with .Site.Params.error404_definitionUrl }}
</a>
{{ end }}
</h1>
<p>{{ i18n "error_404_txt" }}</p>
<p>{{ i18n "error_404_reasons" | markdownify }}</p>
</div>
<footer><a href="{{ "/" | relURL }}">{{ i18n "go_home" }}</a></footer>
</section>
</main>
{{ end }}

7
layouts/_default/_markup/render-heading.html

@ -0,0 +1,7 @@ @@ -0,0 +1,7 @@
<h{{ .Level }} id="{{ .Anchor | safeURL }}">
<a class="anchor" href="#{{ .Anchor | safeURL }}">
#
<!-- {{ strings.Repeat .Level "#" }} -->
</a>
{{ .Text | safeHTML }}
</h{{ .Level }}>

12
layouts/_default/baseof.html

@ -0,0 +1,12 @@ @@ -0,0 +1,12 @@
{{ partial "header.html" . }}
<body>
<!-- Code that all your templates share, like a header -->
{{ block "main" . }}
<!-- The part of the page that begins to differ between templates -->
{{ end }}
{{ block "footer" . }}
<!-- More shared code, perhaps a footer but that can be overridden if need be in -->
{{ end }}
</body>
</html>

6
layouts/_default/li.html

@ -0,0 +1,6 @@ @@ -0,0 +1,6 @@
<li>
<span class="date">
{{ .Date.Day }} {{ index $.Site.Data.snotra.mois (printf "%d" .Date.Month) }} {{ .Date.Year }}
</span>
<a class="title" href="{{ .Params.ExternalLink | default .RelPermalink }}">{{ .Title }}</a>
</li>

28
layouts/_default/list.html

@ -0,0 +1,28 @@ @@ -0,0 +1,28 @@
{{ partial "header.html" . }}
<body>
<main class="wrapper">
{{ partial "navigation.html" . }}
<section id="blog-list" class="container liste">
<article>
<header>
<h1 class="list-title">
{{ if eq .Kind "taxonomy" }}
{{ i18n .Data.Plural 1 | title }}: {{ .Title }}
{{ else if eq .Kind "taxonomyTerm" }}
{{ i18n .Data.Plural | title }}
{{ end }}
</h1>
</header>
<ul class="articles-list">
{{- range .Paginator.Pages -}}
{{- .Render "li" -}}
{{- end -}}
</ul>
</article>
{{ .Content }}
{{ partial "pagination.html" . }}
</section>
</main>
</body>
</html>

26
layouts/_default/rss.xml

@ -0,0 +1,26 @@ @@ -0,0 +1,26 @@
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom">
<channel>
<title>{{ if eq .Title .Site.Title }}{{ .Site.Title }}{{ else }}{{ with .Title }}{{.}} on {{ end }}{{ .Site.Title }}{{ end }}</title>
<link>{{ .Permalink }}</link>
<description>Recent content {{ if ne .Title .Site.Title }}{{ with .Title }}in {{.}} {{ end }}{{ end }}on {{ .Site.Title }}</description>
<generator>Hugo -- gohugo.io</generator>{{ with .Site.LanguageCode }}
<language>{{.}}</language>{{end}}{{ with .Site.Author.email }}
<managingEditor>{{.}}{{ with $.Site.Author.name }} ({{.}}){{end}}</managingEditor>{{end}}{{ with .Site.Author.email }}
<webMaster>{{.}}{{ with $.Site.Author.name }} ({{.}}){{end}}</webMaster>{{end}}{{ with .Site.Copyright }}
<copyright>{{.}}</copyright>{{end}}{{ if not .Date.IsZero }}
<lastBuildDate>{{ .Date.Format "Mon, 02 Jan 2006 15:04:05 -0700" | safeHTML }}</lastBuildDate>{{ end }}
{{ with .OutputFormats.Get "RSS" }}
{{ printf "<atom:link href=%q rel=\"self\" type=%q />" .Permalink .MediaType | safeHTML }}
{{ end }}
{{ range .Site.RegularPages }}
<item>
<title>{{ .Title }}</title>
<link>{{ .Permalink }}</link>
<pubDate>{{ .Date.Format "Mon, 02 Jan 2006 15:04:05 -0700" | safeHTML }}</pubDate>
{{ with .Site.Author.email }}<author>{{.}}{{ with $.Site.Author.name }} ({{.}}){{end}}</author>{{end}}
<guid>{{ .Permalink }}</guid>
<description>{{ .Content | html }}</description>
</item>
{{ end }}
</channel>
</rss>

16
layouts/_default/single.html

@ -0,0 +1,16 @@ @@ -0,0 +1,16 @@
{{ partial "header.html" . }}
<body>
<main class="wrapper">
{{ partial "navigation.html" . }}
<section id="site-page" class="container page">
<article>
<header>
<h1 class="site-title">{{ .Title }}</h1>
</header>
{{ .Content }}
</article>
</section>
{{ partial "footer.html" . }}
</main>
</body>
</html>

5
layouts/archives/li.html

@ -0,0 +1,5 @@ @@ -0,0 +1,5 @@
<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>
</a>

24
layouts/archives/list.html

@ -0,0 +1,24 @@ @@ -0,0 +1,24 @@
{{ partial "header.html" . }}
<body>
<main class="wrapper">
{{ partial "navigation.html" . }}
<section id="blog-list" class="container liste">
<article>
<header>
<h1 class="list-title">
{{ i18n "articles" | title }}
</h1>
</header>
<div class="archives-list">
{{- range .Paginator.Pages -}}
{{- .Render "li" -}}
{{- end -}}
</div>
</article>
{{ partial "pagination.html" . }}
</section>
{{ partial "footer.html" . }}
</main>
</body>
</html>

63
layouts/archives/single.html

@ -0,0 +1,63 @@ @@ -0,0 +1,63 @@
{{ partial "header.html" . }}
<body>
<main class="wrapper">
{{ partial "navigation.html" . }}
<section class="container archive">
<article>
<header class="post-header">
<h1 class="post-title">
{{ .Title }}
</h1>
{{ $img := newScratch }}
{{ $folder := (print "/content/" .File.Dir "gallery/") }}
{{ $files := readDir $folder }}
{{ range sort $files "Name" "asc" }}
{{ if not .IsDir }}
{{ $img.Add "list" (slice .Name) }}
{{ end }}
{{ end }}
{{ with ($img.Get "list") }}
{{ $img.Set "max" (add 1 (int (index (split (index (split (index (last 1 .) 0) ".") 0) "img") 1))) }}
{{ end }}
{{ range $index, $val := $img.Get "list" }}
{{ $curr := index (split $val ".") 0 }}
{{ $prec := mod (add (sub $index 1) ($img.Get "max")) ($img.Get "max") }}
{{ $next := mod (add $index 1) ($img.Get "max") }}
<a class="thumb hidden_link" href="#img{{ $index }}">
<img src="gallery/thumb/{{ $curr }}.jpg">
</a>
<!-- lightbox container hidden with CSS -->
<div class="lightbox" id="{{ $curr }}">
<a href="#img{{ $prec }}" class="light-btn hidden_link btn-prev"><<</a>
<a href="#_" class="btn-close hidden_link">X</a>
<img src="gallery/{{ $val }}">
<a href="#img{{ $next }}" class="light-btn hidden_link btn-next">>></a>
</div>
{{ end }}
<div class="post-meta">
<!--div class="date">
<span class="posted-on">
<img class="page-icon header-icon" src="/svg/calendar.svg"/>
<time datetime='{{ .Date.Format "2006-01-02T15:04:05Z07:00" }}'>
Article publié le {{ .Date.Day }} {{ index $.Site.Data.snotra.mois (printf "%d" .Date.Month) }} {{ .Date.Year }}
</time>
</span>
<span class="reading-time">
<img class="page-icon header-icon" src="/svg/clock.svg"/>
{{ i18n "reading_time" .ReadingTime }}
</span>
</div-->
{{ partial "categories.html" .Page.Params.Categories }}
{{ partial "tags.html" .Page.Params.Tags }}
</div>
</header>
<div class="archive-body">
{{ .Content }}
</div>
{{ partial "article-footer.html" . }}
</article>
</section>
{{ partial "footer.html" . }}
</main>
</body>
</html>

21
layouts/index.html

@ -0,0 +1,21 @@ @@ -0,0 +1,21 @@
{{ partial "header.html" . }}
<body>
<main class="wrapper">
{{ partial "navigation.html" . }}
<div class="centered">
{{ partial "author.html" . }}
{{ if false }}
{{ range .Site.RegularPages }}
<header>
<h2><a href="{{ .RelPermalink }}">{{ .Title }}</a></h2>
</header>
<article>
{{ .Summary }}
</article>
{{ end }}
{{ end }}
</div>
{{ partial "footer.html" . }}
</main>
</body>
</html>

24
layouts/partials/article-footer.html

@ -0,0 +1,24 @@ @@ -0,0 +1,24 @@
<footer class="archive-footer">
<span class="footer-return">
<a href="#">{{ i18n "page_top" | humanize }}</a>
</span><br/>
{{ if .PrevInSection }}
<span class="footer-link">
<span class="label">{{ i18n "previous_article" | humanize }}:</span>
<a href="{{ .PrevInSection.RelPermalink }}">
{{ .PrevInSection.Title }}
</a>
{{ if .NextInSection }}
<span class="spacer"></span>
{{ end }}
</span>
{{ end }}
{{ if .NextInSection }}
<span class="footer-link">
<span class="label">{{ i18n "next_article" | humanize }}:</span>
<a href="{{ .NextInSection.RelPermalink }}">
{{ .NextInSection.Title }}
</a>
</span>
{{ end }}
</footer>

9
layouts/partials/author.html

@ -0,0 +1,9 @@ @@ -0,0 +1,9 @@
<div id="author">
<div id="avatar" aria-hidden="true">
<img src="images/{{ .Site.Params.avatar }}" alt="avatar"/>
</div>
<div id="description">
<h1>{{ .Site.Params.author }}</h1>
<h2>{{ .Site.Params.info }}</h2>
</div>
</div>

13
layouts/partials/categories.html

@ -0,0 +1,13 @@ @@ -0,0 +1,13 @@
{{ if . }}
<div class="categories">
<img class="page-icon header-icon" src="/svg/folder.svg"/>
{{ range $index, $el := . }}
{{ if gt $index 0 }}
<span class="separator"></span>
{{ end }}
<a href="{{ ( printf "categories/%s/" ( $el | urlize ) ) | relLangURL }}">
{{ . }}
</a>
{{ end }}
</div>
{{ end }}

5
layouts/partials/footer.html

@ -0,0 +1,5 @@ @@ -0,0 +1,5 @@
<div id="footer">
<div id="footer-name" class="footer-element">{{ .Site.Params.name }}</div>
<!--div id="footer-mail" class="footer-element"><a href="mailto:{{ .Site.Params.mail }}">{{ .Site.Params.mail }}</a></div-->
{{ partial "social.html" . }}
</div>

0
layouts/partials/head.html

46
layouts/partials/header.html

@ -0,0 +1,46 @@ @@ -0,0 +1,46 @@
<!DOCTYPE html>
<html lang='{{ .Site.Language.Lang }}'>
<head>
<title>{{ .Title }}</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
{{ if .Description }}
<meta name="description" content="{{ .Description }}">
{{ else }}
<meta name="description" content="{{ .Site.Params.description }}">
{{ end }}
{{ if .Params.Tags }}
<meta name="keywords" content="{{ delimit .Params.Tags ", "}}">
{{ else }}
<meta name="keywords" content="{{ .Site.Params.keywords }}">
{{ end }}
{{ if .Params.author }}
<meta name="author" content="{{ .Params.author }}">
{{ else }}
<meta name="author" content="{{ .Site.Params.author }}">
{{ end }}
<link rel="stylesheet" href="/css/style.css">
<link href="{{ .Site.RSSLink }}" rel="alternate" type="application/rss+xml" title="{{ .Site.Title }}">
{{ if and (.Site.Params.favicon) (fileExists (print "static/images/" .Site.Params.favicon)) }}
{{ $name := .Site.Params.favicon }}
{{ $splitted := split $name "." }}
{{ $extension := index $splitted 1 }}
{{ if ( in "svg" $extension) }}
<link rel="icon" type="image/svg+xml" href="{{ $.Site.BaseURL }}images/{{ $name }}" sizes="any">
{{ else if (in "gif png" $extension) }}
<link rel="icon" type="image/{{ $extension }}" href="{{ $.Site.BaseURL }}images/{{ $name }}">
{{ end}}
{{ else if (fileExists "static/images/favicon.svg") }}
<link rel="icon" type="image/svg+xml" href="{{ $.Site.BaseURL }}images/favicon.svg">
{{ else if (fileExists "static/images/favicon.png") }}
<link rel="icon" type="image/png" href="{{ $.Site.BaseURL }}images/favicon.png">
{{ end }}
{{ partial "opengraph.html" . }}
{{ range .Site.Params.custom_css }}
<link rel="stylesheet" href="{{ . | relURL }}"/>
{{ end }}
{{ hugo.Generator }}
</head>

22
layouts/partials/navigation.html

@ -0,0 +1,22 @@ @@ -0,0 +1,22 @@
<nav id="navigation">
<section class="navigation-container">
<a id="navigation-title" href="/">
{{ .Site.Title }}
</a>
<input type="checkbox" id="menu-toggle" />
<label class="menu-button" for="menu-toggle">
<div class="menu-button-inner">
<div class="menu-button-image"></div>
</div>
</label>
<ul id="navigation-list">
{{ range .Site.Home.Pages }}
<li class="navigation-item">
<a href="{{ .RelPermalink }}">{{ .Name }}</a>
</li>
{{ end }}
</ul>
</section>
</nav>

38
layouts/partials/opengraph.html

@ -0,0 +1,38 @@ @@ -0,0 +1,38 @@
<meta name="twitter:card" content="summary_large_image"/>
{{ with .Site.Params.twitterUser }}
<meta name="twitter:site" content="@{{ . }}"/>
{{ end }}
<meta name="twitter:title" content="{{ .Title }}"/>
{{ if .Description }}
<meta name="twitter:description" content="{{ .Description }}"/>
{{ else }}
<meta name="twitter:description" content="{{ .Site.Params.description }}"/>
{{ end }}
<meta property="og:title" content="{{ .Title }}" />
{{ if .Description }}
<meta property="og:description" content="{{ .Description }}"/>
{{ else }}
<meta property="og:description" content="{{ .Site.Params.description }}"/>
{{ end }}
{{ if eq .Kind "page" }}
<meta property="og:type" content="article" />
{{ else }}
<meta property="og:type" content="website" />
{{ end }}
<meta property="og:url" content="{{ .Permalink }}" />
{{ $title := .Title }}
{{if .Params.images }}
{{ $baseUrl := .Permalink }}
{{ $altText := i18n "alt_image" }}
{{ range first 1 .Params.images }}
<meta property="og:image" content="{{ $baseUrl }}{{ . }}"/>
<meta property="og:image:alt" content="{{ $altText }} {{ $title }}"/>
{{ end }}
{{ else }}
<meta property="og:image" content="{{ .Site.BaseURL }}images/avatar.png"/>
<meta property="og:image:alt" content="{{ i18n "alt_avatar" . }}"/>
{{ end }}
<meta property="og:updated_time" content="{{ .Site.LastChange }}" />
<meta property="og:site_name" content="{{ .Site.Title }}" />

51
layouts/partials/pagination.html

@ -0,0 +1,51 @@ @@ -0,0 +1,51 @@
{{ $paginator := .Paginator }}
{{ $adjacent_links := 2 }}
{{ $max_links := (add (mul $adjacent_links 2) 1) }}
{{ $lower_limit := (add $adjacent_links 1) }}
{{ $upper_limit := (sub $paginator.TotalPages $adjacent_links) }}
{{ if gt $paginator.TotalPages 1 }}
<ul class="pagination">
{{ if $paginator.HasPrev }}
{{ if ne $paginator.PageNumber 2 }}
<li><a href="{{ $paginator.First.URL }}">&laquo;</a></li>
{{ end }}
<li class="hidden"><a href="{{ $paginator.Prev.URL }}">&lsaquo;</a></li>
{{ end }}
{{ range $paginator.Pagers }}
{{ $.Scratch.Set "page_number_flag" false }}
{{ if gt $paginator.TotalPages $max_links }}
{{ if le $paginator.PageNumber $lower_limit }}
{{ if le .PageNumber $max_links }}
{{ $.Scratch.Set "page_number_flag" true }}
{{ end }}
{{ else if ge $paginator.PageNumber $upper_limit }}
{{ if gt .PageNumber (sub $paginator.TotalPages $max_links) }}
{{ $.Scratch.Set "page_number_flag" true }}
{{ end }}
{{ else }}
{{ if and ( ge .PageNumber (sub $paginator.PageNumber $adjacent_links) ) ( le .PageNumber (add $paginator.PageNumber $adjacent_links) ) }}
{{ $.Scratch.Set "page_number_flag" true }}
{{ end }}
{{ end }}
{{ else }}
{{ $.Scratch.Set "page_number_flag" true }}
{{ end }}
{{ if eq ($.Scratch.Get "page_number_flag") true }}
{{ if eq . $paginator }}
<li>{{ .PageNumber }}</li>
{{ else }}
<li><a href="{{ .URL }}">{{ .PageNumber }}</a></li>
{{ end }}
{{ end }}
{{ end }}
{{ if $paginator.HasNext }}
<li class="hidden"><a href="{{ $paginator.Next.URL }}">&rsaquo;</a></li>
{{ if ne $paginator.PageNumber (sub $paginator.TotalPages 1) }}
<li><a href="{{ $paginator.Last.URL }}">&raquo;</a></li>
{{ end }}
{{ end }}
</ul>
{{ end }}

11
layouts/partials/social.html

@ -0,0 +1,11 @@ @@ -0,0 +1,11 @@
{{ with .Site.Params.social }}
<ul id="social">
{{ range sort . "weight" }}
<li class="social-element">
<a href="{{ safeURL .url }}" rel="me" aria-label="{{ .name }}" title="{{ .name }}">
<img class="social-icon" src="{{ .Site.BaseURL }}/svg/{{ .icon }}.svg" alt="{{ .name }}" aria-hidden="true">
</a>
</li>
{{ end }}
</ul>
{{ end }}

11
layouts/partials/tags.html

@ -0,0 +1,11 @@ @@ -0,0 +1,11 @@
{{ if . }}
<div class="tags">
<img class="page-icon header-icon" src="/svg/tag.svg"/>
{{ range $index, $el := . }}
{{ if gt $index 0 }}
<span class="separator"></span>
{{ end }}
<a href="{{ ( printf "tags/%s/" ( $el | urlize ) ) | relLangURL }}">{{ . }}</a>
{{ end }}
</div>
{{ end }}

42
layouts/shortcodes/img.html

@ -0,0 +1,42 @@ @@ -0,0 +1,42 @@
{{ $img := $.Page.Resources.GetMatch (.Get "src")}}
{{ $name_splitted := split $img.RelPermalink "." }}
{{ $name_base := index $name_splitted 0 }}
{{ $ext_base := index $name_splitted 1 }}
<figure {{ with .Get "class" }} class="{{ . }}"{{ end }}>
{{ with .Get "link" }}
<a href="{{ . | absURL }}">
{{ else }}
<a href="{{ $img.RelPermalink }}">
{{ end }}
<picture>
{{ if ( in "svg ico gif" $ext_base ) }}
<img src="{{ $img.RelPermalink }}"
{{ with .Get "alt"}} alt="{{ . }}"{{ end }}
{{ with .Get "title"}} title="{{ . }}"{{ end }}/>
{{ else }}
<source srcset="{{ $name_base }}.thumb.avif" type="image/avif"/>
<source srcset="{{ $name_base }}.thumb.webp" type="image/webp"/>
<img src="{{ $name_base }}.thumb.{{ $ext_base }}"
{{ with .Get "alt"}} alt="{{ . }}"{{ end }}
{{ with .Get "title"}} title="{{ . }}"{{ end }}/>
{{ end }}
</picture>
</a>
{{ if .Get "caption" }}
<figcaption>
<p>{{ .Get "caption" }}
{{ if .Get "attr" }}
<span class="attribution">
{{ with .Get "attrlink" }}
<a href="{{ . }}">
{{ end }}
{{ .Get "attr" }}
{{ with .Get "attrlink" }}
</a>
{{ end }}
</span>
{{ end }}
</p>
</figcaption>
{{ end }}
</figure>

18
layouts/shortcodes/quote.html

@ -0,0 +1,18 @@ @@ -0,0 +1,18 @@
<blockquote {{ with .Get "class" }}class="{{ . }}"{{ end }}{{ with .Get "url" }} cite="{{ . }}" {{ end }}>
{{ $s := split (trim .Inner "\t \n") "\n\n" }}
{{ if eq ( first 1 $s) ( last 1 $s )}}
<p>{{ .Inner | markdownify }}</p>
{{ else }}
{{ .Inner | markdownify }}
{{ end }}
{{ if .Get "author" }}
<footer>
<cite>
{{ with .Get "url" }}
<a href="{{ . }}" {{ with $.Get "title"}}title="{{ . }}"{{ end }}>
{{ end }}
{{ .Get "author" | markdownify }}
{{ with .Get "url" }}</a>{{end}}</cite>
</footer>
{{ end }}
</blockquote>

3
layouts/shortcodes/table_of_contents.html

@ -0,0 +1,3 @@ @@ -0,0 +1,3 @@
<div class="toc">
{{ .Page.TableOfContents }}
</div>

8
layouts/shortcodes/tabular.html

@ -0,0 +1,8 @@ @@ -0,0 +1,8 @@
<figure class="tabular {{ with .Get "class"}}{{ . }}{{ end }}">
{{ .Inner | markdownify }}
{{ with .Get "title" }}
<figcaption>
<p>{{ . }}</p>
</figcaption>
{{ end }}
</figure>

876
static/css/style.css

@ -0,0 +1,876 @@ @@ -0,0 +1,876 @@
/******************* Constants *******************/
:root {
--font-color: #EFEFEF;
--font-color_rgb: 239, 239, 239;
--font-color-em: #8C8C8C;
--background-color: #1C1C1C;
--background-color-light: #252525;
--background-color-dark: #121212;
--avatar-background: #B6B6B6;
--color01: #799479;
--color01_bright: #58af58;
--color02: #8f8071;
--color02_bright: #b88a5b;
--color03: #871818;
--image-margin-side: 2.5em;
--content-width: 900px;
}
/******************* Page *******************/
* {
box-sizing: border-box;
}
html {
background-color: var(--background-color);
font-family: Lato, Helvetica, sans-serif;
font-size: medium;
color: var(--font-color);
}
@media only screen and (min-width: 768px) {
html {
font-size: large;
}
}
body {
margin: 0;
}
p, ul, ol {
line-height: 1.6em;
}
/******************* Links *******************/
a {
text-decoration: none;
color: var(--font-color);
}
a:not(.anchor):not(.hidden_link) {
border-bottom: 1px dotted;
transition: box-shadow 0.2s ease, outline-offset 0.2s ease, transform 0.2s ease, background 0.4s ease;
}
a:visited {
color: var(--font-color);
}
a:hover {
outline: 1px solid;
outline-offset: .3em;
}
a:not(.anchor):not(.hidden_link):hover {
border-bottom: 1px dashed;
}
a:not(.anchor):not(.hidden_link):active {
border-bottom: 1px solid;
}
a.not(.anchor):focus {
outline-offset: .3em;
outline: 1px solid;
}
/******************* Wrapper *******************/
.wrapper {
display: flex;
flex-direction: column;
min-height: 100vh;
width: 100%;
}
/******************* Home Page *******************/
.centered {
display: flex;
flex: 1;
align-items: center;
justify-content: center;
margin: 1em;
}
/******************* Navbar *******************/
#navigation {
height: 4em;
width: 100%;
line-height: 4em;
}
#navigation a {
padding: 1em;
padding-bottom: 0.75em; /* Pour éviter d'avoir un espace trop grand en bas*/
border: none;
border-radius: 0.5em;
}
#navigation a:hover {
background-color: var(--font-color);
text-decoration: none;
color: var(--background-color);
outline: none;
}
#navigation a:active {
color: var(--font-color);
border: none;
}
#navigation a:focus {
outline: none;
}
#navigation .navigation-container,
#footer {
margin: 0 auto;
max-width: 90vw;
}
#footer {
width: 100%;
margin-top: 1em;
padding: 0 1em;
}
@media only screen and (max-width: 320px) {
#navigation .navigation-container,
#footer {
max-width: 100vw;
}
}
@media only screen and (min-width: 1000px) {
#navigation .navigation-container,
#footer {
max-width: var(--content-width);
}
}
#navigation-title {
letter-spacing: .1rem;
text-transform: uppercase;
font-weight: bold;
font-size: 1em;
}
#social {
list-style: none;
padding: 0;
margin-top: 0;
}
#social .social-element {
display: inline-block;
vertical-align: middle;
height: 2em;
margin-top: .7em;
}
#social .social-element a {
height: 1.5em;
display: inline-block;
margin-left: 1em;
margin-right: 1em;
border: none;
}
#social .social-element a:active {
outline: 2px solid;
}
#social .social-icon {
height: 100%;
}
@media only screen and (min-width: 768px) {
#social .social-element a {
height: 2em;
}
}
/******************* Navbar Menu *******************/
#menu-toggle {
display: none;
}
#navigation .menu-button {
float: right;
position: relative;
display: none;
width: 4em;
height: 4em;
}
#navigation .menu-button-inner {
width: 3em;
height: 3em;
position:relative;
top: 0.5em;
left: 0.5em;
text-align:center
}
#navigation .menu-button .menu-button-image {
display: inline-block;
position: relative;
height: 1.5em;
width: 1.5em;
top: 0.75em;
background-image: url(../svg/bars.svg);
background-size: contain;
background-repeat: no-repeat;
margin: auto;
vertical-align: top;
}
#menu-toggle:checked + .menu-button .menu-button-inner {
background-color: var(--link-hover-background);
border-radius: 0.5em;
transition: background .5s, max-height .35s linear;
}
#menu-toggle:checked + .menu-button .menu-button-image {
opacity: 40%;
}
#navigation-list {
position: absolute;
top: 6rem;
right: 0;
visibility: hidden;
opacity: 0;
max-height: 0;
width: 100%;
font-size: 1.5em;
background-color: var(--background-color);
border-top: solid 2px var(--font-color);
border-bottom: solid 2px var(--font-color);
transition: opacity .5s, max-height .35s linear;
padding: 0;
}
#navigation-list .navigation-item {
float: none !important;
text-align: center;
margin: 0;
display: block;
}
#navigation-list .navigation-item,
#navigation-list .navigation-item span {
line-height: 5rem;
}
#menu-toggle:checked + label + ul {
visibility: visible;
opacity: 1;
max-height: 100rem;
z-index: 100;
}
#navigation .menu-button {
display: block;
cursor: pointer;
}
@media only screen and (min-width: 768px) {
#navigation-list {
position: relative;
float: right;
top: 0;
max-height: none;
visibility: visible;
opacity: 100;
width: auto;
border: none;
list-style: none;
font-size: 1em;
margin-top: 0;
}
#navigation-list .navigation-item {
display: inline-block;
font-weight: bold;
line-height: 4rem;
}
#navigation-list .navigation-item a,
#navigation-list .navigation-item span {
line-height: 1rem;
}
#menu-toggle:checked + label + ul {
visibility: visible;
opacity: 1;
max-height: 100rem;
}
#navigation .menu-button {
display: none;
}
}
/******************* Author Infos *******************/
#author {
text-align: center;
margin: 0 auto;
max-width: 90vw;
}
@media only screen and (max-width: 320px) {
#author {
max-width: 100vw;
}
}
@media only screen and (min-width: 1000px) {
#author {
max-width: var(--content-width);
}
}
#avatar img {
width: 20vw;
min-width: 120px;
max-width: 200px;
border-radius: 40%;
background-color: var(--avatar-background);
}
/******************* Simple Page *******************/
.container {
max-width: 90vw;
margin: 0 auto;
width: 100%;
display: flex;
flex: 1;
}
@media only screen and (min-width: 1000px) {
.container {
max-width: var(--content-width);
}
}
.page-icon {
width: 1em;
height: 1em;
vertical-align: middle;
}
/******************* Error Page *******************/
.error_page {
width: max-content;
}
.error_page footer {
padding-top: 1em;
border-top: 1px solid var(--font-color);
}
/******************* Error Page *******************/
#blog-list .list-title,
#site-page .site-title {
font-size: 2rem;
}
/******************* Archives List *******************/
.archives-list {
list-style: none;
padding-left: 0;
}
.archives-list .archive {
display: block;
position: relative;
margin: 1em 0;
overflow: auto;
border: none;
}
.archives-list .archive:hover {
border: none;
}
.archives-list .archive .title {
height: 100px;
}
.archives-list .thumbnail {
display: block;
width: 15em;
text-align: left;
padding-right: 1.5em;
float: left;
}
@media only screen and (min-width: 768px) {
.archives-list .thumbnail {
display: inline-block;
text-align: right;
}
}
.archives-list .description {
height: 100%;
}
.archive .more {
position: absolute;
bottom: 0;
right: 0;
font-style: italic;
}
/******************* Letters *******************/
#letter-counter {
margin: auto;
width: fit-content;
width: -moz-fit-content;
}
#letter-counter #counter {
border: 1px solid white;
margin-top: 0.5em;
padding: .7em;
text-align: center;
font-size: 2.5em;
}
#letter-form {
margin-left: 1em;
margin-right: 1em;
}
#letter-choice {
display: inline-block;
}
#letter-choice-title {
float: left;
margin-top: 0;
}
#letter-form input,
#letter-form label {
margin-top: 1em;
}
#letter-choice>p,
#letter-form>label {
display: inline-block;
min-width: 10em;
}
#letter-choice input:first-of-type {
margin-top: 0;
}
#letter-form input[type="text"] {
height: 2em;
width: 20em;
max-width: 100%;
}
#letter-form #submit {
padding: 0.5em 0.8em;
}
/******************* Paginator *******************/
.pagination {
padding-left: 0;
margin: auto;
text-align: center;
}
.pagination li {
display: inline-block;
}
/******************* Article *******************/
.container article {
margin: 0 1em;
width: 100%;
}
@media only screen and (max-width: 320px) {
.container article {
margin: 0em;
}
}
/******************* Article Header *******************/
.container article .post-title {
margin-bottom: 0.3em;
}
.container article .post-title a:hover {
outline: none;
}
.container article .post-title a:active {
border-bottom: 1px solid;
}
.post-meta {
margin-top: 1em;
}
.post-meta>div {
line-height: 2em;
}
.post-meta .date span {
display: inline-block;
}
.post-meta .posted-on {
margin-right: 1em;
}
.post-meta .categories, .post-meta .tags {
display: inline-block;
}
.post-meta .categories {
margin-right: 1em;
}
.post-meta .header-icon {
vertical-align: baseline;
margin-right: 0.3em;
}
.post-header {
margin-top: 3.5rem;
margin-bottom: 1.8rem;
}
@media only screen and (max-width: 320px) {
.post-header {
margin-top: 2rem;
margin-bottom: 1.6rem;
}
}
.post-title {
font-size: 3rem;
margin: 0;
}
@media only screen and (max-width: 320px) {
.post-title {
font-size: 2.4rem;
}
}
/******************* Archive Body *******************/
.archive-body {
margin-bottom: 2em;
position: relative;
}
.archive-body img {
max-width: 100%;
}
.archive-body h1 {
font-size: 2.55rem;
margin: 3.5rem 0 1.8rem;
}
.archive-body h2 {
font-size: 2.17rem;
margin: 2.98rem 0 1.53rem;
}
.archive-body h3 {
font-size: 1.84rem;
margin: 2.53rem 0 1.30rem;
}
.archive-body h4 {
font-size: 1.57rem;
margin: 2.15rem 0 1.11rem;
}
.archive-body h5 {
font-size: 1.33rem;
margin: 1.83rem 0 0.94rem;
}
.archive-body h6 {
font-size: 1.13rem;
margin: 1.55rem 0 0.80rem;
}
@media only screen and (max-width: 320px) {
.archive-body h1 {
font-size: 2.16rem;
margin: 2rem 0 1.6rem;
}
.archive-body h2 {
font-size: 1.94rem;
margin: 1.80rem 0 1.44rem;
}
.archive-body h3 {
font-size: 1.75rem;
margin: 1.62rem 0 1.30rem;
}
.archive-body h4 {
font-size: 1.57rem;
margin: 1.46rem 0 1.17rem;
}
.archive-body h5 {
font-size: 1.42rem;
margin: 1.31rem 0 1.05rem;
}
.archive-body h6 {
font-size: 1.28rem;
margin: 1.18rem 0 0.94rem;
}
}
.anchor {
content: '#';
position: absolute;
opacity: 0%;
left: -1em;
width: 80%;
max-width: 600px;
border: none;
color: var(--font-color-em);
text-decoration: none;
}
@media only screen and (max-width: 500px) {
.anchor {
left: -0.8em;
}
}
.anchor:hover {
opacity: 100%;
outline: none;
border: none;
cursor: pointer;
}
@media only screen and (max-width: 320px) {
.anchor:hover {
opacity: 0%;
}
}
/******************* Archive Footer *******************/
.archive-footer {
font-style: italic;
font-size: 0.8rem;
margin: 2rem 0;
}
.archive-footer .footer-return {
margin-bottom: 1em;
width: 100%;
text-align: right;
display: inline-block;
}
.archive-footer .footer-link {
display: block;
}
.archive-footer .footer-link .spacer {
display: none;
}
.archive-footer .footer-link .label {
display: inline-block;
width: 8em;
}
@media only screen and (min-width: 768px) {
.archive-footer .footer-link {
display: inline-block;
}
.archive-footer .footer-link .label {
width: auto;
}
.archive-footer .footer-link .spacer {
display: inline-block !important;
}
}
.footnotes {
clear: left;
}
/******************* Archive Figure *******************/
.archive-body figure {
margin: 1em 0;
max-width: 100%;
width: fit-content;
overflow: visible;
}
.archive-body figure picture,
.archive-body figure figcaption {
display: table-row;
border-spacing: 0;
}
.archive-body figure img {