hscc

Soure code of <https://hugo.soucy.cc>.
git clone git://soucy.cc/hscc.git
Log | Files | Refs

commit 084aa16f56c23a2e1bbdd267a17d298e69d816d9
parent bb4d3e912be8bd9cc2c3329e8bd017dcaa9f40f7
Author: Hugo Soucy <hugo@soucy.cc>
Date:   Tue, 30 Mar 2021 08:59:27 -0400

Change/add content and styles

Diffstat:
Acontent/2021/mp/##logiciels-savoir-libre.md## | 28++++++++++++++++++++++++++++
Acontent/2021/mp/#logiciels-savoir-libre.md# | 14++++++++++++++
Acontent/2021/mp/logiciels-savoir-libre.lua | 8++++++++
Acontent/2021/mp/logiciels-savoir-libre.lua~ | 8++++++++
Acontent/2021/mp/logiciels-savoir-libre.md | 28++++++++++++++++++++++++++++
Acontent/2021/mp/logiciels-savoir-libre.md~ | 28++++++++++++++++++++++++++++
Acontent/2021/nt/#web-inclusion-et-performance.md# | 24++++++++++++++++++++++++
Acontent/2021/nt/l-energie-la-plus-verte.lua | 7+++++++
Acontent/2021/nt/l-energie-la-plus-verte.md | 10++++++++++
Acontent/2021/nt/plus-de-scss.lua | 7+++++++
Acontent/2021/nt/plus-de-scss.md | 48++++++++++++++++++++++++++++++++++++++++++++++++
Acontent/2021/nt/web-des-moyens-du-bord.lua | 7+++++++
Acontent/2021/nt/web-des-moyens-du-bord.md | 3+++
Acontent/2021/nt/web-inclusion-et-performance.lua | 7+++++++
Acontent/2021/nt/web-inclusion-et-performance.md | 24++++++++++++++++++++++++
Acontent/2021/tx/essai-de-sfeed.lua | 8++++++++
Acontent/2021/tx/essai-de-sfeed.md | 74++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
Mcontent/archives.md | 2++
Acontent/biscuits.lua | 5+++++
Acontent/biscuits.md | 13+++++++++++++
Mcontent/file/curriculum-vitae.lua | 1+
Mcontent/index.lua | 1+
Mcontent/xfn.md | 80+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++----------------
Msrc/css/css.sh | 1+
Msrc/css/modules/footer-banner.css | 21+++++++++++++++------
Msrc/css/modules/hcard.css | 2+-
Msrc/css/modules/hresume.css | 3+--
Msrc/css/modules/layout.css | 8+++++++-
Msrc/css/modules/nav.css | 10++++++----
Asrc/css/modules/xfn.css | 7+++++++
Mtemplates/head.html | 5++++-
Mtemplates/index.html | 2+-
Mtemplates/layout.html | 60+++++++++++++++++++++++++++++++++++-------------------------
Mtemplates/posttypes/note.html | 4++--
Mtemplates/publications.html | 2+-
35 files changed, 500 insertions(+), 60 deletions(-)

diff --git a/content/2021/mp/##logiciels-savoir-libre.md## b/content/2021/mp/##logiciels-savoir-libre.md## @@ -0,0 +1,27 @@ +<https://www.lapresse.ca/debats/opinions/2021-01-26/logiciels-proprietaires/pour-un-savoir-libre-et-pluriel.php> + +> Désormais, l’espace de notre pensée, de notre recherche et de notre +> enseignement est devenu l’espace privé de Microsoft, de Zoom, de +> Google, d’Apple et d’une poignée d’autres entreprises. + +> [...] + +> Si ce choix de « solutions » propriétaires pouvait se justifier dans +> l’urgence du début de cette crise, plusieurs mois plus tard, cette +> situation devient extrêmement problématique. + +> [...] + +> Nos activités sont financées par l’argent public et devraient rester +> publiques. Les espaces de ces entreprises sont fermés, privés et +> propriétaires. Concrètement, non seulement ce sont Microsoft, Zoom, +> Apple, Google et compagnie qui pensent à notre place, mais nous ne +> savons pas ce qu’ils pensent et ce qu’ils font de nous. Nous ne sommes +> pas les usagers, mais les produits. + +Il serait en réalité simple pour plusieurs universités d’installer, de maintenir, de mettre à disposition et de recommander, sans attendre, des solutions de rechange pour la communauté grâce aux solutions non propriétaires. + +Il serait en réalité simple pour plusieurs universités d’installer, de +maintenir, de mettre à disposition et de recommander, sans attendre, +des solutions de rechange pour la communauté grâce aux solutions non +propriétaires.+ \ No newline at end of file diff --git a/content/2021/mp/#logiciels-savoir-libre.md# b/content/2021/mp/#logiciels-savoir-libre.md# @@ -0,0 +1,14 @@ +<https://www.lapresse.ca/debats/opinions/2021-01-26/logiciels-proprietaires/pour-un-savoir-libre-et-pluriel.php> + +> Désormais, l’espace de notre pensée, de notre recherche et de notre +> enseignement est devenu l’espace privé de Microsoft, de Zoom, de +> Google, d’Apple et d’une poignée d’autres entreprises. [...] Si ce +> choix de « solutions » propriétaires pouvait se justifier dans +> l’urgence du début de cette crise, plusieurs mois plus tard, cette +> situation devient extrêmement problématique. [...] Nos activités +> sont financées par l’argent public et devraient rester +> publiques. Les espaces de ces entreprises sont fermés, privés et +> propriétaires. Concrètement, non seulement ce sont Microsoft, Zoom, +> Apple, Google et compagnie qui pensent à notre place, mais nous ne +> savons pas ce qu’ils pensent et ce qu’ils font de nous. Nous ne +> sommes pas les usagers, mais les produits. diff --git a/content/2021/mp/logiciels-savoir-libre.lua b/content/2021/mp/logiciels-savoir-libre.lua @@ -0,0 +1,8 @@ +return { +title = "Logiciels propriétaires | Pour un savoir libre et pluriel", +url = "https://www.lapresse.ca/debats/opinions/2021-01-26/logiciels-proprietaires/pour-un-savoir-libre-et-pluriel.php", +date = "2021-03-11", +datetime = "13:54:20", +posttype = "bookmark", +keywords = { "floss","foss","gafam","université", } +} diff --git a/content/2021/mp/logiciels-savoir-libre.lua~ b/content/2021/mp/logiciels-savoir-libre.lua~ @@ -0,0 +1,8 @@ +return { +title = "Logiciels propriétaires | Pour un savoir libre et pluriel", +url = "https://www.lapresse.ca/debats/opinions/2021-01-26/logiciels-proprietaires/pour-un-savoir-libre-et-pluriel.php", +date = "2021-03-11", +datetime = "13:54:20", +posttype = "bookmark", +keywords = { "floss","foss","logiciel"," propriétaire","université", } +} diff --git a/content/2021/mp/logiciels-savoir-libre.md b/content/2021/mp/logiciels-savoir-libre.md @@ -0,0 +1,27 @@ +<https://www.lapresse.ca/debats/opinions/2021-01-26/logiciels-proprietaires/pour-un-savoir-libre-et-pluriel.php> + +> &laquo;Désormais, l’espace de notre pensée, de notre recherche et de notre +> enseignement est devenu l’espace privé de Microsoft, de Zoom, de +> Google, d’Apple et d’une poignée d’autres entreprises. + +> [...] + +> Si ce choix de « solutions » propriétaires pouvait se justifier dans +> l’urgence du début de cette crise, plusieurs mois plus tard, cette +> situation devient extrêmement problématique. + +> [...] + +> Nos activités sont financées par l’argent public et devraient rester +> publiques. Les espaces de ces entreprises sont fermés, privés et +> propriétaires. Concrètement, non seulement ce sont Microsoft, Zoom, +> Apple, Google et compagnie qui pensent à notre place, mais nous ne +> savons pas ce qu’ils pensent et ce qu’ils font de nous. Nous ne sommes +> pas les usagers, mais les produits. + +> [...] + +> Il serait en réalité simple pour plusieurs universités d’installer, de +> maintenir, de mettre à disposition et de recommander, sans attendre, +> des solutions de rechange pour la communauté grâce aux solutions non +> propriétaires.&raquo;+ \ No newline at end of file diff --git a/content/2021/mp/logiciels-savoir-libre.md~ b/content/2021/mp/logiciels-savoir-libre.md~ @@ -0,0 +1,27 @@ +<https://www.lapresse.ca/debats/opinions/2021-01-26/logiciels-proprietaires/pour-un-savoir-libre-et-pluriel.php> + +> Désormais, l’espace de notre pensée, de notre recherche et de notre +> enseignement est devenu l’espace privé de Microsoft, de Zoom, de +> Google, d’Apple et d’une poignée d’autres entreprises. + +> [...] + +> Si ce choix de « solutions » propriétaires pouvait se justifier dans +> l’urgence du début de cette crise, plusieurs mois plus tard, cette +> situation devient extrêmement problématique. + +> [...] + +> Nos activités sont financées par l’argent public et devraient rester +> publiques. Les espaces de ces entreprises sont fermés, privés et +> propriétaires. Concrètement, non seulement ce sont Microsoft, Zoom, +> Apple, Google et compagnie qui pensent à notre place, mais nous ne +> savons pas ce qu’ils pensent et ce qu’ils font de nous. Nous ne sommes +> pas les usagers, mais les produits. + +> [...] + +> Il serait en réalité simple pour plusieurs universités d’installer, de +> maintenir, de mettre à disposition et de recommander, sans attendre, +> des solutions de rechange pour la communauté grâce aux solutions non +> propriétaires.+ \ No newline at end of file diff --git a/content/2021/nt/#web-inclusion-et-performance.md# b/content/2021/nt/#web-inclusion-et-performance.md# @@ -0,0 +1,24 @@ +Dans son billet +[Permacomputing](http://viznut.fi/texts-en/permacomputing.html), +Viznut fait un parallèlle entre l'informatique et la permaculture, et +comment les principes de cette dernière, pourraient être appliqués au +numérique. + +Au début du texte, il souligne que les ordinateurs arrivent à être plus +lents malgré le fait qu'ils sont toujours plus rapides. + +Il fait bien sûr allusion aux applications qui monopolisent +continuellement plus de ressources pour [supposément] répondre aux +besoins des gens qui les utilisent. Le gain de puissance apporté par +le matériel (hardware), en vient à être gobé par le grand l'appétit du +logiciel. + +Dans le domaine du développement web c'est encore plus vrai! Les sites +web ont pris du [sur]poids. Nous sommes une des rares industrie qui +fait fi trop souvent de l'efficacité énergétique. Peut-être parce que +son coût est externalisé vers les gens qui utilisent nos produits. + +Pour moi il y a un lien à faire avec l'**accessibilité web**. Parce +que plutôt que de tendre vers un conception universelle des sites et +des applications qui, inclurait un plus large spectre de contextes +technologiques et humains, nous choisissons d'exclure diff --git a/content/2021/nt/l-energie-la-plus-verte.lua b/content/2021/nt/l-energie-la-plus-verte.lua @@ -0,0 +1,7 @@ +return { +title = "L'énergie la plus verte", +date = "2021-03-12", +datetime = "10:24:01", +posttype = "note", +keywords = { "écologie","énergie", } +} diff --git a/content/2021/nt/l-energie-la-plus-verte.md b/content/2021/nt/l-energie-la-plus-verte.md @@ -0,0 +1,10 @@ +D'abord l'énergie la plus verte, c'est celle que l'on ne consomme pas. + +Ensuite, l'énergie la plus verte, c'est celle que l'on ne gaspille +pas. + +Puis, l'énergie la plus verte, c'est celle que l'on peut stocker à +moindre énergie (coût, effort, etc). + +Et l'énergie la plus verte, c'est celle qui se renouvelle et que l'on +peut capter à moindre énergie (coût, effort, etc). diff --git a/content/2021/nt/plus-de-scss.lua b/content/2021/nt/plus-de-scss.lua @@ -0,0 +1,7 @@ +return { +title = "Plus de SCSS", +date = "2021-03-12", +datetime = "11:11:39", +posttype = "note", +keywords = { "webdev", "libsass", "scss","sass","css", "use the unix", "cat", "read", "tr" } +} diff --git a/content/2021/nt/plus-de-scss.md b/content/2021/nt/plus-de-scss.md @@ -0,0 +1,48 @@ +Suite à [l'abandon de **libsass** au détriment de **Dart +Sass**](https://sass-lang.com/blog/libsass-is-deprecated), j'ai décidé +d'utiliser seulement du bon vieux CSS pour mes projets perso. + +Toutefois, ayant le désir de maintenir le découpage des styles en +plusieurs feuilles sans utiliser le `@import` natif de CSS qui +démultiplirait les requêtes HTTP, j'utilise un simple script shell qui +concatène tous les fichiers dans un seul et qui trime les sauts de +ligne: + + #!/bin/sh + + dst="../../public_html/css/" + + while read line; do + [ ! -z "$line" ] && cat "./$line" + done <<-EOF | tr -d '\n\r' > "${dst}index.min.css" + + global/tokens/typography.css + global/tokens/colors.css + global/tokens/grid.css + + global/base.css + global/a11y.css + + atoms/typography/titles.css + atoms/typography/quotes.css + atoms/buttons/button.css + + modules/layout.css + modules/go-to.css + modules/nav.css + modules/footer-banner.css + modules/hcard.css + modules/hentry.css + modules/hfeed.css + modules/hresume.css + modules/webmentions.css + EOF + + echo "CSS builded! @ $(date +"%Y-%m-%d %T")" + +Avec ces quelques lignes, j'arrive à une bonne optimisation de mon +CSS, en servant un seul fichier sans retour à la ligne, et ce, en +évitant les dépendances à des modules nodeJS ou à un langage de +programmation venant d'un tier. + +Merci UNIX :) diff --git a/content/2021/nt/web-des-moyens-du-bord.lua b/content/2021/nt/web-des-moyens-du-bord.lua @@ -0,0 +1,7 @@ +return { +title = "Le Web des moyens du bord", +date = "2021-03-15", +datetime = "15:10:22", +posttype = "note", +keywords = { "webdev","humeur", } +} diff --git a/content/2021/nt/web-des-moyens-du-bord.md b/content/2021/nt/web-des-moyens-du-bord.md @@ -0,0 +1,3 @@ +J'aime le Web fait avec les moyens du bord, celui qui est là d'abord +pour les gens, celui des échanges et des partages de connaissances; +celui qui est simple (et "beau"), léger et efficace. diff --git a/content/2021/nt/web-inclusion-et-performance.lua b/content/2021/nt/web-inclusion-et-performance.lua @@ -0,0 +1,7 @@ +return { + title = "Le Web l&#39;inclusion et la performance", + date = "2021-03-21", + datetime = "13:59:17", + posttype = "note", + keywords = { "webdev","webperf","web accessibility","a11y","performance","inclusion", } +} diff --git a/content/2021/nt/web-inclusion-et-performance.md b/content/2021/nt/web-inclusion-et-performance.md @@ -0,0 +1,24 @@ +Dans son billet +[Permacomputing](http://viznut.fi/texts-en/permacomputing.html), +Viznut fait un parallèlle entre l'informatique et la permaculture, et +comment les principes de cette dernière, pourraient être appliqués au +numérique. + +Au début du texte, il souligne que les ordinateurs arrivent à être plus +lents malgré le fait qu'ils sont toujours plus rapides. + +Il fait bien sûr allusion aux applications qui monopolisent +continuellement plus de ressources pour [supposément] répondre aux +besoins des utilisateurs. Le gain de puissance apporté par le matériel +(hardware), en vient à être gobé par le grand l'appétit du logiciel. + +Dans le domaine du développement web c'est encore plus vrai! Les sites +web ont pris du [sur]poids. Nous sommes une des rares industrie qui +fait fi trop souvent de l'efficacité énergétique. Peut-être parce que +son coût est externalisé vers les gens qui utilisent nos produits. + +Pour moi, il y a un lien à faire avec l'**accessibilité web**. Parce +que plutôt que de tendre vers un conception universelle des sites et +des applications qui, inclurait le plus large spectre de contextes +technologiques et humains, nous choisissons l'exclusion et le +gaspillage. diff --git a/content/2021/tx/essai-de-sfeed.lua b/content/2021/tx/essai-de-sfeed.lua @@ -0,0 +1,8 @@ +return { + title = "Essai de Sfeed", + date = "2021-03-19", + datetime = "12:38:17", + posttype = "article", + keywords = { "rss","atom","syndication","feed","parser","analyseur","lecteur","howto", }, + summary = "Sfeed est un analyseur et lecteur de flux Atom/RSS en ligne de commande. Il est écrit en C par Hiltjo Posthuma..." +} diff --git a/content/2021/tx/essai-de-sfeed.md b/content/2021/tx/essai-de-sfeed.md @@ -0,0 +1,74 @@ +[Sfeed](https://codemadness.org/sfeed.html) est un analyseur et +lecteur de flux RSS (ou Atom) en ligne de commande. Il est écrit en **C** +par **Hiltjo Posthuma**. + +Sfeed permet de ... + +* Récupérer les entrées d'un flux RSS directement (Ex.: `curl -s + 'https://hugo.soucy.cc/index.xml' | sfeed`), où à partir d'une liste + (sfeedrc). +* Convertir le flux en question en différents formats. Comme par + exemple en *plain text*, HTML, Atom, gopher, etc. +* Importer ou exporter des flux par le format OPML. +* Trouver des flux d'un site à partir de son URL. + +## Installation + +La version git est celle qui est recommendé pour l'installation. Donc +où vous voulez dans votre système, cloner le dépôt: + + git clone git://git.codemadness.org/sfeed + +Ensuite ce rendre dans le répertoire sfeed et avec `sudo` ou `doas` +lancer les commandes suivantes: + + doas make + doas make install + +Pour connaître les dépendances dont vous avez besoin, jeter un coup +d'oeil au fichier **README**, dans la section *Dependencies*. + +Taper la commande `whereis sfeed` pour confirmer que l'installation a +effectivement réussi. Si c'est le cas, une ligne du genre s'affichera +dans votre termial: + + /usr/local/bin/sfeed + +## Configuration + +L'ajout et la modification de flux Atom/RSS se fait dans un fichier +qui s'appelle `sfeedrc`, et qui, doit être placé dans un répertoire de +votre `$HOME` qui s'appellera `.sfeed`. Un exemple de fichier de +configuration nommé `sfeedrc.example` se trouve dans le dossier +**sfeed** que vous avez cloné. + +Les flux, quant à eux, y seront égalment dans un dossier qui doit se +nommer `feeds`. Pour mettre tout ça en place on tape les commandes +suivantes: + + mkdir -p "$HOME/.sfeed/feeds" + cp sfeedrc.example "$HOME/.sfeed/sfeedrc" + + +## Récupérer les flux + +Une fois que vous avez ajouté votre liste de flux dans +`$HOME/.sfeed/sfeedrc`, vous pouvez importer et/ou mettre à jour leurs +contenus avec la commande `sfeed_update`. Alors dans le répertoire +`"$HOME/.sfeed/feeds"`, chaque item dans votre liste de lectures +deviendra un fichier texte qui, contiendra une entrée par ligne. + +## Importer un fichier OPML + +Dans mon cas j'ai déjà une liste de syndication dans un fichier OPML, +et Sfeed a une commande pour importer son contenu dans un `sfeedrc`: + + sfeed_opml_import < .hs0ucy/Code/Feeds/feeds.opml > ~/.sfeed/sfeedrc + +Faire `man sfeed_opml_import` pour plus de détails. Ensuite refaire un `sfeed_update`. + +## Visualiser vos abonnements en HTML + + sfeed_html $HOME/.sfeed/feeds/* > "$HOME/Downloads/feeds.html" + +Faire `man sfeed_html` pour plus de détails. diff --git a/content/archives.md b/content/archives.md @@ -2,6 +2,8 @@ Archives des contenus ===================== +* [2021](2021) : [notes](2021/nt), [marques-pages](2021/mp), + [réponses](2021/rp), [textes](2021/tx) * [2020](2020) : [notes](2020/nt), [marques-pages](2020/mp), [réponses](2020/rp), [textes](2020/tx) diff --git a/content/biscuits.lua b/content/biscuits.lua @@ -0,0 +1,5 @@ +return { + title = "Biscuits", + date = "2021-03-12", + datetime = "14:36:30", +} diff --git a/content/biscuits.md b/content/biscuits.md @@ -0,0 +1,13 @@ +# Site sans biscuit + +Ici aucun cookie ou autre entourloupe n'est utilisé pour vous +pister. Vous pouvez consulter tout le contenu sans contribuer malgré +vous au [capitalisme de +surveillance](https://fr.wikipedia.org/wiki/%C3%89conomie_de_la_surveillance). + +Pour découvrir les sites web qui vous espionnent et bloquer leurs +pisteurs, je vous suggère ces extensions à installer dans votre +navigateur: + +* <https://duckduckgo.com/app> +* <https://privacybadger.org/> diff --git a/content/file/curriculum-vitae.lua b/content/file/curriculum-vitae.lua @@ -8,6 +8,7 @@ return { navigation = { label = "CV", }, + keywords = { "développeur front-end","intégrateur web","Québec","a11y", "accessibilité web","Lévis" }, -- cv = function() -- local file = io.popen('curl https://raw.githubusercontent.com/hs0ucy/Curriculum-vitae/master/curriculum-vitae.html') -- local data = file:read("*a") diff --git a/content/index.lua b/content/index.lua @@ -4,6 +4,7 @@ return { id = "tag:hugo.soucy.cc,0000-00-00:0000/00/index", template = "index", title = "Hugo Soucy, développeur Web front-end habitant Lévis, et ceci est sa page Web", + keywords = { "développeur front-end","intégrateur web","a11y", "accessibilité web", "Lévis", "Québec", }, navigation = { attributes = {"rel=\"index\""}, label = "Intro", diff --git a/content/xfn.md b/content/xfn.md @@ -1,19 +1,67 @@ -# Amis, famille, collègues +# Amis, famille, collègues, etc Liens vers les amis, la famille ou les collègues qui ont une présence -sur le Web. +sur le Web: -* [Sophie Perreault-Allen](http://sophiepa.com/) -* [Fred Nolet](http://www.frednolet.com/) -* [Catherine Lesieur](http://catherinelesieur.com/) -* [Bernard Chhun](https://bernardchhun.com/) -* [Virgil Dupras](https://www.hardcoded.net/) -* [Alexis Piéplu](https://pieplu.ca/) -* [Benoît Arbour](https://www.orizonmedia.com/ "Orizon Média") -* [Mireille Rancourt](http://mouleesdunord.com/ "Les moulées du nord") -* [Sam De Champlin](https://bourrasque.ca/) -* [Sylvain & Suzanne](https://fermerondine.com/ "Ferme de la Rondine") -* [Jacynthe Carrier](https://jacynthecarrier.com/) -* [Théâtre Rude Ingénierie](https://rudeingenierie.com/) -* [Frederic Guimont](https://charactercreator.org/) -* [Robin Millette](http://waglo.com/) +<ul class="xfn"> + <li> + <a href="http://sophiepa.com/">Sophie Perreault-Allen</a> + </li> + <li> + <a href="http://www.frednolet.com/">Fred Nolet</a> + </li> + <li> + <a href="http://catherinelesieur.com/">Catherine Lesieur</a> + </li> + <li> + <a href="http://roxanne.soucy.cc">Roxanne Soucy</a> + </li> + <li> + <a href="https://bernardchhun.com/">Bernard Chhun</a> + </li> + <li> + <a href="https://www.hardcoded.net/">Virgil Dupras</a> + </li> + <li> + <a href="https://pieplu.ca/">Alexis Piéplu</a> + </li> + <li> + <a href="https://www.orizonmedia.com/" title="Orizon Média">Benoît Arbour</a> + </li> + <li> + <a href="http://mouleesdunord.com/" title="Les moulées du nord">Mireille Rancourt</a> + </li> + <li> + <a href="https://bourrasque.ca/" title="Bourrasque">Sam De Champlain</a> + </li> + <li> + <a href="https://fermerondine.com/" title="Ferme de la Rondine">Sylvain &amp; Suzanne</a> + </li> + <li> + <a href="https://jacynthecarrier.com/">Jacynthe Carrier</a> + </li> + <li> + <a href="https://rudeingenierie.com/">Théâtre Rude Ingénierie</a> + </li> + <li> + <a href="https://charactercreator.org/" title="The Character Creator">Frederic Guimont</a> + </li> + <li> + <a href="http://waglo.com/">Robin Millette</a> + </li> + <li> + <a href="http://philstjacques.com/">Philippe St-Jacques</a> + </li> + <li> + <a href="https://pikselkraft.com/" title="Pikselkraft">Derek Salmon</a> + </li> + <li> + <a href="https://filierem.com/" title="Filière M">Mélanie Filiatrault </a> + </li> + <li> + <a href="https://larlet.fr/david/">David Larlet</a> + </li> + <li> + <a href="https://louis-andre.net/">Louis-André Labadie</a> + </li> +</ul> diff --git a/src/css/css.sh b/src/css/css.sh @@ -25,6 +25,7 @@ modules/hcard.css modules/hentry.css modules/hfeed.css modules/hresume.css +modules/xfn.css modules/webmentions.css EOF diff --git a/src/css/modules/footer-banner.css b/src/css/modules/footer-banner.css @@ -8,6 +8,7 @@ .footer-banner a { background: linear-gradient(180deg,transparent 70%, var(--base-link-fg) 0); color: var(--base-brightest); + display: block; } .footer-banner a:focus, @@ -20,10 +21,18 @@ padding-top: 2rem; } -@media screen and (min-width: 48rem) { - .footer-banner__wrapper { - display: flex; - flex-wrap: wrap; - justify-content: space-between; - } +.footer-banner__list { + align-items: center; + display: flex; + flex-wrap: wrap; + justify-content: flex-start; + list-style-type: none; + margin: calc(1rem / 2 * -1); + overflow: hidden; + padding: 0; +} + +.footer-banner__item { + display: block; + margin: calc(1rem / 2); } diff --git a/src/css/modules/hcard.css b/src/css/modules/hcard.css @@ -18,7 +18,7 @@ } -@media screen and (min-width: 22.5rem) { +@media screen and (min-width: 30rem) { #hs.hcard .u-photo { float: right; margin: 1rem; diff --git a/src/css/modules/hresume.css b/src/css/modules/hresume.css @@ -29,8 +29,7 @@ .hresume .h-card dt, .hresume .h-card dd { - display: table-cell; - padding-top: calc(var(--base-space) * 2); + display: table-cell; } .hresume .h-card dt::after { diff --git a/src/css/modules/layout.css b/src/css/modules/layout.css @@ -15,7 +15,13 @@ margin-left: auto; margin-right: auto; max-width: var(--grid-max-width); - padding: 4rem 2rem; + padding: 2rem 1rem; +} + +@media screen and (min-width: 15rem) { + .layout > * > * { + padding: 4rem 2rem; + } } .layout > :first-child:not(main) { diff --git a/src/css/modules/nav.css b/src/css/modules/nav.css @@ -74,13 +74,15 @@ color: var(--base-brightest); display: block; line-height: 1; - padding: 0.75rem 1.5rem; + padding: 0.75rem 2rem; text-decoration: none; } -@media screen and (min-width: 80rem) { - padding-left: 2rem; - padding-right: 2rem; +@media screen and (min-width: 64rem) and (max-width: 79.9375rem) { + .nav__link { + padding-left: 1.5rem; + padding-right: 1.5rem; + } } .nav__link[aria-current] { diff --git a/src/css/modules/xfn.css b/src/css/modules/xfn.css @@ -0,0 +1,7 @@ +/* @module xfn */ + +@media screen and (min-width: 48rem) { + .xfn { + columns: 2 auto; + } +} diff --git a/templates/head.html b/templates/head.html @@ -9,7 +9,10 @@ rel="stylesheet" type="text/css"/> - <link href="<%= permalink -%>" hreflang="<%= language -%>" rel="canonical" /> + <link + href="<%= permalink -%>" + hreflang="<%= language -%>" + rel="canonical" /> <meta name="robots" content="index, follow" /> <meta name="author" content="<%= author.name -%>" /> diff --git a/templates/index.html b/templates/index.html @@ -26,7 +26,7 @@ </p> <p> - <a href="https://hugo.soucy.cc/2021">Dans ma soupe</a> je vois les <strong property="foaf:interest" resource="http://dbpedia.org/resource/FLOSS" title="FLOSS">logiciels libres et open-source</strong>, comme <strong property="foaf:interest" resource="http://dbpedia.org/resource/Emacs">Emacs</strong>, <strong property="foaf:interest" resource="http://dbpedia.org/page/Dwm">dwm</strong>, <strong property="foaf:interest" resource="http://dbpedia.org/resource/OpenBSD">OpenBSD</strong> 🐡, <strong property="foaf:interest" resource="http://dbpedia.org/resource/Manjaro_Linux">Manjaro</strong>, <strong property="foaf:interest" resource="http://dbpedia.org/page/Syncthing">Syncthing</strong>, etc; les <strong property="foaf:interest" resource="http://dbpedia.org/resource/Shell_script">shell scripts</strong>, le <strong property="foaf:interest" resource="http://dbpedia.org/page/Lua_(programming_language)">Lua</strong> script, le <strong property="foaf:interest" resource="http://dbpedia.org/resource/JavaScript">JavaScript</strong>; les <strong property="foaf:interest" resource="http://dbpedia.org/page/Web_standards">standards du Web</strong> et tout ce qui touche à l'indépendance numérique des utilisateurs. J'aime la <strong property="foaf:interest" resource="http://dbpedia.org/resource/Politics">politique</strong> sans les politiciens, la <strong property="foaf:interest" resource="http://dbpedia.org/resource/Reading_(process)">lecture</strong>, le <strong property="foaf:interest" resource="http://dbpedia.org/resource/Bicycle">vélo</strong>, le <strong property="foaf:interest" resource="http://dbpedia.org/page/Coffee">café</strong> ☕, la <strong property="foaf:interest" resource="http://dbpedia.org/page/Pizza">pizza</strong> 🍕 et les <strong property="foaf:interest" resource="http://dbpedia.org/resource/Sandwich">sandwichs</strong> 🥪. + <a href="https://hugo.soucy.cc/2021">Dans ma soupe</a> je vois les <strong property="foaf:interest" resource="http://dbpedia.org/resource/FLOSS" title="FLOSS">logiciels libres et open-source</strong>, comme <strong property="foaf:interest" resource="http://dbpedia.org/resource/Emacs">Emacs</strong>, <strong property="foaf:interest" resource="http://dbpedia.org/page/Dwm">dwm</strong>, <strong property="foaf:interest" resource="http://dbpedia.org/resource/OpenBSD">OpenBSD</strong> 🐡, <strong property="foaf:interest" resource="http://dbpedia.org/resource/Manjaro_Linux">Manjaro</strong>, <strong property="foaf:interest" resource="http://dbpedia.org/page/Syncthing">Syncthing</strong>, etc; les <strong property="foaf:interest" resource="http://dbpedia.org/resource/Shell_script">shell scripts</strong>, le <strong property="foaf:interest" resource="http://dbpedia.org/page/Lua_(programming_language)">Lua</strong> script, le <strong property="foaf:interest" resource="http://dbpedia.org/resource/JavaScript">JavaScript</strong>; les <strong property="foaf:interest" resource="http://dbpedia.org/page/Web_standards">standards du Web</strong> et tout ce qui touche à l'indépendance numérique des utilisateurs. J'aime la <strong property="foaf:interest" resource="http://dbpedia.org/resource/Politics">politique</strong> sans les politiciens, la <strong property="foaf:interest" resource="http://dbpedia.org/resource/Reading_(process)">lecture</strong>, le <strong property="foaf:interest" resource="http://dbpedia.org/resource/Bicycle">vélo</strong>, le <strong property="foaf:interest" resource="http://dbpedia.org/page/Coffee">café</strong> ☕, la <strong property="foaf:interest" resource="http://dbpedia.org/page/Pizza">pizza</strong> 🍕 et les <strong property="foaf:interest" resource="http://dbpedia.org/resource/Sandwich">sandwichs</strong> 🥪. Wannabe <strong property="foaf:interest" resource="http://dbpedia.org/resource/Local_food">locavore</strong> et <em property="foaf:interest" resource="https://dbpedia.org/page/Canning">appertisan</em> (canneux) 🥫. </p> </div> </div> diff --git a/templates/layout.html b/templates/layout.html @@ -13,10 +13,9 @@ </svg> <a class="go-to-nav visuallyhidden--lg focusable" href="#n"> - <svg class="ico" height="24" role="image" width="24"><use href="#ico_nav"></use></svg> - <span class="visuallyhidden--to-lg">Aller au&nbsp;</span>menu - </a> - <a class="go-to-content visuallyhidden focusable" href="#m">Aller au contenu</a> + <svg aria-hidden="true" class="ico" height="24" role="image" width="24"><use href="#ico_nav"></use></svg> + <span class="visuallyhidden--to-lg">Aller au&nbsp;</span>menu<span class="visuallyhidden"> de navigation</span> + </a> <div class="layout"> <main class="main" id="m"> @@ -27,27 +26,38 @@ <footer class="footer-banner"> <div class="footer-banner__wrapper"> - <div> - <a - href="https://webring.xxiivv.com/#random" - hreflang="en" - target="_blank"> - <img - height="20px" - src="https://webring.xxiivv.com/icon.white.svg" - width="20px" /> - </a> - </div> - - <div><small>Site sans biscuit</small></div> - - <div> - <a - href="https://creativecommons.org/licenses/by/2.5/ca/deed.fr" - rel="external license" - title="Licence Creative Commons, Attribution 2.5 Canada. Lien externe">CC BY 2.5 CA</a>&nbsp;| - <time><%= os.date('%Y') -%></time> - </div> + <ul class="footer-banner__list"> + <li class="footer-banner__item"> + <a + href="https://webring.xxiivv.com/#random" + hreflang="en"> + <span class="visuallyhidden">Webring</span> + <img + alt="" + height="20px" + src="https://webring.xxiivv.com/icon.white.svg" + width="20px" /> + </a> + </li> + <li class="footer-banner__item"> + <a href="/xfn.html">Liens</a> + </li> + <li class="footer-banner__item"> + <a href="/biscuits.html">Site sans biscuit</a> + </li> + <li class="footer-banner__item"> + qui ne drainera pas votre batterie + </li> + <li class="footer-banner__item"> + <a + href="https://creativecommons.org/licenses/by-sa/2.5/ca/deed.fr" + rel="external license" + title="Licence Creative Commons: Partage dans les mêmes conditions 2.5 Canada. Lien externe">CC BY-SA 2.5 CA</a> + </li> + <li class="footer-banner__item"> + @&nbsp;<time><%= os.date('%Y') -%></time> + </li> + </ul> </div> </footer> </div> diff --git a/templates/posttypes/note.html b/templates/posttypes/note.html @@ -3,8 +3,8 @@ <svg class="ico" height="24" width="24" role="image"><use href="#ico_note"></use></svg> Note </small> - <h1> - <%= date -%> @ <%= datetime -%> + <h1 class="visuallyhidden"> + <%= title -%> </h1> <div class="p-name e-content"> diff --git a/templates/publications.html b/templates/publications.html @@ -25,7 +25,7 @@ Note </small> <h2 class="visuallyhidden"> - <%= child.date -%> @ <%= child.datetime -%> + <%= child.title -%> </h2> <% elseif child.posttype == 'reply' then %> <small class="hentry__posttype">