style sass
This commit is contained in:
parent
f016f842c9
commit
8c45ae05f9
@ -215,14 +215,12 @@ def generer_index(dossier_source, fichier_index, titre_index):
|
|||||||
os.makedirs(os.path.dirname(new_folder_path_this_article), exist_ok=True)
|
os.makedirs(os.path.dirname(new_folder_path_this_article), exist_ok=True)
|
||||||
# déplacer le fichier html dans le dossier slug, et le renommer en index.html ensuite pour ne pas modifier l'index du blog
|
# déplacer le fichier html dans le dossier slug, et le renommer en index.html ensuite pour ne pas modifier l'index du blog
|
||||||
shutil.copy(chemin_fichier_this_article, new_folder_path_this_article+'index.html')
|
shutil.copy(chemin_fichier_this_article, new_folder_path_this_article+'index.html')
|
||||||
|
# ---------------- pareil en anglais TODO
|
||||||
# contenu_index_gmi += "\n# Articles in English\n-------------------------\n"
|
# contenu_index_gmi += "\n# Articles in English\n-------------------------\n"
|
||||||
# contenu_index_html += "<h1>Articles in English</h1>"
|
# contenu_index_html += "<h1>Articles in English</h1>"
|
||||||
# lang_folder="lang_en/"
|
# lang_folder="lang_en/"
|
||||||
# for fichier in files_en:
|
# for fichier in files_en:
|
||||||
# contenu_index_gmi += f"=> {fichier}\n"
|
# ----------------------------------------
|
||||||
# link_html = fichier.replace('..gmi','.html')
|
|
||||||
# contenu_index_html += f"<br><a href=/{lang_folder}{link_html}>{link_html}</a>"
|
|
||||||
|
|
||||||
print(contenu_index_gmi)
|
print(contenu_index_gmi)
|
||||||
|
|
||||||
|
@ -178,7 +178,7 @@ bash sass_styles.sh
|
|||||||
for website_name in "${blogs_folders[@]}"; do
|
for website_name in "${blogs_folders[@]}"; do
|
||||||
|
|
||||||
generate_website $website_name
|
generate_website $website_name
|
||||||
convert_markdown_to_gmi $website_name
|
# convert_markdown_to_gmi $website_name
|
||||||
|
|
||||||
# création de l'index:
|
# création de l'index:
|
||||||
# prendre les fichiers markdown du dossier md/ ,
|
# prendre les fichiers markdown du dossier md/ ,
|
||||||
@ -187,21 +187,20 @@ for website_name in "${blogs_folders[@]}"; do
|
|||||||
python3 build_indexes.py $website_name "$website_name"
|
python3 build_indexes.py $website_name "$website_name"
|
||||||
|
|
||||||
# déplacer les fichiers générés en html dans le dossier statique
|
# déplacer les fichiers générés en html dans le dossier statique
|
||||||
# mv sources/$website_name/converted/*.html html-websites/$website_name/
|
|
||||||
# mv sources/$website_name/lang_fr/converted/*.html html-websites/$website_name/
|
cp sources/$website_name/converted/*.html html-websites/$website_name/
|
||||||
mv index_$website_name.html html-websites/$website_name/index.html
|
cp index_$website_name.html html-websites/$website_name/index.html
|
||||||
mv sources/$website_name/converted/*.html html-websites/$website_name/
|
cp sources/$website_name/converted/lang_fr/*.html html-websites/$website_name/lang_fr/
|
||||||
mv sources/$website_name/converted/lang_fr/*.html html-websites/$website_name/lang_fr/
|
cp sources/$website_name/converted/lang_en/*.html html-websites/$website_name/lang_en/
|
||||||
mv sources/$website_name/converted/lang_en/*.html html-websites/$website_name/lang_en/
|
|
||||||
|
|
||||||
|
|
||||||
python3 enrich_html.py html-websites/$website_name -t $website_name --style $style_file
|
python3 enrich_html.py html-websites/$website_name -t $website_name --style $style_file
|
||||||
|
|
||||||
# # déplacer les fichirers gemini dans la capsule
|
# # déplacer les fichirers gemini dans la capsule
|
||||||
# mv index_$website_name.gmi gemini-capsules/$website_name/index.gmi
|
cp index_$website_name.gmi gemini-capsules/$website_name/index.gmi
|
||||||
# mv sources/$website_name/converted/*.gmi gemini-capsules/$website_name/
|
cp sources/$website_name/converted/*.gmi gemini-capsules/$website_name/
|
||||||
# mv sources/$website_name/converted/lang_fr/*.gmi gemini-capsules/$website_name/lang_fr/
|
cp sources/$website_name/converted/lang_fr/*.gmi gemini-capsules/$website_name/lang_fr/
|
||||||
# mv sources/$website_name/converted/lang_en/*.gmi gemini-capsules/$website_name/lang_en/
|
cp sources/$website_name/converted/lang_en/*.gmi gemini-capsules/$website_name/lang_en/
|
||||||
|
|
||||||
# copy style
|
# copy style
|
||||||
cp $style_file html-websites/$website_name/style.css
|
cp $style_file html-websites/$website_name/style.css
|
||||||
|
@ -99,7 +99,7 @@ def enrich_one_file(file, root_path):
|
|||||||
html_content = remove_article_head_properties_orgmode(html_content)
|
html_content = remove_article_head_properties_orgmode(html_content)
|
||||||
html_content = remove_hint_html(html_content)
|
html_content = remove_hint_html(html_content)
|
||||||
|
|
||||||
if inline_the_css:
|
if inline_the_css == True:
|
||||||
print(' ----------- include css inline in each html page')
|
print(' ----------- include css inline in each html page')
|
||||||
with open(os.path.join(root_path, file), "r") as f:
|
with open(os.path.join(root_path, file), "r") as f:
|
||||||
css_content = f.read()
|
css_content = f.read()
|
||||||
@ -140,14 +140,17 @@ def enrich_one_file(file, root_path):
|
|||||||
<body>
|
<body>
|
||||||
<div id="page">
|
<div id="page">
|
||||||
<header id="masthead" class="site-header">
|
<header id="masthead" class="site-header">
|
||||||
<div class="header-image">
|
<div class="header-image" style="background: url({BANNIERE_ENTETE})">
|
||||||
{BANNIERE_ENTETE}
|
<a href="/">
|
||||||
|
<img src="{SITE_ICON}" class="site-icon img">
|
||||||
|
</a>
|
||||||
|
<h1 class="blog-title">{BLOG_TITLE}</h1>
|
||||||
|
<p class="blog-subtitle">{BLOG_SUBTITLE}</p>
|
||||||
</div>
|
</div>
|
||||||
<nav class="navbar is-fixed-top is-dark" role="navigation" aria-label="main navigation">
|
<nav class="navbar is-fixed-top is-dark" role="navigation" aria-label="main navigation">
|
||||||
<div class="navbar-brand">
|
<div class="navbar-brand">
|
||||||
<a class="navbar-item" href="{NDD}">
|
<a class="navbar-item" href="{NDD}">
|
||||||
<img src="{SITE_ICON}"
|
|
||||||
class="img-fluid">
|
|
||||||
</a>
|
</a>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
@ -183,8 +186,7 @@ def enrich_one_file(file, root_path):
|
|||||||
<div class="container">
|
<div class="container">
|
||||||
<div class="site-footer-inner">
|
<div class="site-footer-inner">
|
||||||
|
|
||||||
{BLOG_TITLE}
|
|
||||||
{BLOG_SUBTITLE}
|
|
||||||
{NAVIGATION}
|
{NAVIGATION}
|
||||||
{css_content}
|
{css_content}
|
||||||
|
|
||||||
|
13
gemini-capsules/cipherbliss_blog/index.gmi
Normal file
13
gemini-capsules/cipherbliss_blog/index.gmi
Normal file
@ -0,0 +1,13 @@
|
|||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
# Navigation
|
||||||
|
-------------------------
|
||||||
|
=> index.gmi
|
||||||
|
=> contact.gmi
|
||||||
|
|
||||||
|
# Articles en Français
|
||||||
|
-------------------------
|
||||||
|
=> 2024-11-03-création-d'un-blog-gemini.gmi
|
||||||
|
=> 20210927092238_cipherbliss_215_des-sauvegardes-qui-durent-mille-ans.gmi
|
@ -0,0 +1,166 @@
|
|||||||
|
|
||||||
|
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
|
<meta property="og:image" content="https://www.cipherbliss.com/wp-content/uploads/2016/12/rond.png">
|
||||||
|
<meta property="og:locale" content="fr_FR">
|
||||||
|
<meta property="og:description" content="Code, nouvelles technologies et entrepreneurariat par B. Lemoine">
|
||||||
|
<meta property="og:url" content="https://portfolio.cipherbliss.com/">
|
||||||
|
<meta property="og:site_name" content="Cipher Bliss">
|
||||||
|
<link rel="alternate" type="application/rss+xml" title="Cipher Bliss » Flux"
|
||||||
|
href="https://www.cipherbliss.com/feed/">
|
||||||
|
<link href="/style.css" rel="stylesheet">
|
||||||
|
|
||||||
|
<meta charset="utf-8">
|
||||||
|
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
|
<title></title>
|
||||||
|
<meta name="author" content="">
|
||||||
|
<link rel="alternate" type="application/rss+xml" title="Cipher Bliss » Flux"
|
||||||
|
href="https://www.cipherbliss.com/feed/">
|
||||||
|
<meta property="og:title" content="">
|
||||||
|
<meta property="og:locale" content="fr_FR">
|
||||||
|
<!-- Description de la page -->
|
||||||
|
<meta name="description" content="">
|
||||||
|
<meta name="reply-to" content="contact@cipherbliss.com">
|
||||||
|
<link rel="icon" type="image/png" href="https://www.cipherbliss.com/wp-content/uploads/2016/12/rond.png">
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body>
|
||||||
|
<div id="page">
|
||||||
|
<header id="masthead" class="site-header">
|
||||||
|
<div class="header-image" style="background: url(https://www.cipherbliss.com/wp-content/uploads/2016/11/bg.jpg)">
|
||||||
|
<a href="/">
|
||||||
|
<img src="https://www.cipherbliss.com/wp-content/uploads/2016/12/rond.png" class="site-icon img">
|
||||||
|
</a>
|
||||||
|
<h1 class="blog-title">Cipher Bliss</h1>
|
||||||
|
<p class="blog-subtitle">Code, nouvelles technologies et entrepreneurariat par B. Lemoine</p>
|
||||||
|
</div>
|
||||||
|
<nav class="navbar is-fixed-top is-dark" role="navigation" aria-label="main navigation">
|
||||||
|
<div class="navbar-brand">
|
||||||
|
<a class="navbar-item" href="https://www.cipherbliss.com">
|
||||||
|
|
||||||
|
</a>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="navbarBasicExample" class="navbar-menu">
|
||||||
|
<div class="navbar-start">
|
||||||
|
<a class="navbar-item" href="https://www.cipherbliss.com">
|
||||||
|
<img src="https://www.cipherbliss.com/wp-content/uploads/2016/12/rond.png"
|
||||||
|
class="img-fluid">
|
||||||
|
</a>
|
||||||
|
<nav><a href="/">Accueil</a><a href="https://portfolio.cipherbliss.com">Portfolio</a><a href="/feed">Flux RSS</a><a href="/contact">Contact</a><a href="/ressources-de-café-vie-privée">Ressources</a></nav>
|
||||||
|
</div>
|
||||||
|
<div class="navbar-end">
|
||||||
|
<div class="navbar-item">
|
||||||
|
<form role="search" method="get" class="search-form" action="/">
|
||||||
|
<label>
|
||||||
|
<input class="search-field" placeholder="Recherche" value="" name="s"
|
||||||
|
type="search">
|
||||||
|
</label>
|
||||||
|
<input class="is-hidden search-submit" value="Rechercher" type="submit">
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</header>
|
||||||
|
<main class="body-wrap boxed-container">
|
||||||
|
<article class="content">
|
||||||
|
--------------------------------------------------------------------------------
|
||||||
|
|
||||||
|
## title: cipherbliss_blog
|
||||||
|
|
||||||
|
# Des sauvegardes qui durent mille ans
|
||||||
|
|
||||||
|
J'ai animé un atelier au cours du premier camp CHATONS qui a eu lieu le week-end dernier. (Le
|
||||||
|
=> https://www.chatons.org/ Collectif des Hébergeurs Alternatifs, Transparents, Ouverts, Neutres et Solidaires
|
||||||
|
vise à rassembler des structures proposant des **services en ligne libres, éthiques et décentralisés** afin de permettre aux utilisateur⋅ices de
|
||||||
|
=> https://www.chatons.org/search/by-service trouver rapidement des alternatives
|
||||||
|
respectueuses de leurs données et de leur vie privée)Pas de compte rendu du camp en lui même pour tout de suite, cependant voici un résumé de l'atelier qui aura duré près d'une heure.
|
||||||
|
=> https://libreto.sans-nuage.fr/camps-chatons/programme https://libreto.sans-nuage.fr/camps-chatons/programme
|
||||||
|
|
||||||
|
Comment se protéger des pertes de données et ne pas perdre la confiance et les précieuses données des membres de son CHATONS?
|
||||||
|
|
||||||
|
L'atelier aborde la définition d'un modèle de menace pour savoir contre quoi se prémunir, et quels critères de qualité utiliser pour réaliser automatiquement ses sauvegardes en tant que particulier, ou en tant que CHATONS. On y voit de la façon la plus "grand public" à la façon la plus "techno geek" comment récupérer ses données éparpillées en ligne, historiser, chiffrer, dédupliquer, compresser, répliquer, partager les clés d'accès, et prévoir des restaurations périodiques, de sorte que les données les plus cruciales survivent à leurs administrateurs et administratrices.
|
||||||
|
|
||||||
|
```{=org}
|
||||||
|
#+caption: Jancovici et le stockage à froid, une remarquable utilisation
|
||||||
|
```
|
||||||
|
|
||||||
|
des couches géologiquement stables
|
||||||
|
=> https://www.cipherbliss.com/wp-content/uploads/2021/09/Screenshot_2021-09-27-Les-Sauvegardes-automatiques-Slides-1024x747.jpg [IMG]
|
||||||
|
|
||||||
|
Liens: Les slides sont disponibles ici:
|
||||||
|
=> https://slides.com/tykayn/les-sauvegardes-automatiques https://slides.com/tykayn/les-sauvegardes-automatiques
|
||||||
|
|
||||||
|
La feuille de calcul pour cartographier son matériel
|
||||||
|
=> https://cloud.tykayn.fr/index.php/s/KQfYHpaSpgwrWam https://cloud.tykayn.fr/index.php/s/KQfYHpaSpgwrWam
|
||||||
|
Le site des CHATONS:
|
||||||
|
=> https://www.chatons.org https://www.chatons.org
|
||||||
|
Le forum où tout se discute:
|
||||||
|
=> %20https://forum.chatons.org <https://forum.chatons.org>
|
||||||
|
La documentation pour ne pas réinventer la roue:
|
||||||
|
=> https://wiki.chatons.org https://wiki.chatons.org
|
||||||
|
|
||||||
|
# Métadonnées
|
||||||
|
|
||||||
|
```{=org}
|
||||||
|
#+post_ID: 1595
|
||||||
|
```
|
||||||
|
|
||||||
|
```{=org}
|
||||||
|
#+post_slug: des-sauvegardes-qui-durent-mille-ans
|
||||||
|
```
|
||||||
|
|
||||||
|
```{=org}
|
||||||
|
#+post_url: https://www.ciperbliss.com/2021/des-sauvegardes-qui-durent-mille-ans
|
||||||
|
```
|
||||||
|
|
||||||
|
```{=org}
|
||||||
|
#+post_title: Des sauvegardes qui durent mille ans
|
||||||
|
```
|
||||||
|
|
||||||
|
```{=org}
|
||||||
|
#+post_type: post #+post_mime_types:
|
||||||
|
```
|
||||||
|
|
||||||
|
```{=org}
|
||||||
|
#+post_guid:https://www.cipherbliss.com/?p=1595 #+post_status:
|
||||||
|
```
|
||||||
|
|
||||||
|
publish #+post~datepublished~: <2021-09-27 09:22:38>
|
||||||
|
|
||||||
|
```{=org}
|
||||||
|
#+post_date_modified: <2021-09-27 09:22:42>
|
||||||
|
```
|
||||||
|
|
||||||
|
```{=org}
|
||||||
|
#+post_index_page_roam_id: [[id:1b454ab3-53f0-411f-94e6-d488718dee27][undefined]]
|
||||||
|
```
|
||||||
|
|
||||||
|
```{=org}
|
||||||
|
#+retrieved_from_db_at: <2024-11-07 22:57:06>
|
||||||
|
```
|
||||||
|
</article>
|
||||||
|
</main>
|
||||||
|
<footer class="site-footer has-top-divider">
|
||||||
|
<div class="container">
|
||||||
|
<div class="site-footer-inner">
|
||||||
|
|
||||||
|
|
||||||
|
<nav><a href="/">Accueil</a><a href="https://portfolio.cipherbliss.com">Portfolio</a><a href="/feed">Flux RSS</a><a href="/contact">Contact</a><a href="/ressources-de-café-vie-privée">Ressources</a></nav>
|
||||||
|
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</footer>
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
|
<!-- généré avec orgmode-to-gemini-blog par Tykayn -->
|
||||||
|
</html>
|
||||||
|
|
@ -32,14 +32,17 @@
|
|||||||
<body>
|
<body>
|
||||||
<div id="page">
|
<div id="page">
|
||||||
<header id="masthead" class="site-header">
|
<header id="masthead" class="site-header">
|
||||||
<div class="header-image">
|
<div class="header-image" style="background: url(https://www.cipherbliss.com/wp-content/uploads/2016/11/bg.jpg)">
|
||||||
https://www.cipherbliss.com/wp-content/uploads/2016/11/bg.jpg
|
<a href="/">
|
||||||
|
<img src="https://www.cipherbliss.com/wp-content/uploads/2016/12/rond.png" class="site-icon img">
|
||||||
|
</a>
|
||||||
|
<h1 class="blog-title">Cipher Bliss</h1>
|
||||||
|
<p class="blog-subtitle">Code, nouvelles technologies et entrepreneurariat par B. Lemoine</p>
|
||||||
</div>
|
</div>
|
||||||
<nav class="navbar is-fixed-top is-dark" role="navigation" aria-label="main navigation">
|
<nav class="navbar is-fixed-top is-dark" role="navigation" aria-label="main navigation">
|
||||||
<div class="navbar-brand">
|
<div class="navbar-brand">
|
||||||
<a class="navbar-item" href="https://www.cipherbliss.com">
|
<a class="navbar-item" href="https://www.cipherbliss.com">
|
||||||
<img src="https://www.cipherbliss.com/wp-content/uploads/2016/12/rond.png"
|
|
||||||
class="img-fluid">
|
|
||||||
</a>
|
</a>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
@ -90,15 +93,67 @@ id: 8e220f62-f0fc-4394-8bdf-f9b3db30711e title: cipherbliss_blog
|
|||||||
|
|
||||||
Et hop, un générateur qui fait le café à partir de fichiers orgmode ou markdown.
|
Et hop, un générateur qui fait le café à partir de fichiers orgmode ou markdown.
|
||||||
|
|
||||||
[2024-11-03]
|
Génération de capsules gemini et blog html à partir d'articles en fichiers Orgmode.
|
||||||
|
|
||||||
|
exemple avec le blog de DragonFeu. `sources/dragonfeu~blog~`
|
||||||
|
|
||||||
|
Les articles sont écrits dans le dossier source/, leur nom permet de déduire l'ordre de publication grâce à une date YYY-MM-DD en début de nom de fichier ## création d'un article Pour un article en langue En, sur le blog cipherbliss~blog~, donner le titre entre guillemets ainsi: ```shell python3 new~article~.py cipherbliss~blog~ en "Creation of a gemini blog" ``` ## prérequis pour installation
|
||||||
|
|
||||||
|
Avoir des articles au format org, les mettre dans un dossier source/nom~dublog~, et avoir quelques bibliothèques dispo:
|
||||||
|
|
||||||
|
```shell bash install.sh ``` [2024-11-04] Testé avec: Pandoc 2.9.2.1
|
||||||
|
=> http://fr.archive.ubuntu.com/ubuntu/pool/universe/p/pandoc/pandoc_2.9.2.1-3ubuntu2_amd64.deb http://fr.archive.ubuntu.com/ubuntu/pool/universe/p/pandoc/pandoc_2.9.2.1-3ubuntu2_amd64.deb
|
||||||
|
|
||||||
|
Python 3.10.12 ## Conversion des fichiers Org vers gemini et html Ceci va convertir ce qui se trouve dans le dossier `sources/tykayn~blog~` et produire un site web dans `html~output~/tykayn~blog~` ainsi qu'une capsule gemini dans `capsules-gemini/tykayn~blog~`
|
||||||
|
|
||||||
|
```shell bash converters.sh tykayn~blog~ ```
|
||||||
|
|
||||||
|
## Conversion de blog en capsule gemini
|
||||||
|
|
||||||
|
L'idée est d'avoir un ensemble de billets de blogs en texte simple versionnés avec git et servis par une capsule gemini ainsi que par un site web. On aura besoin de convertir des billets existants, et de rédiger les nouveaux dans un format qui nous convient, par exemple markdown ou orgmode afin de rendre le tout le plus pérenne possible. On aura aussi besoin de référencer les images dans un dossier de notre dépot, et de gérer les relations entres articles pour que les liens aient du sens sur la capsule gemini autant que dans la version web. On souhaite aussi fournir un flux RSS, et un template de billet de blog avec une entête et un pied de page commun qui donne des moyens de contact, de soutenir l'auteur, et de revenir à l'accueil. On prendra aussi en charge différentes pages:
|
||||||
|
|
||||||
|
* à propos
|
||||||
|
* contact
|
||||||
|
* nos projets
|
||||||
|
* une liste des articles triés par date.
|
||||||
|
|
||||||
|
Il nous faudra aussi un script de mise à jour du blog qui se charge de mettre à jour le flux rss, le dépot git. On peut aller chercher de l'automatisation dans la gestion de plusieurs capsules différentes en tagguant les articles par nom de blog, ce qui nécessite un fichier de config pour les correspondances.
|
||||||
|
|
||||||
|
## Depuis wordpress Connec à la base de données mysql, et extraction de chaque article pour récupérer la partie HTML et la convertir en markdown et en fichiers org.
|
||||||
|
|
||||||
|
## Depuis des fichiers orgmode. J'écris en orgmode une base de connaissances qui contient aussi un export de mes anciens billets de blog dans un dossier par blog. Pour cibler quels billets utiliser pour quel blog j'ai donc deux possibilités: leur chemin de fichier, ou des tags particuliers présents dans les fichiers org.
|
||||||
|
=> id:5a197a1b-ddfe-4c79-8934-d9a28ab6df65 Textes de blog en préparation
|
||||||
|
|
||||||
|
=> https://forge.chapril.org/tykayn/org-report-stats https://forge.chapril.org/tykayn/org-report-stats
|
||||||
|
|
||||||
|
Rédaction, conversion, completion des nouveaux articles, régénération des indexs et flux rss, mise à jour du dépot git, publication des pages.
|
||||||
|
|
||||||
|
Offpunk LazyBlog Dotclear, Wordpress, Hugo, Pélican Pandoc, PandocGmi
|
||||||
|
=> https://github.com/njamescouk/pandocGmi/tree/master https://github.com/njamescouk/pandocGmi/tree/master
|
||||||
|
|
||||||
|
* config par site web de son nom de domaine
|
||||||
|
* réécriture des liens internes
|
||||||
|
* réécriture des url des images vers le dossier courant
|
||||||
|
* réparer la génération de fichiers gmi
|
||||||
|
* template footer article: gestion article suivant et précédent
|
||||||
|
* conversion des liens avec nom de domaine si relatifs
|
||||||
|
|
||||||
|
```{=html}
|
||||||
|
<!-- -->
|
||||||
|
```
|
||||||
|
|
||||||
|
* navigation sur les pages d'article
|
||||||
|
|
||||||
|
- gestion des langues dans la source et la destination
|
||||||
|
|
||||||
|
* gestion multi site et multi langue
|
||||||
</article>
|
</article>
|
||||||
</main>
|
</main>
|
||||||
<footer class="site-footer has-top-divider">
|
<footer class="site-footer has-top-divider">
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<div class="site-footer-inner">
|
<div class="site-footer-inner">
|
||||||
|
|
||||||
Cipher Bliss
|
|
||||||
Code, nouvelles technologies et entrepreneurariat par B. Lemoine
|
|
||||||
<nav><a href="/">Accueil</a><a href="https://portfolio.cipherbliss.com">Portfolio</a><a href="/feed">Flux RSS</a><a href="/contact">Contact</a><a href="/ressources-de-café-vie-privée">Ressources</a></nav>
|
<nav><a href="/">Accueil</a><a href="https://portfolio.cipherbliss.com">Portfolio</a><a href="/feed">Flux RSS</a><a href="/contact">Contact</a><a href="/ressources-de-café-vie-privée">Ressources</a></nav>
|
||||||
|
|
||||||
|
|
||||||
|
@ -32,14 +32,17 @@
|
|||||||
<body>
|
<body>
|
||||||
<div id="page">
|
<div id="page">
|
||||||
<header id="masthead" class="site-header">
|
<header id="masthead" class="site-header">
|
||||||
<div class="header-image">
|
<div class="header-image" style="background: url(https://www.cipherbliss.com/wp-content/uploads/2016/11/bg.jpg)">
|
||||||
https://www.cipherbliss.com/wp-content/uploads/2016/11/bg.jpg
|
<a href="/">
|
||||||
|
<img src="https://www.cipherbliss.com/wp-content/uploads/2016/12/rond.png" class="site-icon img">
|
||||||
|
</a>
|
||||||
|
<h1 class="blog-title">Cipher Bliss</h1>
|
||||||
|
<p class="blog-subtitle">Code, nouvelles technologies et entrepreneurariat par B. Lemoine</p>
|
||||||
</div>
|
</div>
|
||||||
<nav class="navbar is-fixed-top is-dark" role="navigation" aria-label="main navigation">
|
<nav class="navbar is-fixed-top is-dark" role="navigation" aria-label="main navigation">
|
||||||
<div class="navbar-brand">
|
<div class="navbar-brand">
|
||||||
<a class="navbar-item" href="https://www.cipherbliss.com">
|
<a class="navbar-item" href="https://www.cipherbliss.com">
|
||||||
<img src="https://www.cipherbliss.com/wp-content/uploads/2016/12/rond.png"
|
|
||||||
class="img-fluid">
|
|
||||||
</a>
|
</a>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
@ -281,8 +284,7 @@ href="https://web.archive.org/web/20240721071559/https://www.cipherbliss.com/">w
|
|||||||
<div class="container">
|
<div class="container">
|
||||||
<div class="site-footer-inner">
|
<div class="site-footer-inner">
|
||||||
|
|
||||||
Cipher Bliss
|
|
||||||
Code, nouvelles technologies et entrepreneurariat par B. Lemoine
|
|
||||||
<nav><a href="/">Accueil</a><a href="https://portfolio.cipherbliss.com">Portfolio</a><a href="/feed">Flux RSS</a><a href="/contact">Contact</a><a href="/ressources-de-café-vie-privée">Ressources</a></nav>
|
<nav><a href="/">Accueil</a><a href="https://portfolio.cipherbliss.com">Portfolio</a><a href="/feed">Flux RSS</a><a href="/contact">Contact</a><a href="/ressources-de-café-vie-privée">Ressources</a></nav>
|
||||||
|
|
||||||
|
|
||||||
|
@ -32,14 +32,17 @@
|
|||||||
<body>
|
<body>
|
||||||
<div id="page">
|
<div id="page">
|
||||||
<header id="masthead" class="site-header">
|
<header id="masthead" class="site-header">
|
||||||
<div class="header-image">
|
<div class="header-image" style="background: url(https://www.cipherbliss.com/wp-content/uploads/2016/11/bg.jpg)">
|
||||||
https://www.cipherbliss.com/wp-content/uploads/2016/11/bg.jpg
|
<a href="/">
|
||||||
|
<img src="https://www.cipherbliss.com/wp-content/uploads/2016/12/rond.png" class="site-icon img">
|
||||||
|
</a>
|
||||||
|
<h1 class="blog-title">Cipher Bliss</h1>
|
||||||
|
<p class="blog-subtitle">Code, nouvelles technologies et entrepreneurariat par B. Lemoine</p>
|
||||||
</div>
|
</div>
|
||||||
<nav class="navbar is-fixed-top is-dark" role="navigation" aria-label="main navigation">
|
<nav class="navbar is-fixed-top is-dark" role="navigation" aria-label="main navigation">
|
||||||
<div class="navbar-brand">
|
<div class="navbar-brand">
|
||||||
<a class="navbar-item" href="https://www.cipherbliss.com">
|
<a class="navbar-item" href="https://www.cipherbliss.com">
|
||||||
<img src="https://www.cipherbliss.com/wp-content/uploads/2016/12/rond.png"
|
|
||||||
class="img-fluid">
|
|
||||||
</a>
|
</a>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
@ -68,194 +71,17 @@
|
|||||||
</header>
|
</header>
|
||||||
<main class="body-wrap boxed-container">
|
<main class="body-wrap boxed-container">
|
||||||
<article class="content">
|
<article class="content">
|
||||||
<!DOCTYPE html>
|
<html><head><title>cipherbliss_blog</title><link rel="stylesheet" href="/style.css"></link></head><body>
|
||||||
<html xmlns="http://www.w3.org/1999/xhtml" lang="" xml:lang="">
|
|
||||||
<head>
|
|
||||||
<meta charset="utf-8" />
|
|
||||||
<meta name="generator" content="pandoc" />
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes" />
|
|
||||||
<title>cipherbliss_blog</title>
|
|
||||||
<style>
|
|
||||||
html {
|
|
||||||
color: #1a1a1a;
|
|
||||||
background-color: #fdfdfd;
|
|
||||||
}
|
|
||||||
body {
|
|
||||||
margin: 0 auto;
|
|
||||||
max-width: 36em;
|
|
||||||
padding-left: 50px;
|
|
||||||
padding-right: 50px;
|
|
||||||
padding-top: 50px;
|
|
||||||
padding-bottom: 50px;
|
|
||||||
hyphens: auto;
|
|
||||||
overflow-wrap: break-word;
|
|
||||||
text-rendering: optimizeLegibility;
|
|
||||||
font-kerning: normal;
|
|
||||||
}
|
|
||||||
@media (max-width: 600px) {
|
|
||||||
body {
|
|
||||||
font-size: 0.9em;
|
|
||||||
padding: 12px;
|
|
||||||
}
|
|
||||||
h1 {
|
|
||||||
font-size: 1.8em;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@media print {
|
|
||||||
html {
|
|
||||||
background-color: white;
|
|
||||||
}
|
|
||||||
body {
|
|
||||||
background-color: transparent;
|
|
||||||
color: black;
|
|
||||||
font-size: 12pt;
|
|
||||||
}
|
|
||||||
p, h2, h3 {
|
|
||||||
orphans: 3;
|
|
||||||
widows: 3;
|
|
||||||
}
|
|
||||||
h2, h3, h4 {
|
|
||||||
page-break-after: avoid;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
p {
|
|
||||||
margin: 1em 0;
|
|
||||||
}
|
|
||||||
a {
|
|
||||||
color: #1a1a1a;
|
|
||||||
}
|
|
||||||
a:visited {
|
|
||||||
color: #1a1a1a;
|
|
||||||
}
|
|
||||||
img {
|
|
||||||
max-width: 100%;
|
|
||||||
}
|
|
||||||
h1, h2, h3, h4, h5, h6 {
|
|
||||||
margin-top: 1.4em;
|
|
||||||
}
|
|
||||||
h5, h6 {
|
|
||||||
font-size: 1em;
|
|
||||||
font-style: italic;
|
|
||||||
}
|
|
||||||
h6 {
|
|
||||||
font-weight: normal;
|
|
||||||
}
|
|
||||||
ol, ul {
|
|
||||||
padding-left: 1.7em;
|
|
||||||
margin-top: 1em;
|
|
||||||
}
|
|
||||||
li > ol, li > ul {
|
|
||||||
margin-top: 0;
|
|
||||||
}
|
|
||||||
blockquote {
|
|
||||||
margin: 1em 0 1em 1.7em;
|
|
||||||
padding-left: 1em;
|
|
||||||
border-left: 2px solid #e6e6e6;
|
|
||||||
color: #606060;
|
|
||||||
}
|
|
||||||
code {
|
|
||||||
font-family: Menlo, Monaco, Consolas, 'Lucida Console', monospace;
|
|
||||||
font-size: 85%;
|
|
||||||
margin: 0;
|
|
||||||
hyphens: manual;
|
|
||||||
}
|
|
||||||
pre {
|
|
||||||
margin: 1em 0;
|
|
||||||
overflow: auto;
|
|
||||||
}
|
|
||||||
pre code {
|
|
||||||
padding: 0;
|
|
||||||
overflow: visible;
|
|
||||||
overflow-wrap: normal;
|
|
||||||
}
|
|
||||||
.sourceCode {
|
|
||||||
background-color: transparent;
|
|
||||||
overflow: visible;
|
|
||||||
}
|
|
||||||
hr {
|
|
||||||
background-color: #1a1a1a;
|
|
||||||
border: none;
|
|
||||||
height: 1px;
|
|
||||||
margin: 1em 0;
|
|
||||||
}
|
|
||||||
table {
|
|
||||||
margin: 1em 0;
|
|
||||||
border-collapse: collapse;
|
|
||||||
width: 100%;
|
|
||||||
overflow-x: auto;
|
|
||||||
display: block;
|
|
||||||
font-variant-numeric: lining-nums tabular-nums;
|
|
||||||
}
|
|
||||||
table caption {
|
|
||||||
margin-bottom: 0.75em;
|
|
||||||
}
|
|
||||||
tbody {
|
|
||||||
margin-top: 0.5em;
|
|
||||||
border-top: 1px solid #1a1a1a;
|
|
||||||
border-bottom: 1px solid #1a1a1a;
|
|
||||||
}
|
|
||||||
th {
|
|
||||||
border-top: 1px solid #1a1a1a;
|
|
||||||
padding: 0.25em 0.5em 0.25em 0.5em;
|
|
||||||
}
|
|
||||||
td {
|
|
||||||
padding: 0.125em 0.5em 0.25em 0.5em;
|
|
||||||
}
|
|
||||||
header {
|
|
||||||
margin-bottom: 4em;
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
#TOC li {
|
|
||||||
list-style: none;
|
|
||||||
}
|
|
||||||
#TOC ul {
|
|
||||||
padding-left: 1.3em;
|
|
||||||
}
|
|
||||||
#TOC > ul {
|
|
||||||
padding-left: 0;
|
|
||||||
}
|
|
||||||
#TOC a:not(:hover) {
|
|
||||||
text-decoration: none;
|
|
||||||
}
|
|
||||||
code{white-space: pre-wrap;}
|
|
||||||
span.smallcaps{font-variant: small-caps;}
|
|
||||||
div.columns{display: flex; gap: min(4vw, 1.5em);}
|
|
||||||
div.column{flex: auto; overflow-x: auto;}
|
|
||||||
div.hanging-indent{margin-left: 1.5em; text-indent: -1.5em;}
|
|
||||||
/* The extra [class] is a hack that increases specificity enough to
|
|
||||||
override a similar rule in reveal.js */
|
|
||||||
ul.task-list[class]{list-style: none;}
|
|
||||||
ul.task-list li input[type="checkbox"] {
|
|
||||||
font-size: inherit;
|
|
||||||
width: 0.8em;
|
|
||||||
margin: 0 0.8em 0.2em -1.6em;
|
|
||||||
vertical-align: middle;
|
|
||||||
}
|
|
||||||
.display.math{display: block; text-align: center; margin: 0.5rem auto;}
|
|
||||||
</style>
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
<header id="title-block-header">
|
|
||||||
<h1 class="title">cipherbliss_blog</h1>
|
|
||||||
</header>
|
|
||||||
<h1 id="cipherbliss">CipherBliss</h1>
|
|
||||||
<p>[contact](contact.org)</p>
|
|
||||||
<h1 id="articles">Articles</h1>
|
|
||||||
<h1 id="en-fr">en Fr</h1>
|
|
||||||
<h1 id="en-en">en En</h1>
|
|
||||||
<h1 id="flux-rss">Flux RSS</h1>
|
|
||||||
<h1 id="bisous">Bisous</h1>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
||||||
|
|
||||||
|
|
||||||
|
<h1>Navigation</h1><br><a href=/index.html>Index</a><br><a href=/contact.html>Contact</a><h1>Articles en Français</h1><br><a href=/2024/2024-11-03-création-d'un-blog-gemini>2024 2024 11 03 création d'un blog gemini</a><br><a href=/2021/cipherbliss_215_des-sauvegardes-qui-durent-mille-ans>2021 cipherbliss_215_des sauvegardes qui durent mille ans</a></article></body></html>
|
||||||
</article>
|
</article>
|
||||||
</main>
|
</main>
|
||||||
<footer class="site-footer has-top-divider">
|
<footer class="site-footer has-top-divider">
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<div class="site-footer-inner">
|
<div class="site-footer-inner">
|
||||||
|
|
||||||
Cipher Bliss
|
|
||||||
Code, nouvelles technologies et entrepreneurariat par B. Lemoine
|
|
||||||
<nav><a href="/">Accueil</a><a href="https://portfolio.cipherbliss.com">Portfolio</a><a href="/feed">Flux RSS</a><a href="/contact">Contact</a><a href="/ressources-de-café-vie-privée">Ressources</a></nav>
|
<nav><a href="/">Accueil</a><a href="https://portfolio.cipherbliss.com">Portfolio</a><a href="/feed">Flux RSS</a><a href="/contact">Contact</a><a href="/ressources-de-café-vie-privée">Ressources</a></nav>
|
||||||
|
|
||||||
|
|
||||||
|
@ -17,14 +17,20 @@ body {
|
|||||||
background: #fff;
|
background: #fff;
|
||||||
}
|
}
|
||||||
|
|
||||||
nav, .navbar,
|
nav,
|
||||||
|
.navbar,
|
||||||
.container,
|
.container,
|
||||||
.body-wrap {
|
.body-wrap {
|
||||||
max-width: 70ch;
|
max-width: 70ch;
|
||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
h1, h2, h3, h4, h5, h6 {
|
h1,
|
||||||
|
h2,
|
||||||
|
h3,
|
||||||
|
h4,
|
||||||
|
h5,
|
||||||
|
h6 {
|
||||||
font-family: Helvetica, "Ubuntu Sans", "Noto Sans", Calibri, Arial, sans-serif;
|
font-family: Helvetica, "Ubuntu Sans", "Noto Sans", Calibri, Arial, sans-serif;
|
||||||
margin-top: 1em;
|
margin-top: 1em;
|
||||||
margin-bottom: 2rem;
|
margin-bottom: 2rem;
|
||||||
@ -44,12 +50,15 @@ body {
|
|||||||
-webkit-font-smoothing: antialiased;
|
-webkit-font-smoothing: antialiased;
|
||||||
font-family: Helvetica, Arial, sans-serif;
|
font-family: Helvetica, Arial, sans-serif;
|
||||||
padding-bottom: 20vh;
|
padding-bottom: 20vh;
|
||||||
padding-left: 2rem;
|
|
||||||
padding-bottom: 2rem;
|
padding-bottom: 2rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Improve media defaults */
|
/* Improve media defaults */
|
||||||
img, picture, video, canvas, svg {
|
img,
|
||||||
|
picture,
|
||||||
|
video,
|
||||||
|
canvas,
|
||||||
|
svg {
|
||||||
display: block;
|
display: block;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
margin-top: 1rem;
|
margin-top: 1rem;
|
||||||
@ -58,16 +67,24 @@ img, picture, video, canvas, svg {
|
|||||||
}
|
}
|
||||||
|
|
||||||
/* Inherit fonts for form controls */
|
/* Inherit fonts for form controls */
|
||||||
input, button, textarea, select {
|
input,
|
||||||
|
button,
|
||||||
|
textarea,
|
||||||
|
select {
|
||||||
font: inherit;
|
font: inherit;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Avoid text overflows */
|
/* Avoid text overflows */
|
||||||
p, h1, h2, h3, h4, h5, h6 {
|
p,
|
||||||
|
h1,
|
||||||
|
h2,
|
||||||
|
h3,
|
||||||
|
h4,
|
||||||
|
h5,
|
||||||
|
h6 {
|
||||||
overflow-wrap: break-word;
|
overflow-wrap: break-word;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Improve line wrapping */
|
|
||||||
p {
|
p {
|
||||||
text-wrap: pretty;
|
text-wrap: pretty;
|
||||||
margin-top: 1.5rem;
|
margin-top: 1.5rem;
|
||||||
@ -87,26 +104,28 @@ h3 {
|
|||||||
font-size: 1.5rem;
|
font-size: 1.5rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
h1, h2, h3, h4, h5, h6 {
|
h1,
|
||||||
|
h2,
|
||||||
|
h3,
|
||||||
|
h4,
|
||||||
|
h5,
|
||||||
|
h6 {
|
||||||
text-wrap: balance;
|
text-wrap: balance;
|
||||||
line-height: 1.3em;
|
line-height: 1.3em;
|
||||||
}
|
}
|
||||||
|
|
||||||
#root, #__next {
|
#root,
|
||||||
|
#__next {
|
||||||
isolation: isolate;
|
isolation: isolate;
|
||||||
}
|
}
|
||||||
|
|
||||||
input, button, textarea, select {
|
input,
|
||||||
|
button,
|
||||||
|
textarea,
|
||||||
|
select {
|
||||||
font: inherit;
|
font: inherit;
|
||||||
}
|
}
|
||||||
|
|
||||||
a {
|
|
||||||
display: inline-block;
|
|
||||||
padding: 0.5rem 2rem;
|
|
||||||
margin-right: 1rem;
|
|
||||||
margin-bottom: 1rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
ul {
|
ul {
|
||||||
padding-left: 4ch;
|
padding-left: 4ch;
|
||||||
padding-right: 4ch;
|
padding-right: 4ch;
|
||||||
@ -126,12 +145,54 @@ li {
|
|||||||
margin-right: 1rem;
|
margin-right: 1rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#masthead {
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
#masthead .site-icon {
|
||||||
|
width: 9rem;
|
||||||
|
height: auto;
|
||||||
|
margin: 1rem auto;
|
||||||
|
position: static;
|
||||||
|
padding: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.header-image {
|
||||||
|
padding: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.blog-title,
|
||||||
|
.blog-subtitle {
|
||||||
|
margin: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
.content {
|
.content {
|
||||||
min-height: 50rem;
|
min-height: 50rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
@media (max-width: 20rem) {
|
.site-footer {
|
||||||
|
min-height: 20vh;
|
||||||
|
padding: 2rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
a {
|
||||||
|
display: inline-block;
|
||||||
|
padding: 0.55rem 2rem;
|
||||||
|
margin-right: 1rem;
|
||||||
|
margin-bottom: 1rem;
|
||||||
|
border-radius: 1rem;
|
||||||
|
color: rgb(0, 123, 255);
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
main a:hover {
|
||||||
|
background: #303030;
|
||||||
|
color: #dedede;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 75ch) {
|
||||||
body {
|
body {
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
main {
|
||||||
padding: 1rem;
|
padding: 1rem;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -10,3 +10,4 @@
|
|||||||
# Articles en Français
|
# Articles en Français
|
||||||
-------------------------
|
-------------------------
|
||||||
=> 2024-11-03-création-d'un-blog-gemini.gmi
|
=> 2024-11-03-création-d'un-blog-gemini.gmi
|
||||||
|
=> 20210927092238_cipherbliss_215_des-sauvegardes-qui-durent-mille-ans.gmi
|
||||||
|
@ -0,0 +1,68 @@
|
|||||||
|
* Des sauvegardes qui durent mille ans
|
||||||
|
:PROPERTIES:
|
||||||
|
:CUSTOM_ID: des-sauvegardes-qui-durent-mille-ans
|
||||||
|
:END:
|
||||||
|
J'ai animé un atelier au cours du premier camp
|
||||||
|
CHATONS qui a eu lieu le week-end dernier. (Le
|
||||||
|
[[https://www.chatons.org/][Collectif des Hébergeurs Alternatifs,
|
||||||
|
Transparents, Ouverts, Neutres et Solidaires]] vise à rassembler des
|
||||||
|
structures proposant des *services en ligne libres, éthiques et
|
||||||
|
décentralisés* afin de permettre aux utilisateur⋅ices de
|
||||||
|
[[https://www.chatons.org/search/by-service][trouver rapidement des
|
||||||
|
alternatives]] respectueuses de leurs données et de leur vie
|
||||||
|
privée)Pas de compte rendu du camp en lui même pour
|
||||||
|
tout de suite, cependant voici un résumé de l'atelier qui aura duré près
|
||||||
|
d'une heure.
|
||||||
|
[[https://libreto.sans-nuage.fr/camps-chatons/programme]]
|
||||||
|
|
||||||
|
Comment se protéger des pertes de données et ne pas perdre la confiance
|
||||||
|
et les précieuses données des membres de son CHATONS?
|
||||||
|
|
||||||
|
L'atelier aborde la définition d'un modèle de menace pour savoir contre
|
||||||
|
quoi se prémunir, et quels critères de qualité utiliser pour réaliser
|
||||||
|
automatiquement ses sauvegardes en tant que particulier, ou en tant que
|
||||||
|
CHATONS.
|
||||||
|
On y voit de la façon la plus "grand public" à la façon la plus "techno
|
||||||
|
geek" comment récupérer ses données éparpillées en ligne, historiser,
|
||||||
|
chiffrer, dédupliquer, compresser, répliquer, partager les clés d'accès,
|
||||||
|
et prévoir des restaurations périodiques, de sorte que les données les
|
||||||
|
plus cruciales survivent à leurs administrateurs et
|
||||||
|
administratrices.
|
||||||
|
|
||||||
|
#+caption: Jancovici et le stockage à froid, une remarquable utilisation
|
||||||
|
des couches géologiquement stables
|
||||||
|
[[https://www.cipherbliss.com/wp-content/uploads/2021/09/Screenshot_2021-09-27-Les-Sauvegardes-automatiques-Slides-1024x747.jpg]]
|
||||||
|
|
||||||
|
|
||||||
|
Liens:
|
||||||
|
Les slides sont disponibles ici:
|
||||||
|
[[https://slides.com/tykayn/les-sauvegardes-automatiques]]
|
||||||
|
|
||||||
|
La feuille de calcul pour cartographier son matériel
|
||||||
|
[[https://cloud.tykayn.fr/index.php/s/KQfYHpaSpgwrWam]]Le
|
||||||
|
site des CHATONS:
|
||||||
|
[[https://www.chatons.org]]Le forum où tout se
|
||||||
|
discute:
|
||||||
|
[[file:%20https://forum.chatons.org][https://forum.chatons.org]]La
|
||||||
|
documentation pour ne pas réinventer la roue:
|
||||||
|
[[https://wiki.chatons.org]]
|
||||||
|
|
||||||
|
* Métadonnées
|
||||||
|
:PROPERTIES:
|
||||||
|
:CUSTOM_ID: métadonnées
|
||||||
|
:END:
|
||||||
|
:PROPERTIES:
|
||||||
|
:ID: 3154e447-b390-481f-8842-18f9ca75c58f
|
||||||
|
:END:
|
||||||
|
#+title:des-sauvegardes-qui-durent-mille-ans
|
||||||
|
#+post_ID: 1595
|
||||||
|
#+post_slug: des-sauvegardes-qui-durent-mille-ans
|
||||||
|
#+post_url: https://www.ciperbliss.com/2021/des-sauvegardes-qui-durent-mille-ans
|
||||||
|
#+post_title: Des sauvegardes qui durent mille ans
|
||||||
|
#+post_type: post #+post_mime_types:
|
||||||
|
#+post_guid:https://www.cipherbliss.com/?p=1595 #+post_status:
|
||||||
|
publish #+post_date_published: <2021-09-27 09:22:38>
|
||||||
|
#+post_date_modified: <2021-09-27 09:22:42>
|
||||||
|
#+post_index_page_roam_id: [[id:1b454ab3-53f0-411f-94e6-d488718dee27][undefined]]
|
||||||
|
#+retrieved_from_db_at: <2024-11-07 22:57:06>
|
||||||
|
|
@ -9,5 +9,90 @@
|
|||||||
* Création d'un blog gemini
|
* Création d'un blog gemini
|
||||||
Et hop, un générateur qui fait le café à partir de fichiers orgmode ou markdown.
|
Et hop, un générateur qui fait le café à partir de fichiers orgmode ou markdown.
|
||||||
|
|
||||||
[2024-11-03]
|
Génération de capsules gemini et blog html à partir d'articles en fichiers Orgmode.
|
||||||
|
|
||||||
|
exemple avec le blog de DragonFeu.
|
||||||
|
`sources/dragonfeu_blog`
|
||||||
|
|
||||||
|
Les articles sont écrits dans le dossier source/, leur nom permet de déduire l'ordre de publication grâce à une date YYY-MM-DD en début de nom de fichier
|
||||||
|
## création d'un article
|
||||||
|
Pour un article en langue En, sur le blog cipherbliss_blog, donner le titre entre guillemets ainsi:
|
||||||
|
```shell
|
||||||
|
python3 new_article.py cipherbliss_blog en "Creation of a gemini blog"
|
||||||
|
```
|
||||||
|
## prérequis pour installation
|
||||||
|
|
||||||
|
Avoir des articles au format org, les mettre dans un dossier source/nom_du_blog, et avoir quelques bibliothèques dispo:
|
||||||
|
|
||||||
|
```shell
|
||||||
|
bash install.sh
|
||||||
|
```
|
||||||
|
[2024-11-04]
|
||||||
|
Testé avec:
|
||||||
|
Pandoc 2.9.2.1
|
||||||
|
http://fr.archive.ubuntu.com/ubuntu/pool/universe/p/pandoc/pandoc_2.9.2.1-3ubuntu2_amd64.deb
|
||||||
|
|
||||||
|
Python 3.10.12
|
||||||
|
## Conversion des fichiers Org vers gemini et html
|
||||||
|
Ceci va convertir ce qui se trouve dans le dossier `sources/tykayn_blog`
|
||||||
|
et produire un site web dans `html_output/tykayn_blog`
|
||||||
|
ainsi qu'une capsule gemini dans `capsules-gemini/tykayn_blog`
|
||||||
|
|
||||||
|
```shell
|
||||||
|
bash converters.sh tykayn_blog
|
||||||
|
```
|
||||||
|
|
||||||
|
|
||||||
|
## Conversion de blog en capsule gemini
|
||||||
|
:PROPERTIES:
|
||||||
|
:CREATED: [2024-11-02 12:08:22]
|
||||||
|
:END:
|
||||||
|
|
||||||
|
L'idée est d'avoir un ensemble de billets de blogs en texte simple versionnés avec git et servis par une capsule gemini ainsi que par un site web.
|
||||||
|
On aura besoin de convertir des billets existants, et de rédiger les nouveaux dans un format qui nous convient, par exemple markdown ou orgmode afin de rendre le tout le plus pérenne possible.
|
||||||
|
On aura aussi besoin de référencer les images dans un dossier de notre dépot, et de gérer les relations entres articles pour que les liens aient du sens sur la capsule gemini autant que dans la version web.
|
||||||
|
On souhaite aussi fournir un flux RSS, et un template de billet de blog avec une entête et un pied de page commun qui donne des moyens de contact, de soutenir l'auteur, et de revenir à l'accueil.
|
||||||
|
On prendra aussi en charge différentes pages:
|
||||||
|
- à propos
|
||||||
|
- contact
|
||||||
|
- nos projets
|
||||||
|
- une liste des articles triés par date.
|
||||||
|
Il nous faudra aussi un script de mise à jour du blog qui se charge de mettre à jour le flux rss, le dépot git.
|
||||||
|
On peut aller chercher de l'automatisation dans la gestion de plusieurs capsules différentes en tagguant les articles par nom de blog, ce qui nécessite un fichier de config pour les correspondances.
|
||||||
|
|
||||||
|
# export d'articles existants
|
||||||
|
## Depuis wordpress
|
||||||
|
Connec à la base de données mysql, et extraction de chaque article pour récupérer la partie HTML et la convertir en markdown et en fichiers org.
|
||||||
|
|
||||||
|
## Depuis des fichiers orgmode.
|
||||||
|
J'écris en orgmode une base de connaissances qui contient aussi un export de mes anciens billets de blog dans un dossier par blog. Pour cibler quels billets utiliser pour quel blog j'ai donc deux possibilités: leur chemin de fichier, ou des tags particuliers présents dans les fichiers org.
|
||||||
|
[[id:5a197a1b-ddfe-4c79-8934-d9a28ab6df65][Textes de blog en préparation]]
|
||||||
|
https://forge.chapril.org/tykayn/org-report-stats
|
||||||
|
|
||||||
|
# Flux créatif
|
||||||
|
Rédaction,
|
||||||
|
conversion,
|
||||||
|
completion des nouveaux articles,
|
||||||
|
régénération des indexs et flux rss,
|
||||||
|
mise à jour du dépot git,
|
||||||
|
publication des pages.
|
||||||
|
# Sources d'inspiration:
|
||||||
|
Offpunk
|
||||||
|
LazyBlog
|
||||||
|
Dotclear, Wordpress, Hugo, Pélican
|
||||||
|
Pandoc, PandocGmi
|
||||||
|
https://github.com/njamescouk/pandocGmi/tree/master
|
||||||
|
|
||||||
|
# Roadmap
|
||||||
|
|
||||||
|
- config par site web de son nom de domaine
|
||||||
|
- réécriture des liens internes
|
||||||
|
- réécriture des url des images vers le dossier courant
|
||||||
|
- réparer la génération de fichiers gmi
|
||||||
|
- template footer article: gestion article suivant et précédent
|
||||||
|
- conversion des liens avec nom de domaine si relatifs
|
||||||
|
|
||||||
|
# Fait
|
||||||
|
- navigation sur les pages d'article
|
||||||
|
- gestion des langues dans la source et la destination
|
||||||
|
- gestion multi site et multi langue
|
||||||
|
@ -1,246 +0,0 @@
|
|||||||
<!DOCTYPE html>
|
|
||||||
<html xmlns="http://www.w3.org/1999/xhtml" lang="" xml:lang="">
|
|
||||||
<head>
|
|
||||||
<meta charset="utf-8" />
|
|
||||||
<meta name="generator" content="pandoc" />
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes" />
|
|
||||||
<title>cipherbliss_blog</title>
|
|
||||||
<style>
|
|
||||||
html {
|
|
||||||
color: #1a1a1a;
|
|
||||||
background-color: #fdfdfd;
|
|
||||||
}
|
|
||||||
body {
|
|
||||||
margin: 0 auto;
|
|
||||||
max-width: 36em;
|
|
||||||
padding-left: 50px;
|
|
||||||
padding-right: 50px;
|
|
||||||
padding-top: 50px;
|
|
||||||
padding-bottom: 50px;
|
|
||||||
hyphens: auto;
|
|
||||||
overflow-wrap: break-word;
|
|
||||||
text-rendering: optimizeLegibility;
|
|
||||||
font-kerning: normal;
|
|
||||||
}
|
|
||||||
@media (max-width: 600px) {
|
|
||||||
body {
|
|
||||||
font-size: 0.9em;
|
|
||||||
padding: 12px;
|
|
||||||
}
|
|
||||||
h1 {
|
|
||||||
font-size: 1.8em;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@media print {
|
|
||||||
html {
|
|
||||||
background-color: white;
|
|
||||||
}
|
|
||||||
body {
|
|
||||||
background-color: transparent;
|
|
||||||
color: black;
|
|
||||||
font-size: 12pt;
|
|
||||||
}
|
|
||||||
p, h2, h3 {
|
|
||||||
orphans: 3;
|
|
||||||
widows: 3;
|
|
||||||
}
|
|
||||||
h2, h3, h4 {
|
|
||||||
page-break-after: avoid;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
p {
|
|
||||||
margin: 1em 0;
|
|
||||||
}
|
|
||||||
a {
|
|
||||||
color: #1a1a1a;
|
|
||||||
}
|
|
||||||
a:visited {
|
|
||||||
color: #1a1a1a;
|
|
||||||
}
|
|
||||||
img {
|
|
||||||
max-width: 100%;
|
|
||||||
}
|
|
||||||
h1, h2, h3, h4, h5, h6 {
|
|
||||||
margin-top: 1.4em;
|
|
||||||
}
|
|
||||||
h5, h6 {
|
|
||||||
font-size: 1em;
|
|
||||||
font-style: italic;
|
|
||||||
}
|
|
||||||
h6 {
|
|
||||||
font-weight: normal;
|
|
||||||
}
|
|
||||||
ol, ul {
|
|
||||||
padding-left: 1.7em;
|
|
||||||
margin-top: 1em;
|
|
||||||
}
|
|
||||||
li > ol, li > ul {
|
|
||||||
margin-top: 0;
|
|
||||||
}
|
|
||||||
blockquote {
|
|
||||||
margin: 1em 0 1em 1.7em;
|
|
||||||
padding-left: 1em;
|
|
||||||
border-left: 2px solid #e6e6e6;
|
|
||||||
color: #606060;
|
|
||||||
}
|
|
||||||
code {
|
|
||||||
font-family: Menlo, Monaco, Consolas, 'Lucida Console', monospace;
|
|
||||||
font-size: 85%;
|
|
||||||
margin: 0;
|
|
||||||
hyphens: manual;
|
|
||||||
}
|
|
||||||
pre {
|
|
||||||
margin: 1em 0;
|
|
||||||
overflow: auto;
|
|
||||||
}
|
|
||||||
pre code {
|
|
||||||
padding: 0;
|
|
||||||
overflow: visible;
|
|
||||||
overflow-wrap: normal;
|
|
||||||
}
|
|
||||||
.sourceCode {
|
|
||||||
background-color: transparent;
|
|
||||||
overflow: visible;
|
|
||||||
}
|
|
||||||
hr {
|
|
||||||
background-color: #1a1a1a;
|
|
||||||
border: none;
|
|
||||||
height: 1px;
|
|
||||||
margin: 1em 0;
|
|
||||||
}
|
|
||||||
table {
|
|
||||||
margin: 1em 0;
|
|
||||||
border-collapse: collapse;
|
|
||||||
width: 100%;
|
|
||||||
overflow-x: auto;
|
|
||||||
display: block;
|
|
||||||
font-variant-numeric: lining-nums tabular-nums;
|
|
||||||
}
|
|
||||||
table caption {
|
|
||||||
margin-bottom: 0.75em;
|
|
||||||
}
|
|
||||||
tbody {
|
|
||||||
margin-top: 0.5em;
|
|
||||||
border-top: 1px solid #1a1a1a;
|
|
||||||
border-bottom: 1px solid #1a1a1a;
|
|
||||||
}
|
|
||||||
th {
|
|
||||||
border-top: 1px solid #1a1a1a;
|
|
||||||
padding: 0.25em 0.5em 0.25em 0.5em;
|
|
||||||
}
|
|
||||||
td {
|
|
||||||
padding: 0.125em 0.5em 0.25em 0.5em;
|
|
||||||
}
|
|
||||||
header {
|
|
||||||
margin-bottom: 4em;
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
#TOC li {
|
|
||||||
list-style: none;
|
|
||||||
}
|
|
||||||
#TOC ul {
|
|
||||||
padding-left: 1.3em;
|
|
||||||
}
|
|
||||||
#TOC > ul {
|
|
||||||
padding-left: 0;
|
|
||||||
}
|
|
||||||
#TOC a:not(:hover) {
|
|
||||||
text-decoration: none;
|
|
||||||
}
|
|
||||||
code{white-space: pre-wrap;}
|
|
||||||
span.smallcaps{font-variant: small-caps;}
|
|
||||||
div.columns{display: flex; gap: min(4vw, 1.5em);}
|
|
||||||
div.column{flex: auto; overflow-x: auto;}
|
|
||||||
div.hanging-indent{margin-left: 1.5em; text-indent: -1.5em;}
|
|
||||||
/* The extra [class] is a hack that increases specificity enough to
|
|
||||||
override a similar rule in reveal.js */
|
|
||||||
ul.task-list[class]{list-style: none;}
|
|
||||||
ul.task-list li input[type="checkbox"] {
|
|
||||||
font-size: inherit;
|
|
||||||
width: 0.8em;
|
|
||||||
margin: 0 0.8em 0.2em -1.6em;
|
|
||||||
vertical-align: middle;
|
|
||||||
}
|
|
||||||
.display.math{display: block; text-align: center; margin: 0.5rem auto;}
|
|
||||||
</style>
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
<header id="title-block-header">
|
|
||||||
<h1 class="title">cipherbliss_blog</h1>
|
|
||||||
</header>
|
|
||||||
<h1 id="article">Article</h1>
|
|
||||||
<ul>
|
|
||||||
<li>ID: 1595</li>
|
|
||||||
<li>guid:</li>
|
|
||||||
<li>status: publish</li>
|
|
||||||
<li>publié le: <2021-09-27 09:22:38></li>
|
|
||||||
<li>modifié: <2021-09-27 09:22:42></li>
|
|
||||||
<li>Index des articles du blog <a
|
|
||||||
href="id:39e91a2e-d003-4acd-a99a-b58dca74df77">Cipherbliss blog</a></li>
|
|
||||||
</ul>
|
|
||||||
<h2 id="des-sauvegardes-qui-durent-mille-ans-1">Des sauvegardes qui
|
|
||||||
durent mille ans</h2>
|
|
||||||
<p>ceci<sub>estduhtml</sub></p>
|
|
||||||
<p>J'ai animé un atelier au cours du premier camp CHATONS qui a eu lieu
|
|
||||||
le week-end dernier. (Le <a href="<a
|
|
||||||
href="https://www.chatons.org/">https://www.chatons.org/</a>">Collectif
|
|
||||||
des Hébergeurs Alternatifs, Transparents, Ouverts, Neutres et
|
|
||||||
Solidaires</a> vise à rassembler des structures proposant des
|
|
||||||
<strong>services en ligne libres, éthiques et
|
|
||||||
décentralisés</strong> afin de permettre aux utilisateur⋅ices de
|
|
||||||
<a href="<a
|
|
||||||
href="https://www.chatons.org/search/by-service">https://www.chatons.org/search/by-service</a>">trouver
|
|
||||||
rapidement des alternatives</a> respectueuses de leurs données et
|
|
||||||
de leur vie privée)#+begin<sub>src</sub> shell</p>
|
|
||||||
<p>Pas de compte rendu du camp en lui même pour tout de suite, cependant
|
|
||||||
voici un résumé de l'atelier qui aura duré près d'une
|
|
||||||
heure.<br><a href="<a
|
|
||||||
href="https://libreto.sans-nuage.fr/camps-chatons/programme">https://libreto.sans-nuage.fr/camps-chatons/programme</a>"><a
|
|
||||||
href="https://libreto.sans-nuage.fr/camps-chatons/programme">https://libreto.sans-nuage.fr/camps-chatons/programme</a></a><br><br>Comment
|
|
||||||
se protéger des pertes de données et ne pas perdre la confiance et les
|
|
||||||
précieuses données des membres de son
|
|
||||||
CHATONS?<br><br>L'atelier aborde la définition d'un modèle
|
|
||||||
de menace pour savoir contre quoi se prémunir, et quels critères de
|
|
||||||
qualité utiliser pour réaliser automatiquement ses sauvegardes en tant
|
|
||||||
que particulier, ou en tant que CHATONS.<br>On y voit de la façon
|
|
||||||
la plus "grand public" à la façon la plus "techno geek" comment
|
|
||||||
récupérer ses données éparpillées en ligne, historiser, chiffrer,
|
|
||||||
dédupliquer, compresser, répliquer, partager les clés d'accès, et
|
|
||||||
prévoir des restaurations périodiques, de sorte que les données les plus
|
|
||||||
cruciales survivent à leurs administrateurs et
|
|
||||||
administratrices.#+begin<sub>src</sub> shell</p>
|
|
||||||
<p><!– wp:image
|
|
||||||
{"id":1598,"sizeSlug":"large","linkDestination":"none"} –> <figure
|
|
||||||
class="wp-block-image size-large"><img src="<a
|
|
||||||
href="https://www.cipherbliss.com/wp-content/uploads/2021/09/Screenshot_2021-09-27-Les-Sauvegardes-automatiques-Slides-1024x747.jpg">https://www.cipherbliss.com/wp-content/uploads/2021/09/Screenshot_2021-09-27-Les-Sauvegardes-automatiques-Slides-1024x747.jpg</a>"
|
|
||||||
alt="" class="wp-image-1598"/><figcaption>Jancovici et le
|
|
||||||
stockage à froid, une remarquable utilisation des couches géologiquement
|
|
||||||
stables</figcaption></figure> <!– /wp:image –></p>
|
|
||||||
<p><br>Liens:<br>Les slides sont disponibles
|
|
||||||
ici:<br><a href="<a
|
|
||||||
href="https://slides.com/tykayn/les-sauvegardes-automatiques">https://slides.com/tykayn/les-sauvegardes-automatiques</a>"><a
|
|
||||||
href="https://slides.com/tykayn/les-sauvegardes-automatiques">https://slides.com/tykayn/les-sauvegardes-automatiques</a></a><br><br>La
|
|
||||||
feuille de calcul pour cartographier son matériel<br><a
|
|
||||||
href="<a
|
|
||||||
href="https://cloud.tykayn.fr/index.php/s/KQfYHpaSpgwrWam">https://cloud.tykayn.fr/index.php/s/KQfYHpaSpgwrWam</a>"><a
|
|
||||||
href="https://cloud.tykayn.fr/index.php/s/KQfYHpaSpgwrWam">https://cloud.tykayn.fr/index.php/s/KQfYHpaSpgwrWam</a></a>#+begin<sub>src</sub>
|
|
||||||
shell</p>
|
|
||||||
<p>Le site des CHATONS: <br><a href="<a
|
|
||||||
href="https://www.chatons.org">https://www.chatons.org</a>"><a
|
|
||||||
href="https://www.chatons.org">https://www.chatons.org</a></a>#+begin<sub>src</sub>
|
|
||||||
shell</p>
|
|
||||||
<p>Le forum où tout se discute:<br><a href=" <a
|
|
||||||
href="https://forum.chatons.org">https://forum.chatons.org</a>"> <a
|
|
||||||
href="https://forum.chatons.org">https://forum.chatons.org</a></a>#+begin<sub>src</sub>
|
|
||||||
shell</p>
|
|
||||||
<p>La documentation pour ne pas réinventer la roue: <br><a
|
|
||||||
href="<a
|
|
||||||
href="https://wiki.chatons.org">https://wiki.chatons.org</a>"><a
|
|
||||||
href="https://wiki.chatons.org">https://wiki.chatons.org</a></a></p>
|
|
||||||
<h1 id="liens">Liens</h1>
|
|
||||||
<ul>
|
|
||||||
<li>cipherbliss <a
|
|
||||||
href="id:d14d8051-bbb9-4279-a574-84d78bfe5b66">Cipherbliss blog</a></li>
|
|
||||||
</ul>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
@ -17,14 +17,20 @@ body {
|
|||||||
background: #fff;
|
background: #fff;
|
||||||
}
|
}
|
||||||
|
|
||||||
nav, .navbar,
|
nav,
|
||||||
|
.navbar,
|
||||||
.container,
|
.container,
|
||||||
.body-wrap {
|
.body-wrap {
|
||||||
max-width: 70ch;
|
max-width: 70ch;
|
||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
h1, h2, h3, h4, h5, h6 {
|
h1,
|
||||||
|
h2,
|
||||||
|
h3,
|
||||||
|
h4,
|
||||||
|
h5,
|
||||||
|
h6 {
|
||||||
font-family: Helvetica, "Ubuntu Sans", "Noto Sans", Calibri, Arial, sans-serif;
|
font-family: Helvetica, "Ubuntu Sans", "Noto Sans", Calibri, Arial, sans-serif;
|
||||||
margin-top: 1em;
|
margin-top: 1em;
|
||||||
margin-bottom: 2rem;
|
margin-bottom: 2rem;
|
||||||
@ -44,12 +50,15 @@ body {
|
|||||||
-webkit-font-smoothing: antialiased;
|
-webkit-font-smoothing: antialiased;
|
||||||
font-family: Helvetica, Arial, sans-serif;
|
font-family: Helvetica, Arial, sans-serif;
|
||||||
padding-bottom: 20vh;
|
padding-bottom: 20vh;
|
||||||
padding-left: 2rem;
|
|
||||||
padding-bottom: 2rem;
|
padding-bottom: 2rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Improve media defaults */
|
/* Improve media defaults */
|
||||||
img, picture, video, canvas, svg {
|
img,
|
||||||
|
picture,
|
||||||
|
video,
|
||||||
|
canvas,
|
||||||
|
svg {
|
||||||
display: block;
|
display: block;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
margin-top: 1rem;
|
margin-top: 1rem;
|
||||||
@ -58,16 +67,24 @@ img, picture, video, canvas, svg {
|
|||||||
}
|
}
|
||||||
|
|
||||||
/* Inherit fonts for form controls */
|
/* Inherit fonts for form controls */
|
||||||
input, button, textarea, select {
|
input,
|
||||||
|
button,
|
||||||
|
textarea,
|
||||||
|
select {
|
||||||
font: inherit;
|
font: inherit;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Avoid text overflows */
|
/* Avoid text overflows */
|
||||||
p, h1, h2, h3, h4, h5, h6 {
|
p,
|
||||||
|
h1,
|
||||||
|
h2,
|
||||||
|
h3,
|
||||||
|
h4,
|
||||||
|
h5,
|
||||||
|
h6 {
|
||||||
overflow-wrap: break-word;
|
overflow-wrap: break-word;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Improve line wrapping */
|
|
||||||
p {
|
p {
|
||||||
text-wrap: pretty;
|
text-wrap: pretty;
|
||||||
margin-top: 1.5rem;
|
margin-top: 1.5rem;
|
||||||
@ -87,26 +104,28 @@ h3 {
|
|||||||
font-size: 1.5rem;
|
font-size: 1.5rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
h1, h2, h3, h4, h5, h6 {
|
h1,
|
||||||
|
h2,
|
||||||
|
h3,
|
||||||
|
h4,
|
||||||
|
h5,
|
||||||
|
h6 {
|
||||||
text-wrap: balance;
|
text-wrap: balance;
|
||||||
line-height: 1.3em;
|
line-height: 1.3em;
|
||||||
}
|
}
|
||||||
|
|
||||||
#root, #__next {
|
#root,
|
||||||
|
#__next {
|
||||||
isolation: isolate;
|
isolation: isolate;
|
||||||
}
|
}
|
||||||
|
|
||||||
input, button, textarea, select {
|
input,
|
||||||
|
button,
|
||||||
|
textarea,
|
||||||
|
select {
|
||||||
font: inherit;
|
font: inherit;
|
||||||
}
|
}
|
||||||
|
|
||||||
a {
|
|
||||||
display: inline-block;
|
|
||||||
padding: 0.5rem 2rem;
|
|
||||||
margin-right: 1rem;
|
|
||||||
margin-bottom: 1rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
ul {
|
ul {
|
||||||
padding-left: 4ch;
|
padding-left: 4ch;
|
||||||
padding-right: 4ch;
|
padding-right: 4ch;
|
||||||
@ -126,12 +145,54 @@ li {
|
|||||||
margin-right: 1rem;
|
margin-right: 1rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#masthead {
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
#masthead .site-icon {
|
||||||
|
width: 9rem;
|
||||||
|
height: auto;
|
||||||
|
margin: 1rem auto;
|
||||||
|
position: static;
|
||||||
|
padding: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.header-image {
|
||||||
|
padding: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.blog-title,
|
||||||
|
.blog-subtitle {
|
||||||
|
margin: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
.content {
|
.content {
|
||||||
min-height: 50rem;
|
min-height: 50rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
@media (max-width: 20rem) {
|
.site-footer {
|
||||||
|
min-height: 20vh;
|
||||||
|
padding: 2rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
a {
|
||||||
|
display: inline-block;
|
||||||
|
padding: 0.55rem 2rem;
|
||||||
|
margin-right: 1rem;
|
||||||
|
margin-bottom: 1rem;
|
||||||
|
border-radius: 1rem;
|
||||||
|
color: rgb(0, 123, 255);
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
main a:hover {
|
||||||
|
background: #303030;
|
||||||
|
color: #dedede;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 75ch) {
|
||||||
body {
|
body {
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
main {
|
||||||
padding: 1rem;
|
padding: 1rem;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -1 +1 @@
|
|||||||
{"version":3,"sourceRoot":"","sources":["../styles_src/style_general.scss"],"names":[],"mappings":"AAAA;EACI;EACA;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EAEA;EACA;EAEA;EACA;;;AAGF;AAAA;AAAA;EAGE;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;AAEA;EACE;;AAEA;EACE;;;AAIJ;AACE;EACA;EACA;EACA;EACA;EACA;;;AAGF;AAEA;EACE;EACA;EACA;EACA;EACA;;;AAGF;AAEA;EACE;;;AAGF;AAEA;EACE;;;AAGF;AAEA;EACE;EACA;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;EACA;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;EACA;;;AAEF;EACE;EACA;;;AAGF;EACE;;;AAIF;EACE;;;AAIA;EAEE;EACA;EACA;;;AAIJ;EACE;;;AAEF;EACE;IACE","file":"style_general.css"}
|
{"version":3,"sourceRoot":"","sources":["../styles_src/style_general.scss"],"names":[],"mappings":"AAAA;EACE;EACA;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EAEA;EACA;EAEA;EACA;;;AAGF;AAAA;AAAA;AAAA;EAIE;EACA;;;AAGF;AAAA;AAAA;AAAA;AAAA;AAAA;EAME;EACA;EACA;EACA;;;AAGF;AAEA;EACE;;AAEA;EAEE;;;AAIJ;AACE;EACA;EACA;EACA;EACA;;;AAKF;AAEA;AAAA;AAAA;AAAA;AAAA;EAKE;EACA;EACA;EACA;EACA;;;AAGF;AAEA;AAAA;AAAA;AAAA;EAIE;;;AAGF;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAOE;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;AAAA;AAAA;AAAA;AAAA;AAAA;EAME;EACA;;;AAGF;AAAA;EAEE;;;AAGF;AAAA;AAAA;AAAA;EAIE;;;AAGF;EACE;EACA;;;AAGF;EACE;;;AAIF;EACE;;;AAIA;EAEE;EACA;EACA;;;AAIJ;EACE;;AACA;EACE;EACA;EACA;EACA;EACA;;;AAGJ;EACE;;;AAEF;AAAA;EAEE;;;AAGF;EACE;;;AAGF;EACE;EACA;;;AAIF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;;;AAKJ;EACE;IACE;;EAEF;IACE","file":"style_general.css"}
|
@ -2,14 +2,14 @@
|
|||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
html {
|
html {
|
||||||
font-size: 1rem;
|
font-size: 1rem;
|
||||||
font-family: Helvetica, "Ubuntu Sans", "Noto Sans", Calibri, Arial, sans-serif;
|
font-family: Helvetica, "Ubuntu Sans", "Noto Sans", Calibri, Arial, sans-serif;
|
||||||
}
|
}
|
||||||
|
|
||||||
body {
|
body {
|
||||||
text-align: left;
|
text-align: left;
|
||||||
|
|
||||||
font-size: 1.5rem;
|
font-size: 1.5rem;
|
||||||
@ -17,132 +17,197 @@
|
|||||||
|
|
||||||
color: #000;
|
color: #000;
|
||||||
background: #fff;
|
background: #fff;
|
||||||
}
|
}
|
||||||
|
|
||||||
nav, .navbar,
|
nav,
|
||||||
.container,
|
.navbar,
|
||||||
.body-wrap{
|
.container,
|
||||||
|
.body-wrap {
|
||||||
max-width: 70ch;
|
max-width: 70ch;
|
||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
h1, h2, h3, h4, h5, h6 {
|
h1,
|
||||||
|
h2,
|
||||||
|
h3,
|
||||||
|
h4,
|
||||||
|
h5,
|
||||||
|
h6 {
|
||||||
font-family: Helvetica, "Ubuntu Sans", "Noto Sans", Calibri, Arial, sans-serif;
|
font-family: Helvetica, "Ubuntu Sans", "Noto Sans", Calibri, Arial, sans-serif;
|
||||||
margin-top: 1em;
|
margin-top: 1em;
|
||||||
margin-bottom: 2rem;
|
margin-bottom: 2rem;
|
||||||
color: #333;
|
color: #333;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* 1. Use a more-intuitive box-sizing model */
|
/* 1. Use a more-intuitive box-sizing model */
|
||||||
|
|
||||||
* {
|
* {
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
|
|
||||||
&::before, &::after {
|
&::before,
|
||||||
|
&::after {
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
body {
|
body {
|
||||||
/* Improve text rendering */
|
/* Improve text rendering */
|
||||||
-webkit-font-smoothing: antialiased;
|
-webkit-font-smoothing: antialiased;
|
||||||
font-family: Helvetica, Arial, sans-serif;
|
font-family: Helvetica, Arial, sans-serif;
|
||||||
padding-bottom: 20vh;
|
padding-bottom: 20vh;
|
||||||
padding-left: 2rem;
|
|
||||||
padding-bottom: 2rem;
|
padding-bottom: 2rem;
|
||||||
}
|
// background: #222;
|
||||||
|
// color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
/* Improve media defaults */
|
/* Improve media defaults */
|
||||||
|
|
||||||
img, picture, video, canvas, svg {
|
img,
|
||||||
|
picture,
|
||||||
|
video,
|
||||||
|
canvas,
|
||||||
|
svg {
|
||||||
display: block;
|
display: block;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
margin-top: 1rem;
|
margin-top: 1rem;
|
||||||
margin-bottom: 1rem;
|
margin-bottom: 1rem;
|
||||||
max-width: 100%;
|
max-width: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Inherit fonts for form controls */
|
/* Inherit fonts for form controls */
|
||||||
|
|
||||||
input, button, textarea, select {
|
input,
|
||||||
|
button,
|
||||||
|
textarea,
|
||||||
|
select {
|
||||||
font: inherit;
|
font: inherit;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Avoid text overflows */
|
/* Avoid text overflows */
|
||||||
|
|
||||||
p, h1, h2, h3, h4, h5, h6 {
|
p,
|
||||||
|
h1,
|
||||||
|
h2,
|
||||||
|
h3,
|
||||||
|
h4,
|
||||||
|
h5,
|
||||||
|
h6 {
|
||||||
overflow-wrap: break-word;
|
overflow-wrap: break-word;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Improve line wrapping */
|
p {
|
||||||
|
|
||||||
p {
|
|
||||||
text-wrap: pretty;
|
text-wrap: pretty;
|
||||||
margin-top: 1.5rem;
|
margin-top: 1.5rem;
|
||||||
margin-bottom: 1rem;
|
margin-bottom: 1rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
h1 {
|
h1 {
|
||||||
font-size: 4rem;
|
font-size: 4rem;
|
||||||
color: #221d30;
|
color: #221d30;
|
||||||
}
|
}
|
||||||
|
|
||||||
h2 {
|
h2 {
|
||||||
font-size: 3rem;
|
font-size: 3rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
h3 {
|
h3 {
|
||||||
font-size: 1.5rem;
|
font-size: 1.5rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
h1, h2, h3, h4, h5, h6 {
|
h1,
|
||||||
|
h2,
|
||||||
|
h3,
|
||||||
|
h4,
|
||||||
|
h5,
|
||||||
|
h6 {
|
||||||
text-wrap: balance;
|
text-wrap: balance;
|
||||||
line-height: 1.3em;
|
line-height: 1.3em;
|
||||||
}
|
}
|
||||||
|
|
||||||
#root, #__next {
|
#root,
|
||||||
|
#__next {
|
||||||
isolation: isolate;
|
isolation: isolate;
|
||||||
}
|
}
|
||||||
|
|
||||||
input, button, textarea, select {
|
input,
|
||||||
|
button,
|
||||||
|
textarea,
|
||||||
|
select {
|
||||||
font: inherit;
|
font: inherit;
|
||||||
}
|
}
|
||||||
|
|
||||||
a{
|
ul {
|
||||||
display: inline-block;
|
|
||||||
padding: 0.5rem 2rem;
|
|
||||||
margin-right: 1rem;
|
|
||||||
margin-bottom: 1rem;
|
|
||||||
}
|
|
||||||
ul {
|
|
||||||
padding-left: 4ch;
|
padding-left: 4ch;
|
||||||
padding-right: 4ch;
|
padding-right: 4ch;
|
||||||
}
|
}
|
||||||
|
|
||||||
li {
|
li {
|
||||||
margin-bottom: 1em;
|
margin-bottom: 1em;
|
||||||
}
|
}
|
||||||
|
|
||||||
// balise crée par pandoc
|
// balise crée par pandoc
|
||||||
#title-block-header {
|
#title-block-header {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
.navbar-menu{
|
.navbar-menu {
|
||||||
img{
|
img {
|
||||||
|
|
||||||
width: 2rem;
|
width: 2rem;
|
||||||
height: 2rem;
|
height: 2rem;
|
||||||
margin-right: 1rem;
|
margin-right: 1rem;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.content{
|
#masthead {
|
||||||
min-height: 50rem;
|
text-align: center;
|
||||||
}
|
.site-icon {
|
||||||
@media (max-width: 20rem) {
|
width: 9rem;
|
||||||
body {
|
height: auto;
|
||||||
|
margin: 1rem auto;
|
||||||
|
position: static;
|
||||||
padding: 1rem;
|
padding: 1rem;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
.header-image{
|
||||||
|
padding: 1rem;
|
||||||
|
}
|
||||||
|
.blog-title,
|
||||||
|
.blog-subtitle {
|
||||||
|
margin: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.content {
|
||||||
|
min-height: 50rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.site-footer{
|
||||||
|
min-height: 20vh;
|
||||||
|
padding: 2rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
// ancres
|
||||||
|
a {
|
||||||
|
display: inline-block;
|
||||||
|
padding: 0.55rem 2rem;
|
||||||
|
margin-right: 1rem;
|
||||||
|
margin-bottom: 1rem;
|
||||||
|
border-radius: 1rem;
|
||||||
|
color: rgb(0, 123, 255);
|
||||||
|
text-decoration: none;
|
||||||
|
|
||||||
|
main &:hover {
|
||||||
|
background: #303030;
|
||||||
|
color: #dedede;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
@media (max-width: 75ch) {
|
||||||
|
body{
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
main {
|
||||||
|
padding: 1rem;
|
||||||
|
}
|
||||||
|
}
|
Loading…
Reference in New Issue
Block a user