update blog

content/apropos/index.md

@@ -0,0 +1,32 @@
++++
+template = "apropos.html"
+generate_feed = false
+path = "apropos"
+date = "2023-04-23"
+title = "D'où je parle"
++++
+
+Dans une vie, je suis monocycliste. Pourtant ce blog ne traitera pas (forcément de monocycle. Dans une autre vie, je suis informaticien, bricoleur
+à mes heures perdu. J'aime beaucoup détourner des objets de leur usage premier et bricoler de la petite électronique. Je m'inspire beaucoup des
+expériences des autres pour toutes sortes de projets. J'espère que celui-ci pourra de même vous inspirer.
+
+
+## À part ça
+
+Je suis aussi membre de  l'association [Picasoft](https://picasoft.net). Une __bande de potes__ association membre du collectif [Chatons](https://chatons.org) 
+qui a pour but de  sensibiliser aux enjeux du numérique et héberger des services libres. L'association possède d'ailleurs son propre [blog](https://blog.picasoft.net)
+qui héberge de très beau articles.
+
+{{ image(url="apropos/picasoft_logo.svg", description="le logo de picasoft") }}
+
+## Chatons encore
+
+Je suis aussi membre d'un autre Chatons : [paquerette](https://paquerette.eu). Ce Chatons propose des prestations sur mesure d'hébergement de services libres.
+
+## Du boulot encore
+
+Je fais aussi partie de l'entreprise [Librezo](https://librezo.fr) qui propose des prestations variées tant d'hébergement, 
+de développement que d'accompagnement aux outils libres. L'accent ici est plus tourné autour de la pratique de [l'autohébergement](???) de ses clients.
+
+{{ image(url="apropos/librezo_logo.svg", description="le logo de librezo") }}
+

content/blog/fifth.md

@@ -1,18 +1,14 @@
 +++
-title = "My third post"
+title = "My fifth post"
 date = 2012-11-28
 [taxonomies]
-Tag = [
-    "Rust",
-    "cirque"
-]
 Dossier = [
     "Rust"
     ]
 [extra]
 image="/img/lantern.png"
 +++
-This is my third blog post.
+This is my fifth blog post.
 <!-- more -->
 et c'est encore bon !
 

content/blog/lumiere_velo.md

@@ -0,0 +1,18 @@
++++
+title = "Des lumière de vélo sur mesure"
+date = 2023-02-15
+[taxonomies]
+Tag = [
+    "DIY",
+    "Lumière"
+]
+[extra]
+image = "cover.jpg"
+subtitle = ""
++++
+
+
+
+J'aime bricoler de l'électronique. Et j'aime particulièrement bricoler des lumières. Surement parce que c'est assez simple, consomme peu d'énergie ajourd'hui et vite gratifiant.
+Toujours est-il que 
+<!-- more -->

content/blog_amis/_index.md

@@ -0,0 +1,7 @@
++++
+title = "List of notes posts"
+sort_by = "date"
+template = "blog-amis.html"
+page_template = "note-page.html"
+
++++

content/blog_amis/chosto.md

@@ -0,0 +1,10 @@
++++
+title = "Blog de Chosto"
+date = 2019-11-28
+
+[extra]
+short_title="Chosto"
+url="https://blog.chosto.me"
++++
+Un amis informaticien qui parle de capitalisme de surveillance, de ses rando et qui écrit quelques textes.
+<!-- more -->

content/blog_amis/deuxfleurs.md

@@ -0,0 +1,10 @@
++++
+title = "Blog de Deux fleurs"
+date = 2019-11-28
+
+[extra]
+short_title="Deuxfleurs"
+url="https://plume.deuxfleurs.fr"
++++
+Un chatons qui crée des outils numériques résilient fasse à un internet lent et instable.
+<!-- more -->

content/static/apropos.md

@@ -1,30 +0,0 @@
-+++
-template = "apropos.html"
-generate_feed = false
-path = "apropos"
-title = "D'où je parle"
-+++
-
-
-## Pourquoi ce blog
-
-Convaincu par la philosophie des logiciels libres, je souhaite autant que possible parTager mes expériences.
-Ce blog à pour vocation d'y contribuer en parlant d'un peu de tout et surtout du n'importe quoi. Ce blog comporte 
-une section **sites amis** parce que j'aime pouvoir naviguer sur internet sans utiliser un moteur de recherche.
-
-## D'autres projet 
-
-Sinon, je suis membre de de l'association [Picasoft](https://picasoft.net) où je participe à sensibiliser aux enjeux du numérique 
-et à héberger des services libres.
-
-{{ image(url="picasoft_logo.svg", description="le logo de picasoft") }}
-
-
-
-## Coté boulot
-
-Je fais partie le l'entreprise [Librezo](https://librezo.fr) qui propose des prestations variées tant d'hébergement, 
-de développement que d'accompagnement aux outils libres.
-
-{{ image(url="content/static/librezo_logo.svg", description="le logo de librezo") }}
-

sass/blog.scss

@@ -1,4 +1,9 @@
 @charset "utf-8";
+
+@import url('fonts/Nunito-Regular.woff2');
+
+$family-sans-serif: "Nunito", sans-serif;
+
 @import "../bulma/bulma.sass";
 @import "../bulma/sass/utilities/_all.sass";
 @import "../bulma/sass/base/_all.sass";
@@ -8,14 +13,11 @@
 @import "../bulma/sass/elements/_all.sass";
 @import "../bulma/sass/grid/columns.sass";
 @import "../bulma/sass/layout/footer.sass";
-
-
 @import "./fontawesome/scss/fontawesome.scss";
 @import "./fontawesome/scss/solid.scss";
 @import "./fontawesome/scss/brands.scss";
 
 
-
 .bulma-overlay-mixin {
   @include overlay(1.5rem);
   background-color: darkorange;

static/custom.css

@@ -100,3 +100,5 @@ box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
   color: #3850b7;
   }  
 }
+
+

templates/apropos.html

@@ -5,5 +5,24 @@
     <h1 class="title is-1">{{page.title}}</h1>
     <div class="content">
     {{page.content | safe}}
+
+<h2> Des amis </h2 >
+
+    D'autres amis propose du contenus que j'apprécie énormément. Une liste non exaustive ci-dessous.
+</div>
+    
+    {% set friend_sites = get_section(path="blog_amis/_index.md") %}
+{% for page in friend_sites.pages %}
+<article class="media note p-4" >
+  <a href="{{ page.extra.url }}" class="" style="width: 100%">
+  <div class="media-content media-flex" style="overflow-y: clip;">
+          <h2 class="title is-2">{{ page.title }}</h2>
+          <div class="content has-text-justified">
+              {{ page.summary | markdown | safe }}
+          </div>
+        </div>
+        </a>
+        </article>
+{% endfor %}
     </div>
 {% endblock content %}

templates/base.html

@@ -58,11 +58,12 @@
         </a>
 
         <div class="navbar-dropdown">
-         {% for site in config.extra.friend_sites %}
-          <a class="navbar-item" href="{{ site.url }}">
-            {{ site.name }}
+        {% set friend_sites = get_section(path="blog_amis/_index.md") %}
+        {% for page in friend_sites.pages %}
+          <a class="navbar-item" href="{{ page.extra.url }}">
+            {{ page.extra.short_title }}
           </a>
-          {% endfor %}
+        {% endfor %}
         </div>
       </div>
             <a class="navbar-item" href="https://yuno.oiseauroch.fr/gitea">
@@ -81,6 +82,9 @@
     <div>
     <div style="margin: 100px"></div>
 
+    {% block header %}
+    {% endblock %}
+    
     <div class="container mt-6">    
       {% block content %} 
       {% endblock %}

templates/blog-amis.html

@@ -0,0 +1,19 @@
+{% extends "base.html" %}
+{% import 'macros/card.html' as macro_card -%}
+
+{% block content %}
+    {% for page in section.pages %}
+<article class="media note p-4" >
+  <a href="{{ page.extra.url }}" class="" style="width: 100%">
+  <div class="media-content media-flex" style="overflow-y: clip;">
+          <h2 class="title is-2">{{ page.title }}</h2>
+          <div class="content has-text-justified">
+              {{ page.summary | markdown | safe }}
+          </div>
+        </div>
+        </a>
+        </article>
+{% endfor %}
+    </div>
+    
+{% endblock content %}

templates/blog-list.html

@@ -4,7 +4,13 @@
 {% block content %}
     <div class="columns is-multiline mt-6">
     {% for page in paginator.pages %}
+    <div class="column is-one-third">
+    {% if page.taxonomies.Tag %}
         {{ macro_card::create_card(link=page.permalink, img=page.extra.image, title=page.title, subtitle="la génèse", abstract=page.summary, tags=page.taxonomies.Tag, date=page.date) }}
+    {% else %}
+      {{ macro_card::create_card(link=page.permalink, img=page.extra.image, title=page.title, subtitle="la génèse", abstract=page.summary, tags="", date=page.date) }}
+    {% endif %}
+    </div>
     {% endfor %}
     </div>
     

templates/blog-page.html

@@ -1,13 +1,76 @@
 {% extends "base.html" %}
 
+ {% block header %}
+ 
+ {{ __tera_context }}
+ 
+<header>
+  <section class='hero has-text-centered is-large is-info has-bg-img'>
+      <div class="hero-head mx-5">
+        <div class="level mt-4">
+          <div class="level-left">
+            
+            <p class="level-item subtitle is-size-5-desktop is-size-7-mobile">
+              Image d'illustration Clint__Budd - CC BY 2.0
+            </p>
+            
+          </div>
+          <div class="level-right mt-3 is-hidden-touch">
+            <div class="level-item">
+              
+              <div class="tags colums is-vcentered">
+              
+                <span class="tag is-info is-light is-large mr-4"><a href="https://blog.chosto.me/%20categories/fiction">Fiction</a></span>
+                
+                <span class="tag is-info is-light is-large mr-4"><a href="https://blog.chosto.me/%20categories/num%C3%A9rique">Numérique</a></span>
+                
+              </div>
+              
+            </div>
+        </div>
+
+      </div>
+      <div class="hero-body  container has-text-centered">
+        <p class="title is-size-1-desktop is-size-3-mobile is-uppercase">Imaginer un numérique souhaitable</p>
+        
+      </div>
+      
+      
+      <div class="hero-foot mb-5 mx-5 content">
+        <div class="level">
+          <div class="level-left">
+            <div class="level-item has-text-left">
+              <time datetime="2023-01-20T00:00:00Z">
+                <p class="mb-2 subtitle is-size-5-desktop is-size-7-mobile">📅&nbsp;&nbsp;Article publié le <strong>20 janvier 2023</strong></p>
+              </time>
+            </div>
+          </div>
+          <div class="level-right">
+            <div class="level-item has-text-right">
+              <div>
+                <p class="mb-2 subtitle is-size-5-desktop is-size-7-mobile">🕑&nbsp;&nbsp;Environ <strong>13 minutes</strong> de lecture
+                </p>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+      
+    </div>
+  </section>
+</header>
+{% endblock %}
+
 {% block content %}
-
-{{ __tera_context }}
-
+<section class="hero has-text-centered is-large is-info">
 <h1 class="title is-1">
   {{ page.title }}
 </h1>
+<h2 class="title is-2">
+La génèse
+</h2>
 <p class="subtitle"><strong>{{ page.date }}</strong></p>
+</section>
 <div class="content">
 {{ page.content | safe }}
 </div>

templates/index.html

@@ -8,9 +8,17 @@
   <div class="columns is-multiline mt-6">
   {% set blog = get_section(path="blog/_index.md") %}
     {% for page in blog.pages %}
-         {% if loop.index0 == 3 %}{% break %}{% endif %}
+            <div class="column is-one-third">
+         {% if loop.index0 == 3 %}
+              </div>
+              {% break %}
+          {% endif %}
+    {% if page.taxonomies.Tag %}
         {{ macro_card::create_card(link=page.permalink, img=page.extra.image, title=page.title, subtitle="la génèse", abstract=page.summary, tags=page.taxonomies.Tag, date=page.date) }}
-                    
+    {% else %}
+      {{ macro_card::create_card(link=page.permalink, img=page.extra.image, title=page.title, subtitle="la génèse", abstract=page.summary, tags="", date=page.date) }}
+    {% endif %}
+        </div>
     {% endfor %}
     
     <a class="plus-articles button is-link is-light is-medium has-text-weight-bold" href="{{ blog.permalink }}">
@@ -29,8 +37,12 @@
     {% for page in notes.pages %}
     <div class="column  is-one-fifth ">
          {% if loop.index0 == 5 %}{% break %}{% endif %}
-        {{ macro_media::create_media(link=page.permalink, img=page.extra.image, title=page.title, subtitle="la génèse", abstract=page.summary, tags=page.taxonomies.Tag, date=page.date) }}
-    </div>
+        {% if page.taxonomies.Tag %}
+            {{ macro_card::create_card_note(link=page.permalink, img=page.extra.image, title=page.title, subtitle="la génèse", abstract=page.summary, tags=page.taxonomies.Tag, date=page.date) }}
+        {% else %}
+          {{ macro_card::create_card_note(link=page.permalink, img=page.extra.image, title=page.title, subtitle="la génèse", abstract=page.summary, tags="", date=page.date) }}
+        {% endif %}
+        </div>
     {% endfor %}
      {% set notes = get_section(path="notes/_index.md") %}
     <a class="overlay has-text-weight-bold" href="{{ notes.permalink }} ">

templates/macros/card.html

@@ -1,5 +1,4 @@
 {% macro create_card(link, img, title, subtitle, abstract, tags, date) %}
-        <div class="column is-one-third">
             <div class="card has-equal-height">
             <a href="{{ link | safe }}"  style="height:100%">
                 <div class="card-content" style="height:100%">
@@ -7,25 +6,23 @@
                         <div class="title is-5 has-text-centered">{{ subtitle }}</div>
                     <div class="media">
                         <div class="content" style="width:100%;">
-                            <hr/>
+                            <hr class="mt-1"/>
                             {{ abstract | markdown | safe }}
                         </div>
                     </div>
                 </div>
                 </a>
-                <footer class="card-footer">
+                <footer class="mt-5 card">
                     <div  class="card-footer-item">
                     {% for tag in tags %}
                         <a class="button is-small is-info is-light is-rounded mx-1" href="{{ get_url(path="tags/")  }}/{{ tag }}"> {{ tag }}</a>
                       {% endfor %}
                     </div>
                     <div class="card-footer-item">
-                        {{ date }}
+                        {{ date | date(format="%d %B %Y", locale="fr_FR") }}
                     </div>
                 </footer>
             </div>
-        </div>
-
         
 {% endmacro %}
 
@@ -42,3 +39,31 @@
 
         
 {% endmacro %}
+
+{% macro create_card_note(link, img, title, subtitle, abstract, tags, date) %}
+            <div class="card has-equal-height">
+            <a href="{{ link | safe }}"  style="height:100%">
+                <div class="card-content" style="height:100%">
+                        <div class="title is-5 has-text-centered">{{ title }}</div>
+                        <div class="subtitle has-text-centered">{{ subtitle }}</div>
+                    <div class="media">
+                        <div class="content" style="width:100%;">
+                            <hr class="mt-1"/>
+                            {{ abstract | markdown | safe }}
+                        </div>
+                    </div>
+                </div>
+                </a>
+                <footer class="mt-1 card-footer">
+                    <div  class="card-footer-item">
+                    {% for tag in tags %}
+                        <a class="button is-small is-info is-light is-rounded mx-1" href="{{ get_url(path="tags/")  }}/{{ tag }}"> {{ tag }}</a>
+                      {% endfor %}
+                    </div>
+                    <div class="card-footer-item">
+                        {{ date | date(format="%d %b", locale="fr_FR") }}
+                    </div>
+                </footer>
+            </div>
+        
+{% endmacro %}

templates/shortcodes/alert.html

@@ -0,0 +1,3 @@
+<alert class="alert">
+    <img src="{{ get_url(path=url) }}" alt="{{ description }}"/>
+</alert>

templates/taxonomy_list.html

@@ -11,9 +11,16 @@
             <i class="computer fas fa-chevron-right mx-2" ></i>
     </a>
     {% for page in taxo.pages %}
-         {% if loop.index0 == 3 %}{% break %}{% endif %}
+         {% if loop.index0 == 3 %}
+            {% break %}
+         {% endif %}
+    <div class="column is-one-third">
+    {% if page.taxonomies.Tag %}
         {{ macro_card::create_card(link=page.permalink, img=page.extra.image, title=page.title, subtitle="la génèse", abstract=page.summary, tags=page.taxonomies.Tag, date=page.date) }}
-                    
+    {% else %}
+      {{ macro_card::create_card(link=page.permalink, img=page.extra.image, title=page.title, subtitle="la génèse", abstract=page.summary, tags="", date=page.date) }}
+    {% endif %}
+    </div>                    
     {% endfor %}
     </div>
     {% endfor %} 

templates/taxonomy_single.html

@@ -7,7 +7,13 @@
            {{ term.name }}
     </div>
     {% for page in paginator.pages %}
-        {{ macro_card::create_card(link=page.permalink, img=page.extra.image, title=page.title, subtitle="la génèse", abstract=page.summary, tags=page.taxonomies.Tag, date=page.date) }}
+        <div class="column is-one-third">
+        {% if page.taxonomies.Tag %}
+            {{ macro_card::create_card(link=page.permalink, img=page.extra.image, title=page.title, subtitle="la génèse", abstract=page.summary, tags=page.taxonomies.Tag, date=page.date) }}
+        {% else %}
+            {{ macro_card::create_card(link=page.permalink, img=page.extra.image, title=page.title, subtitle="la génèse", abstract=page.summary, tags="", date=page.date) }}
+        {% endif %}
+        </div>
     {% endfor %}
     </div>