igor
/
portfoligor
1
1
Fork 0
Code Issues 9 Pull Requests Packages Projects 1 Releases 4 Wiki Activity

style: add minimal stylesheet rules 

* NEW Adds CSS rules.
* BETTER Improves very slighlty some layout templates.
* FIX Fixes a missing code label.

Co-Authored-by: Igor Milhit <igor@milhit.ch>
pull/31/head
iGor milhit 2019-07-31 18:43:51 +02:00
parent 4477b3033e
commit 909c3caa97
Signed by: igor
GPG Key ID: 692D97C3D0228A99
8 changed files with 189 additions and 38 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
layouts/_default/list.html
View File

@ -1,19 +1,18 @@
{{ define "main" }}
<main>
<article>
<main class="container">
<header>
<h1>{{.Title}}</h1>
</header>
<!-- "{{.Content}}" pulls from the markdown content of the corresponding _index.md -->
{{.Content}}
</article>
<ul>
<article>
<!-- Ranges through content/posts/*.md -->
{{ range .Pages }}
<li>
<a href="{{.Permalink}}">{{.Date.Format "2006-01-02"}} | {{.Title}}</a>
</li>
<article>
<a href="{{.Permalink}}">{{.Title}}</a>
&mdash; {{.Date.Format "2006-01-02"}}
</article>
{{ end }}
</ul>
</article>
</main>
{{ end }}

20
layouts/_default/section.html
View File

@ -1,16 +1,20 @@
{{ define "main" }}
<main>
<main class="container">
{{ .Content }}
<ul class="contents">
{{ range .Paginator.Pages }}
<li><a href="{{ .Permalink }}">{{.Title}} &mdash; {{ .Date.Format "2006-01-02" }}</a>
{{/* <div>
{{ partial "summary.html" . }}
</div> */}}
</li>
<article>
<a href="{{ .Permalink }}">
{{.Title}}
</a>
&mdash; {{ .Date.Format "2006-01-02" }}
{{ with .Params.categories }}
{{ range . }}
&mdash; <a href="{{ "categories" | absURL}}/{{ . | urlize }}">{{ . }}</a>
{{ end }}
{{ end }}
</article>
{{ end }}
</ul>
{{/* {{ partial "pagination.html" . }} */}}
</main>
{{ end }}

12
layouts/_default/single.html
View File

@ -1,30 +1,32 @@
{{ define "main" }}
<section id="main">
<header>
<main id="main" class="container">
<header class="post-header">
<h1 id="title">{{ .Title }}</h1>
<ul class="post-info">
<li>Publié le&#x202F;: {{ .Date.Format "2006-01-02" }}</li>
{{ with .Params.categories }}
<li>Catégories&#x202F;:</li>
<li>Catégories&#x202F;:
<ul>
{{ range . }}
<li><a href="{{ "categories" | absURL}}/{{ . | urlize }}">{{ . }}</a> </li>
{{ end }}
</ul>
</li>
{{ end }}
{{ with .Params.tags }}
<li>Tags&#x202F;:</li>
<li>Tags&#x202F;:
<ul>
{{ range . }}
<li> <a href="{{ "tags" | absURL }}/{{ . | urlize }}">{{ . }}</a> </li>
{{ end }}
</ul>
</li>
{{ end }}
</ul>
</header>
<article id="content">
{{ .Content }}
</article>
</section>
</main>
{{ end }}

2
layouts/index.html
View File

@ -1,5 +1,5 @@
{{ define "main" }}
<main aria-role="main" itemscope itemtype="https://schema.org/Person">
<main aria-role="main" class="container" itemscope itemtype="https://schema.org/Person">
{{if not .Site.Params.contactsPriv.hide }}
{{ partial "perso" .}}
{{ end }}

7
layouts/partials/footer.html
View File

@ -1,6 +1,9 @@
<footer class="main-footer">
<ul>
<ul class="container">
<li><a href="https://framagit.org/iGormilhit/igor.milhit">Sources</a></li>
<li><a href="http://creativecommons.org/licenses/by/4.0/">CC-BY</a></li>
<li><a href="http://creativecommons.org/licenses/by/4.0/">
<span class="smallcaps">cc-by</span>
</a>
</li>
</ul>
</footer>

12
layouts/partials/header.html
View File

@ -1,4 +1,12 @@
<header class="main-header">
<a href="{{ .Site.BaseURL }}">{{ .Site.Title }}</a>
<a href="{{ .Site.BaseURL }}blog">Blog</a>
<section class="container">
<header>
<a href="{{ .Site.BaseURL }}" class="title">
<img class="avatar" src="{{ .Site.BaseURL }}images/avatar.png">
<h1>{{ .Site.Title }}</h1></a>
</header>
<nav>
<a href="{{ .Site.BaseURL }}blog">Blog</a>
</nav>
</section>
</header>

2
layouts/partials/perso.html
View File

@ -21,7 +21,7 @@
{{ end }}
{{ with .Site.Params.contactsPriv.fingerprint }}
<dt>Empreinte</dt>
<dd>{{ . }}</dd>
<dd><code>{{ . }}</code></dd>
{{ end }}
{{ with .Site.Params.contactsPriv.xmpp }}
<dt>XMPP/jabber</dt>

151
static/style.css
View File

@ -1,7 +1,100 @@
main {
max-width: 35rem; /* 960px */
/*
* ************** *
* FONTS *
* ************** *
*/
html, body {
font-size: 1.25rem;
}
/*
* ************** *
* LAYOUT *
* ************** *
*/
.container {
max-width: 35rem; /* 960px */
margin: 0 auto;
}
body {
display: flex;
flex-direction: column;
height: 100vh;
}
main {
flex-grow: 1;
}
/*
* ************** *
* HEADER *
* ************** *
*/
.main-header {
margin-bottom: 2em;
}
.main-header section {
display: flex;
align-items: center;
border-bottom: solid .1em #e1e1e1;
padding-bottom: 1em;
}
.main-header header {
flex-grow: 1;
}
.title {
display: flex;
align-items: center;
}
.avatar {
border-radius: 50%;
width: 5rem;
margin-right: 1rem;
}
nav {
margin-right: .5em;
}
/*
* ************** *
* FOOTER *
* ************** *
*/
.main-footer ul {
display: flex;
align-items: center;
justify-content: flex-end;
border-top: solid .1em #e1e1e1;
padding-top: 1em;
margin-bottom: 1em;
}
.main-footer li {
list-style: none;
margin-right: .5em;
}
.smallcaps {
font-variant: small-caps;
}
/*
* ************** *
* MAIN *
* ************** *
*/
dl {
display: inline-flex;
flex-flow: row;
@ -11,15 +104,57 @@ dl {
}
dt {
flex: 0 0 25%;
text-overflow: ellipsis;
overflow: hidden;
flex: 0 0 39%;
word-wrap: anywhere;
}
dt::after {
content: " :";
}
dd {
flex:0 0 75%;
flex:0 0 59%;
margin-left: auto;
text-align: left;
text-overflow: ellipsis;
overflow: hidden;
}
.contents {
padding: 0;
}
.contents li {
list-style: none;
}
/*
* ************** *
* POST *
* ************** *
*/
.post-header {
margin: 1em 0 1em 0;
}
.post-header h1 {
margin: 0;
}
.post-info {
font-size: 1rem;
display: flex;
flex-wrap: wrap;
padding: 0;
margin-top: 0;
}
.post-info li {
list-style: none;
display: flex;
padding-right: .5em;
}
.post-info li > ul {
display: flex;
padding: 0;
}