1 month ago · f281f2817e
--- a/david/2024/03/03/index.html
+++ b/david/2024/03/03/index.html
@@ -152,6 +152,10 @@
         title="Aller à la page de recherche"
         rel="search" data-no-instant>Recherche</a>
      
        • <a rel="next"
            href="/david/2024/03/04/"
            title="Publication suivante : Jour&nbsp;1">Suivant →</a>
      
    </p>
  </nav>
  
@@ -290,6 +294,10 @@
      
      <a href="/david/2024/" title="Liste des publications récentes">↑ En 2024</a>
      
        • <a rel="next"
            href="/david/2024/03/04/"
            title="Publication suivante : Jour&nbsp;1">Suivant →</a>
      
    </p>
  </nav>

--- a/david/2024/03/04/index.html
+++ b/david/2024/03/04/index.html
@@ -0,0 +1,378 @@
 <!DOCTYPE html><!-- This is a valid HTML5 document. -->
 <!-- Screen readers, SEO, extensions and so on. -->
 <html lang="fr">
  <!-- Has to be within the first 1024 bytes, hence before the `title` element
  See: https://www.w3.org/TR/2012/CR-html5-20121217/document-metadata.html#charset -->
  <meta charset="utf-8">
  <!-- Why no `X-UA-Compatible` meta: https://stackoverflow.com/a/6771584 -->
  <!-- The viewport meta is quite crowded and we are responsible for that.
  See: https://codepen.io/tigt/post/meta-viewport-for-2015 -->
  <meta name="viewport" content="width=device-width,initial-scale=1">
  <!-- Required to make a valid HTML5 document. -->
  <title>
    Jour&nbsp;1
  — David Larlet</title>
  <script>
    function toggleTheme(themeName) {
      document.documentElement.classList.toggle(
        'forced-dark',
        themeName === 'dark'
      )
      document.documentElement.classList.toggle(
        'forced-light',
        themeName === 'light'
      )
    }
    const selectedTheme = localStorage.getItem('theme')
    if (selectedTheme !== 'undefined') {
      toggleTheme(selectedTheme)
    }
  </script>
  <!-- Documented, feel free to shoot an email. -->
  <link rel="stylesheet" href="/static/david/css/style_2024-02-03.css">
  <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. -->
  <link rel="preload"
        href="/static/david/css/fonts/century_supra_ot_a_regular.woff2"
        as="font"
        type="font/woff2"
        media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)"
        crossorigin>
  <link rel="preload"
        href="/static/david/css/fonts/century_supra_ot_a_bold.woff2"
        as="font"
        type="font/woff2"
        media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)"
        crossorigin>
  <link rel="preload"
        href="/static/david/css/fonts/century_supra_ot_a_italic.woff2"
        as="font"
        type="font/woff2"
        media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)"
        crossorigin>
  <link rel="preload"
        href="/static/david/css/fonts/century_supra_ot_b_regular.woff2"
        as="font"
        type="font/woff2"
        media="(prefers-color-scheme: dark)"
        crossorigin>
  <link rel="preload"
        href="/static/david/css/fonts/century_supra_ot_b_bold.woff2"
        as="font"
        type="font/woff2"
        media="(prefers-color-scheme: dark)"
        crossorigin>
  <link rel="preload"
        href="/static/david/css/fonts/century_supra_ot_b_italic.woff2"
        as="font"
        type="font/woff2"
        media="(prefers-color-scheme: dark)"
        crossorigin>
  <meta name="description" content="Une réservation de longue date qui s’est transformée en sortie familiale (!), malheureusement nous n’avons pas pu rejoindre le refuge à ski faute de neige suffisante. C’était problématique car j’avais prévu de traîner une bonne partie de l’équipement, ce qui se révélait être un peu plus lourd sur le dos. Bon, aussi, on était partis sur une raclette, ça n’aide pas 😅.">
  <!-- That good ol' feed, subscribe :). -->
  <link rel="alternate"
        type="application/atom+xml"
        title="Feed"
        href="/david/log/">
  <!-- Generated from https://realfavicongenerator.net/ such a mess. -->
  <link rel="apple-touch-icon"
        sizes="180x180"
        href="/static/david/icons2/apple-touch-icon.png">
  <link rel="icon"
        type="image/png"
        sizes="32x32"
        href="/static/david/icons2/favicon-32x32.png">
  <link rel="icon"
        type="image/png"
        sizes="16x16"
        href="/static/david/icons2/favicon-16x16.png">
  <link rel="manifest" href="/static/david/icons2/site.webmanifest">
  <link rel="mask-icon"
        href="/static/david/icons2/safari-pinned-tab.svg"
        color="#07486c">
  <link rel="shortcut icon" href="/static/david/icons2/favicon.ico">
  <meta name="msapplication-TileColor" content="#f7f7f7">
  <meta name="msapplication-config"
        content="/static/david/icons2/browserconfig.xml">
  <meta name="theme-color"
        content="#f7f7f7"
        media="(prefers-color-scheme: light)">
  <meta name="theme-color"
        content="#272727"
        media="(prefers-color-scheme: dark)">
  <!-- Is that even respected? Retrospectively? What a shAItshow…
  https://neil-clarke.com/block-the-bots-that-feed-ai-models-by-scraping-your-website/ -->
  <meta name="robots" content="noai, noimageai">
  
 <style type="text/css">
  .tippy-content {
    min-width: 280px;
    padding: .5rem;
    font-size: calc(var(--fluid-0) * 0.8);
    font-family: var(--labor-font);
    letter-spacing: initial;
    text-align: left;
  }
  .tippy-content h3 {
    margin-top: 0;
  }
  .tippy-content h3 img {
    max-width: 2rem;
    max-height: 2rem;
    display: inline-block;
  }
  .tippy-content .tippy-links {
    display: flex;
    justify-content: space-around;
  }
  .tippy-content a {
    padding: .4rem;
    color: #F06048;
  }
 </style>

  <body data-instant-intensity="viewport-all">
    <article>
      
  <header>
    <hgroup>
      <h1>Jour&nbsp;1</h1>
      <p>Le <time datetime="2024-03-04">4 mars 2024</time></p>
    </hgroup>
  </header>
  <nav>
    <p>
      
        <a rel="prev"
           href="/david/2024/03/03/"
           title="Publication précédente : Permanence">← Précédent</a> •
      
      <a href="/david/" title="Aller à l’accueil" rel="up">Accueil</a>
      •
      <a href="/david/recherche/"
         title="Aller à la page de recherche"
         rel="search" data-no-instant>Recherche</a>
      
        • <a rel="next"
            href="/david/2024/03/05/"
            title="Publication suivante : Jour&nbsp;2">Suivant →</a>
      
    </p>
  </nav>
  
 <p>Une réservation de longue date qui s’est transformée en sortie familiale (!), malheureusement nous n’avons pas pu rejoindre le refuge à ski faute de neige suffisante. C’était problématique car j’avais prévu de traîner une bonne partie de l’équipement, ce qui se révélait être un peu plus lourd sur le dos. Bon, aussi, on était partis sur une raclette, ça n’aide&nbsp;pas&nbsp;😅.</p>
 <p>J’avais très peur que le sentier soit peu praticable sans percer à chaque pas, ce qui m’était déjà arrivé dans un tel contexte. Vu le poids du sac, je craignais notamment que ma cheville en cours de réparation refasse le même mouvement en descente… mais nous étions à une poignée de degrés de cet état de la neige pour notre plus grand&nbsp;bonheur.</p>
 <p>Ce n’était pas non plus de tout repos et la récompense d’une lac dégelant à l’arrivée était bien méritée. Il est rare d’avoir ces conditions très douces dans un contexte hivernal, on en avait même oublié de prendre nos&nbsp;tuques&#8239;!</p>
 <p><em>Tests du jour&nbsp;: les barquettes en aluminium pour faire réflecteur de bougies. Efficace. Les bougies longues durées d’Ikea pour faire fondre du fromage. Pas&nbsp;efficace.</em></p>
 <figure>
    <a href="/static/david/2024/2024-03-04-lac-corbeau.jpg"
        title="Cliquer pour une version haute résolution">
        <img
            src="/static/david/2024/2024-03-04-lac-corbeau.jpg"
            width="3024" height="4032"
            srcset="/static/david/2024/2024-03-04-lac-corbeau.jpg 3024w, /static/david/2024/2024-03-04-lac-corbeau_660x440.jpg 660w, /static/david/2024/2024-03-04-lac-corbeau_990x660.jpg 990w, /static/david/2024/2024-03-04-lac-corbeau_1320x880.jpg 1320w"
            sizes="min(100vw, calc(100vh * 3024 / 4032))"
            loading="lazy"
            decoding="async"
            alt="Lac corbeau avec des boulots au premier plan.">
    </a>
    <figcaption>Un décor très minecrafteux&nbsp;(sic).</figcaption>
 </figure>

  
    <nav>
      <p>
        
          <a href="/david/2024/dystopie/"
             title="Liste de tous les articles 2024 associés à cette étiquette"
             rel="tag">#dystopie</a>
        
          <a href="/david/2024/foret/"
             title="Liste de tous les articles 2024 associés à cette étiquette"
             rel="tag">#forêt</a>
        
          <a href="/david/2024/solastalgia/"
             title="Liste de tous les articles 2024 associés à cette étiquette"
             rel="tag">#solastalgia</a>
        
        <a href="/david/2024/#tags" title="Liste de toutes les étiquettes 2024">tous ?</a>
      </p>
    </nav>
  
  <nav>
    <p>
      
        <a rel="prev"
           href="/david/2024/03/03/"
           title="Publication précédente : Permanence">← Précédent</a> •
      
      <a href="/david/2024/" title="Liste des publications récentes">↑ En 2024</a>
      
        • <a rel="next"
            href="/david/2024/03/05/"
            title="Publication suivante : Jour&nbsp;2">Suivant →</a>
      
    </p>
  </nav>

      
        <form action="/david/recherche/" method="get">
          <fieldset>
            <legend>Recherche</legend>
            <label for="input-search">Termes de votre recherche :</label>
            <input id="input-search" type="search" name="s" aria-describedby="indexation-infos" required>
            <input type="submit" value="Chercher">
            <p id="indexation-infos">
              <small>
                Seuls les contenus de ces 8 dernières années sont indexés.
              </small>
            </p>
          </fieldset>
        </form>
      
      <aside>
        <theme-toggle></theme-toggle>
      </aside>
    </article>
    <hr>
    <footer>
      <p>
        <a href="/david/" title="Aller à l’accueil">Accueil</a>
        •
        <a href="/david/log/" title="Accès au flux RSS">Suivre</a>
        •
        <a href="http://larlet.com"
           title="Go to my English profile"
           data-instant>Pro</a>
        •
        <a href="mailto:david%40larlet.fr" title="Envoyer un courriel">Email</a>
        •
        <abbr title="Hébergeur : Alwaysdata, 62 rue Tiquetonne 75002 Paris, +33184162340">Légal</abbr>
      </p>
      <template id="theme-selector">
        <form>
          <style type="text/css">
            fieldset div {
              text-align: center;
            }
          </style>
          <fieldset>
            <legend>Thème</legend>
            <div>
              <label>
                <input type="radio" value="auto" name="chosen-color-scheme" checked>
                Auto
              </label>
              <label>
                <input type="radio" value="dark" name="chosen-color-scheme">
                Foncé
              </label>
              <label>
                <input type="radio" value="light" name="chosen-color-scheme">
                Clair
              </label>
            </div>
          </fieldset>
        </form>
      </template>
    </footer>
    <script src="/static/david/js/instantpage-5.1.0.min.js" type="module"></script>
    <script>
      class ThemeToggle extends HTMLElement {
        constructor() {
          super()
          const themeSelectorTemplate = document.querySelector('#theme-selector')
          const form = themeSelectorTemplate.content.firstElementChild
          this.attachShadow({ mode: 'open' })
          this.shadowRoot.appendChild(form.cloneNode(true))
        }

        connectedCallback() {
          const form = this.shadowRoot.querySelector('form')
          form.addEventListener('change', (e) => {
            const chosenColorScheme = e.target.value
            localStorage.setItem('theme', chosenColorScheme)
            toggleTheme(chosenColorScheme)
          })

          const selectedTheme = localStorage.getItem('theme')
          if (selectedTheme && selectedTheme !== 'undefined') {
            form.querySelector(`[value="${selectedTheme}"]`).checked = true
          }
        }
      }

      const prefersColorSchemeDark = '(prefers-color-scheme: dark)'
      window.addEventListener('load', () => {
        let colorsLayer = undefined
        let hasDarkRules = false
        for (const styleSheet of Array.from(document.styleSheets)) {
          let mediaRules = []
          for (const layerRule of styleSheet.cssRules) {
            if (!(layerRule instanceof CSSLayerBlockRule)) {
              continue
            }
            if (layerRule.name === 'colors') {
              colorsLayer = layerRule
            }
            for (const cssRule of layerRule.cssRules) {
              if (cssRule.type !== CSSRule.MEDIA_RULE) {
                continue
              }
              // WARNING: Safari does not have/supports `conditionText`.
              if (cssRule.conditionText) {
                if (cssRule.conditionText !== prefersColorSchemeDark) {
                  continue
                }
              } else {
                if (cssRule.cssText.startsWith(prefersColorSchemeDark)) {
                  continue
                }
              }
              mediaRules = mediaRules.concat(Array.from(cssRule.cssRules))
            }
          }

          // WARNING: do not try to insert a Rule to a styleSheet you are
          // currently iterating on, otherwise the browser will be stuck
          // in a infinite loop…
          for (const mediaRule of mediaRules) {
            // Safari requires the `0` second parameter (even if default).
            colorsLayer.insertRule(mediaRule.cssText, 0)
            hasDarkRules = true
          }
        }

        if (hasDarkRules) {
          if ('customElements' in window && !customElements.get('theme-toggle')) {
            customElements.define('theme-toggle', ThemeToggle)
          }
        }
      })
    </script>
    
  <script src="/static/david/js/popper-2.11.8.min.js"></script>
  <script src="/static/david/js/tippy-bundle-6.3.7.umd.min.js"></script>
  <script>
    tippy('[data-tippy]', {
      content(reference) {
        reference.addEventListener('click', (e) => e.preventDefault())
        return `
        <h3 lang="fr">
          <img src="${reference.dataset.favicon}" loading="lazy">
          <a href="${reference.dataset.source}"
            >Article sur ${reference.dataset.domain}</a></h3>
        <p lang="${reference.hreflang}"><em>${reference.dataset.description}</em></p>
        <div class="tippy-links" lang="fr">
          <a href="${reference.href}">Archive au ${reference.dataset.date}</a>
        </div>
        `
      },
      allowHTML: true,
      interactive: true,
      delay: [150, 700],
      hideOnClick: false
    })
  </script>

  </body>
 </html>
--- a/david/2024/03/05/index.html
+++ b/david/2024/03/05/index.html
@@ -0,0 +1,393 @@
 <!DOCTYPE html><!-- This is a valid HTML5 document. -->
 <!-- Screen readers, SEO, extensions and so on. -->
 <html lang="fr">
  <!-- Has to be within the first 1024 bytes, hence before the `title` element
  See: https://www.w3.org/TR/2012/CR-html5-20121217/document-metadata.html#charset -->
  <meta charset="utf-8">
  <!-- Why no `X-UA-Compatible` meta: https://stackoverflow.com/a/6771584 -->
  <!-- The viewport meta is quite crowded and we are responsible for that.
  See: https://codepen.io/tigt/post/meta-viewport-for-2015 -->
  <meta name="viewport" content="width=device-width,initial-scale=1">
  <!-- Required to make a valid HTML5 document. -->
  <title>
    Jour&nbsp;2
  — David Larlet</title>
  <script>
    function toggleTheme(themeName) {
      document.documentElement.classList.toggle(
        'forced-dark',
        themeName === 'dark'
      )
      document.documentElement.classList.toggle(
        'forced-light',
        themeName === 'light'
      )
    }
    const selectedTheme = localStorage.getItem('theme')
    if (selectedTheme !== 'undefined') {
      toggleTheme(selectedTheme)
    }
  </script>
  <!-- Documented, feel free to shoot an email. -->
  <link rel="stylesheet" href="/static/david/css/style_2024-02-03.css">
  <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. -->
  <link rel="preload"
        href="/static/david/css/fonts/century_supra_ot_a_regular.woff2"
        as="font"
        type="font/woff2"
        media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)"
        crossorigin>
  <link rel="preload"
        href="/static/david/css/fonts/century_supra_ot_a_bold.woff2"
        as="font"
        type="font/woff2"
        media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)"
        crossorigin>
  <link rel="preload"
        href="/static/david/css/fonts/century_supra_ot_a_italic.woff2"
        as="font"
        type="font/woff2"
        media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)"
        crossorigin>
  <link rel="preload"
        href="/static/david/css/fonts/century_supra_ot_b_regular.woff2"
        as="font"
        type="font/woff2"
        media="(prefers-color-scheme: dark)"
        crossorigin>
  <link rel="preload"
        href="/static/david/css/fonts/century_supra_ot_b_bold.woff2"
        as="font"
        type="font/woff2"
        media="(prefers-color-scheme: dark)"
        crossorigin>
  <link rel="preload"
        href="/static/david/css/fonts/century_supra_ot_b_italic.woff2"
        as="font"
        type="font/woff2"
        media="(prefers-color-scheme: dark)"
        crossorigin>
  <meta name="description" content="On se réveille dans la brume avec le soleil peinant à passer à travers, le lac et la neige ont regelé pendant la nuit. C’est une belle ambiance après une nuit agitée par la chaleur du sauna refuge. Les poêles tirent à fond dans ces endroits pour éviter que des personnes n’arrivent pas à faire démarrer un feu (j’imagine que ça peut être critique) mais ça les rend très inefficaces dans la durée et très chauds dès qu’on met deux buches dedans.">
  <!-- That good ol' feed, subscribe :). -->
  <link rel="alternate"
        type="application/atom+xml"
        title="Feed"
        href="/david/log/">
  <!-- Generated from https://realfavicongenerator.net/ such a mess. -->
  <link rel="apple-touch-icon"
        sizes="180x180"
        href="/static/david/icons2/apple-touch-icon.png">
  <link rel="icon"
        type="image/png"
        sizes="32x32"
        href="/static/david/icons2/favicon-32x32.png">
  <link rel="icon"
        type="image/png"
        sizes="16x16"
        href="/static/david/icons2/favicon-16x16.png">
  <link rel="manifest" href="/static/david/icons2/site.webmanifest">
  <link rel="mask-icon"
        href="/static/david/icons2/safari-pinned-tab.svg"
        color="#07486c">
  <link rel="shortcut icon" href="/static/david/icons2/favicon.ico">
  <meta name="msapplication-TileColor" content="#f7f7f7">
  <meta name="msapplication-config"
        content="/static/david/icons2/browserconfig.xml">
  <meta name="theme-color"
        content="#f7f7f7"
        media="(prefers-color-scheme: light)">
  <meta name="theme-color"
        content="#272727"
        media="(prefers-color-scheme: dark)">
  <!-- Is that even respected? Retrospectively? What a shAItshow…
  https://neil-clarke.com/block-the-bots-that-feed-ai-models-by-scraping-your-website/ -->
  <meta name="robots" content="noai, noimageai">
  
 <style type="text/css">
  .tippy-content {
    min-width: 280px;
    padding: .5rem;
    font-size: calc(var(--fluid-0) * 0.8);
    font-family: var(--labor-font);
    letter-spacing: initial;
    text-align: left;
  }
  .tippy-content h3 {
    margin-top: 0;
  }
  .tippy-content h3 img {
    max-width: 2rem;
    max-height: 2rem;
    display: inline-block;
  }
  .tippy-content .tippy-links {
    display: flex;
    justify-content: space-around;
  }
  .tippy-content a {
    padding: .4rem;
    color: #F06048;
  }
 </style>

  <body data-instant-intensity="viewport-all">
    <article>
      
  <header>
    <hgroup>
      <h1>Jour&nbsp;2</h1>
      <p>Le <time datetime="2024-03-05">5 mars 2024</time></p>
    </hgroup>
  </header>
  <nav>
    <p>
      
        <a rel="prev"
           href="/david/2024/03/04/"
           title="Publication précédente : Jour&nbsp;1">← Précédent</a> •
      
      <a href="/david/" title="Aller à l’accueil" rel="up">Accueil</a>
      •
      <a href="/david/recherche/"
         title="Aller à la page de recherche"
         rel="search" data-no-instant>Recherche</a>
      
        • <a rel="next"
            href="/david/2024/03/06/"
            title="Publication suivante : Vannerie">Suivant →</a>
      
    </p>
  </nav>
  
 <p>On se réveille dans la brume avec le soleil peinant à passer à travers, le lac et la neige ont regelé pendant la nuit. C’est une belle ambiance après une nuit agitée par la chaleur du <del>sauna</del> refuge. Les poêles tirent à fond dans ces endroits pour éviter que des personnes n’arrivent pas à faire démarrer un feu (j’imagine que ça peut être critique) mais ça les rend très inefficaces dans la durée et très chauds dès qu’on met deux buches&nbsp;dedans.</p>
 <figure>
    <a href="/static/david/2024/2024-03-05-lac-corbeau.jpg"
        title="Cliquer pour une version haute résolution">
        <img
            src="/static/david/2024/2024-03-05-lac-corbeau.jpg"
            width="4032" height="3024"
            srcset="/static/david/2024/2024-03-05-lac-corbeau.jpg 4032w, /static/david/2024/2024-03-05-lac-corbeau_660x440.jpg 660w, /static/david/2024/2024-03-05-lac-corbeau_990x660.jpg 990w, /static/david/2024/2024-03-05-lac-corbeau_1320x880.jpg 1320w"
            sizes="min(100vw, calc(100vh * 4032 / 3024))"
            loading="lazy"
            decoding="async"
            alt="Lac corbeau à l’aube.">
    </a>
    <figcaption>De bien jolies couleurs au&nbsp;réveil.</figcaption>
 </figure>
 <p>Cet épisode me confirme encore une fois que les enfants ont des corps de sportifs de très haut niveau. Je suis impatient de pouvoir le charger un peu plus car c’est frustrant de le voir gambader devant de bon matin alors que mes muscles sont à peine réveillés. J’aime bien lorsqu’on va explorer un peu plus loin et que l’on se projette sur ce que l’on pourrait faire l’année&nbsp;suivante.</p>
 <figure>
    <a href="/static/david/2024/2024-03-05-enfant-refuge-corbeau.jpg"
        title="Cliquer pour une version haute résolution">
        <img
            src="/static/david/2024/2024-03-05-enfant-refuge-corbeau.jpg"
            width="3024" height="4032"
            srcset="/static/david/2024/2024-03-05-enfant-refuge-corbeau.jpg 3024w, /static/david/2024/2024-03-05-enfant-refuge-corbeau_660x440.jpg 660w, /static/david/2024/2024-03-05-enfant-refuge-corbeau_990x660.jpg 990w, /static/david/2024/2024-03-05-enfant-refuge-corbeau_1320x880.jpg 1320w"
            sizes="min(100vw, calc(100vh * 3024 / 4032))"
            loading="lazy"
            decoding="async"
            alt="Un enfant qui court dans la neige vers un refuge.">
    </a>
    <figcaption>Jamais&nbsp;fatigué.</figcaption>
 </figure>
 <p>Le retour est moins joyeux car il s’agit d’enchainer les efforts et chaque heure qui passe rend la neige plus meuble. À tel point que l’on décide de couper par une piste sur une courte section. Mon évaluation est que la saison de ski est terminée, même une sous-couche bien travaillée ne tiendra pas la semaine qui s’en&nbsp;vient.</p>
 <p>J’aurais aimé faire une boucle un peu plus longue au retour mais il faut savoir s’adapter aux conditions. Le plus important est de terminer sans blessure ni&nbsp;dégoût.</p>
 <p><em>Je commence à imaginer un parcours rapide sur plusieurs jours dans cette forêt que je connais bien. Peut-être qu’une fenêtre se dessine en avril… il faut que je récupère un peu de cardio d’ici&nbsp;là.</em></p>

  
    <nav>
      <p>
        
          <a href="/david/2024/adaptation/"
             title="Liste de tous les articles 2024 associés à cette étiquette"
             rel="tag">#adaptation</a>
        
          <a href="/david/2024/aventure/"
             title="Liste de tous les articles 2024 associés à cette étiquette"
             rel="tag">#aventure</a>
        
          <a href="/david/2024/psychologie/"
             title="Liste de tous les articles 2024 associés à cette étiquette"
             rel="tag">#psychologie</a>
        
        <a href="/david/2024/#tags" title="Liste de toutes les étiquettes 2024">tous ?</a>
      </p>
    </nav>
  
  <nav>
    <p>
      
        <a rel="prev"
           href="/david/2024/03/04/"
           title="Publication précédente : Jour&nbsp;1">← Précédent</a> •
      
      <a href="/david/2024/" title="Liste des publications récentes">↑ En 2024</a>
      
        • <a rel="next"
            href="/david/2024/03/06/"
            title="Publication suivante : Vannerie">Suivant →</a>
      
    </p>
  </nav>

      
        <form action="/david/recherche/" method="get">
          <fieldset>
            <legend>Recherche</legend>
            <label for="input-search">Termes de votre recherche :</label>
            <input id="input-search" type="search" name="s" aria-describedby="indexation-infos" required>
            <input type="submit" value="Chercher">
            <p id="indexation-infos">
              <small>
                Seuls les contenus de ces 8 dernières années sont indexés.
              </small>
            </p>
          </fieldset>
        </form>
      
      <aside>
        <theme-toggle></theme-toggle>
      </aside>
    </article>
    <hr>
    <footer>
      <p>
        <a href="/david/" title="Aller à l’accueil">Accueil</a>
        •
        <a href="/david/log/" title="Accès au flux RSS">Suivre</a>
        •
        <a href="http://larlet.com"
           title="Go to my English profile"
           data-instant>Pro</a>
        •
        <a href="mailto:david%40larlet.fr" title="Envoyer un courriel">Email</a>
        •
        <abbr title="Hébergeur : Alwaysdata, 62 rue Tiquetonne 75002 Paris, +33184162340">Légal</abbr>
      </p>
      <template id="theme-selector">
        <form>
          <style type="text/css">
            fieldset div {
              text-align: center;
            }
          </style>
          <fieldset>
            <legend>Thème</legend>
            <div>
              <label>
                <input type="radio" value="auto" name="chosen-color-scheme" checked>
                Auto
              </label>
              <label>
                <input type="radio" value="dark" name="chosen-color-scheme">
                Foncé
              </label>
              <label>
                <input type="radio" value="light" name="chosen-color-scheme">
                Clair
              </label>
            </div>
          </fieldset>
        </form>
      </template>
    </footer>
    <script src="/static/david/js/instantpage-5.1.0.min.js" type="module"></script>
    <script>
      class ThemeToggle extends HTMLElement {
        constructor() {
          super()
          const themeSelectorTemplate = document.querySelector('#theme-selector')
          const form = themeSelectorTemplate.content.firstElementChild
          this.attachShadow({ mode: 'open' })
          this.shadowRoot.appendChild(form.cloneNode(true))
        }

        connectedCallback() {
          const form = this.shadowRoot.querySelector('form')
          form.addEventListener('change', (e) => {
            const chosenColorScheme = e.target.value
            localStorage.setItem('theme', chosenColorScheme)
            toggleTheme(chosenColorScheme)
          })

          const selectedTheme = localStorage.getItem('theme')
          if (selectedTheme && selectedTheme !== 'undefined') {
            form.querySelector(`[value="${selectedTheme}"]`).checked = true
          }
        }
      }

      const prefersColorSchemeDark = '(prefers-color-scheme: dark)'
      window.addEventListener('load', () => {
        let colorsLayer = undefined
        let hasDarkRules = false
        for (const styleSheet of Array.from(document.styleSheets)) {
          let mediaRules = []
          for (const layerRule of styleSheet.cssRules) {
            if (!(layerRule instanceof CSSLayerBlockRule)) {
              continue
            }
            if (layerRule.name === 'colors') {
              colorsLayer = layerRule
            }
            for (const cssRule of layerRule.cssRules) {
              if (cssRule.type !== CSSRule.MEDIA_RULE) {
                continue
              }
              // WARNING: Safari does not have/supports `conditionText`.
              if (cssRule.conditionText) {
                if (cssRule.conditionText !== prefersColorSchemeDark) {
                  continue
                }
              } else {
                if (cssRule.cssText.startsWith(prefersColorSchemeDark)) {
                  continue
                }
              }
              mediaRules = mediaRules.concat(Array.from(cssRule.cssRules))
            }
          }

          // WARNING: do not try to insert a Rule to a styleSheet you are
          // currently iterating on, otherwise the browser will be stuck
          // in a infinite loop…
          for (const mediaRule of mediaRules) {
            // Safari requires the `0` second parameter (even if default).
            colorsLayer.insertRule(mediaRule.cssText, 0)
            hasDarkRules = true
          }
        }

        if (hasDarkRules) {
          if ('customElements' in window && !customElements.get('theme-toggle')) {
            customElements.define('theme-toggle', ThemeToggle)
          }
        }
      })
    </script>
    
  <script src="/static/david/js/popper-2.11.8.min.js"></script>
  <script src="/static/david/js/tippy-bundle-6.3.7.umd.min.js"></script>
  <script>
    tippy('[data-tippy]', {
      content(reference) {
        reference.addEventListener('click', (e) => e.preventDefault())
        return `
        <h3 lang="fr">
          <img src="${reference.dataset.favicon}" loading="lazy">
          <a href="${reference.dataset.source}"
            >Article sur ${reference.dataset.domain}</a></h3>
        <p lang="${reference.hreflang}"><em>${reference.dataset.description}</em></p>
        <div class="tippy-links" lang="fr">
          <a href="${reference.href}">Archive au ${reference.dataset.date}</a>
        </div>
        `
      },
      allowHTML: true,
      interactive: true,
      delay: [150, 700],
      hideOnClick: false
    })
  </script>

  </body>
 </html>
--- a/david/2024/03/06/index.html
+++ b/david/2024/03/06/index.html
@@ -0,0 +1,414 @@
 <!DOCTYPE html><!-- This is a valid HTML5 document. -->
 <!-- Screen readers, SEO, extensions and so on. -->
 <html lang="fr">
  <!-- Has to be within the first 1024 bytes, hence before the `title` element
  See: https://www.w3.org/TR/2012/CR-html5-20121217/document-metadata.html#charset -->
  <meta charset="utf-8">
  <!-- Why no `X-UA-Compatible` meta: https://stackoverflow.com/a/6771584 -->
  <!-- The viewport meta is quite crowded and we are responsible for that.
  See: https://codepen.io/tigt/post/meta-viewport-for-2015 -->
  <meta name="viewport" content="width=device-width,initial-scale=1">
  <!-- Required to make a valid HTML5 document. -->
  <title>
    Vannerie
  — David Larlet</title>
  <script>
    function toggleTheme(themeName) {
      document.documentElement.classList.toggle(
        'forced-dark',
        themeName === 'dark'
      )
      document.documentElement.classList.toggle(
        'forced-light',
        themeName === 'light'
      )
    }
    const selectedTheme = localStorage.getItem('theme')
    if (selectedTheme !== 'undefined') {
      toggleTheme(selectedTheme)
    }
  </script>
  <!-- Documented, feel free to shoot an email. -->
  <link rel="stylesheet" href="/static/david/css/style_2024-02-03.css">
  <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. -->
  <link rel="preload"
        href="/static/david/css/fonts/century_supra_ot_a_regular.woff2"
        as="font"
        type="font/woff2"
        media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)"
        crossorigin>
  <link rel="preload"
        href="/static/david/css/fonts/century_supra_ot_a_bold.woff2"
        as="font"
        type="font/woff2"
        media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)"
        crossorigin>
  <link rel="preload"
        href="/static/david/css/fonts/century_supra_ot_a_italic.woff2"
        as="font"
        type="font/woff2"
        media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)"
        crossorigin>
  <link rel="preload"
        href="/static/david/css/fonts/century_supra_ot_b_regular.woff2"
        as="font"
        type="font/woff2"
        media="(prefers-color-scheme: dark)"
        crossorigin>
  <link rel="preload"
        href="/static/david/css/fonts/century_supra_ot_b_bold.woff2"
        as="font"
        type="font/woff2"
        media="(prefers-color-scheme: dark)"
        crossorigin>
  <link rel="preload"
        href="/static/david/css/fonts/century_supra_ot_b_italic.woff2"
        as="font"
        type="font/woff2"
        media="(prefers-color-scheme: dark)"
        crossorigin>
  <meta name="description" content="L’atelier du jour était une initiation à la vannerie, cette fois-ci avec / pour l’enfant. Depuis le temps qu’il veut m’accompagner, j’ai sauté sur l’occasion lorsqu’une animatrice d’atelier — ancienne enseignante, ça doit jouer — acceptât les personnes de son âge.">
  <!-- That good ol' feed, subscribe :). -->
  <link rel="alternate"
        type="application/atom+xml"
        title="Feed"
        href="/david/log/">
  <!-- Generated from https://realfavicongenerator.net/ such a mess. -->
  <link rel="apple-touch-icon"
        sizes="180x180"
        href="/static/david/icons2/apple-touch-icon.png">
  <link rel="icon"
        type="image/png"
        sizes="32x32"
        href="/static/david/icons2/favicon-32x32.png">
  <link rel="icon"
        type="image/png"
        sizes="16x16"
        href="/static/david/icons2/favicon-16x16.png">
  <link rel="manifest" href="/static/david/icons2/site.webmanifest">
  <link rel="mask-icon"
        href="/static/david/icons2/safari-pinned-tab.svg"
        color="#07486c">
  <link rel="shortcut icon" href="/static/david/icons2/favicon.ico">
  <meta name="msapplication-TileColor" content="#f7f7f7">
  <meta name="msapplication-config"
        content="/static/david/icons2/browserconfig.xml">
  <meta name="theme-color"
        content="#f7f7f7"
        media="(prefers-color-scheme: light)">
  <meta name="theme-color"
        content="#272727"
        media="(prefers-color-scheme: dark)">
  <!-- Is that even respected? Retrospectively? What a shAItshow…
  https://neil-clarke.com/block-the-bots-that-feed-ai-models-by-scraping-your-website/ -->
  <meta name="robots" content="noai, noimageai">
  
 <style type="text/css">
  .tippy-content {
    min-width: 280px;
    padding: .5rem;
    font-size: calc(var(--fluid-0) * 0.8);
    font-family: var(--labor-font);
    letter-spacing: initial;
    text-align: left;
  }
  .tippy-content h3 {
    margin-top: 0;
  }
  .tippy-content h3 img {
    max-width: 2rem;
    max-height: 2rem;
    display: inline-block;
  }
  .tippy-content .tippy-links {
    display: flex;
    justify-content: space-around;
  }
  .tippy-content a {
    padding: .4rem;
    color: #F06048;
  }
 </style>

  <body data-instant-intensity="viewport-all">
    <article>
      
  <header>
    <hgroup>
      <h1>Vannerie</h1>
      <p>Le <time datetime="2024-03-06">6 mars 2024</time></p>
    </hgroup>
  </header>
  <nav>
    <p>
      
        <a rel="prev"
           href="/david/2024/03/05/"
           title="Publication précédente : Jour&nbsp;2">← Précédent</a> •
      
      <a href="/david/" title="Aller à l’accueil" rel="up">Accueil</a>
      •
      <a href="/david/recherche/"
         title="Aller à la page de recherche"
         rel="search" data-no-instant>Recherche</a>
      
    </p>
  </nav>
  
 <p>L’atelier du jour était une initiation à la vannerie, cette fois-ci avec / pour l’enfant. Depuis le temps qu’il veut m’accompagner, j’ai sauté sur l’occasion lorsqu’une animatrice d’atelier — ancienne enseignante, ça doit jouer&nbsp;— acceptât les personnes de son&nbsp;âge.</p>
 <figure>
    <a href="/static/david/2024/2024-03-06-vannerie-panier.jpg"
        title="Cliquer pour une version haute résolution">
        <img
            src="/static/david/2024/2024-03-06-vannerie-panier.jpg"
            width="4032" height="3024"
            srcset="/static/david/2024/2024-03-06-vannerie-panier.jpg 4032w, /static/david/2024/2024-03-06-vannerie-panier_660x440.jpg 660w, /static/david/2024/2024-03-06-vannerie-panier_990x660.jpg 990w, /static/david/2024/2024-03-06-vannerie-panier_1320x880.jpg 1320w"
            sizes="min(100vw, calc(100vh * 4032 / 3024))"
            loading="lazy"
            decoding="async"
            alt="Un panier en vannerie.">
    </a>
    <figcaption>Un panier en vannerie, ça m’a pris&nbsp;2h30.</figcaption>
 </figure>
 <p>Le <em>twist</em>, c’est que j’ai pu le faire aussi vu que nous étions les seuls présents pour la session au final. Autant dire qu’avec un cours particulier on a pu apprendre encore plus de choses&#8239;! Sur un spectre allant des techniques d’assouplissement à l’appropriation culturelle, on a passé un bon moment d’échanges. J’ai appris que la préparation du frêne noir utilisé dans la vannerie par les Premières Nations prend plusieurs mois, ce qui explique sa rareté (et son&nbsp;prix).</p>
 <figure>
    <a href="/static/david/2024/2024-03-06-vannerie-sac-a-dos.jpg"
        title="Cliquer pour une version haute résolution">
        <img
            src="/static/david/2024/2024-03-06-vannerie-sac-a-dos.jpg"
            width="3024" height="4032"
            srcset="/static/david/2024/2024-03-06-vannerie-sac-a-dos.jpg 3024w, /static/david/2024/2024-03-06-vannerie-sac-a-dos_660x440.jpg 660w, /static/david/2024/2024-03-06-vannerie-sac-a-dos_990x660.jpg 990w, /static/david/2024/2024-03-06-vannerie-sac-a-dos_1320x880.jpg 1320w"
            sizes="min(100vw, calc(100vh * 3024 / 4032))"
            loading="lazy"
            decoding="async"
            alt="Un sac à dos en vannerie.">
    </a>
    <figcaption>Un sac à dos en vannerie sur le dos de&nbsp;l’enfant.</figcaption>
 </figure>
 <p>Toujours cette sensation de créer des objets utiles à partir de pas grand chose et avec un minimum de&nbsp;matériel.</p>
 <a href="#hr-100" title="Lien vers cette section de la page"><hr id="hr-100" /></a>

 <blockquote lang="en">
 <p>Like Stimulus, but <em>a lot</em> smaller and a bit more&nbsp;webcomponenty?</p>
 <p><cite><em><a data-link-domain="github.com" href="https://github.com/johanhalse/musculus">Musculus</a></em></cite></p>
 </blockquote>
 <p>Découverte du jour que je trouve très inspirante. J’avais dans un coin de tête de tester des choses dans cette voie. Réussir à faire le pont entre les deux serait une très bonne combinaison. J’apprécie qu’une solution de test soit proposée, même si elle est légère (en terme de fiabilité) j’en peux plus d’attendre&nbsp;Playwright.</p>
 <a href="#hr-101" title="Lien vers cette section de la page"><hr id="hr-101" /></a>

 <blockquote>
 <p>End the battle. Use <code>infinity</code> to get the highest possible <code>z-index</code> and win&nbsp;forever.</p>
 <p>[…]</p>
 <p>But is <code>infinity</code> really any better than some arbitrarily big value like <code>9999px</code>? Functionally, no. Same end result. But I think <mark>it does help make code more self-documenting,</mark> because <code>infinity</code> conveys intent. It expresses that it’s all about the magnitude, not a specific magic&nbsp;number.</p>
 <p><cite><em><a data-link-domain="codersblock.com" href="https://codersblock.com/blog/playing-with-infinity-in-css/" hreflang="en"
            title="Consultation de l’article (anglais)">Playing with Infinity in CSS</a>
            <a href="/david/cache/2024/1f4e359d100592aee6e46505a40b2a01/" hreflang="en"
                data-tippy data-description="CSS has an infinity constant. When I first learned about this, my brain lit up with all kinds of absurd possibilities. Let’s discuss! There might even be some..."
                data-source="https://codersblock.com/blog/playing-with-infinity-in-css/"
                data-date="2024-03-06"
                data-favicon="https://codersblock.com/favicon-32x32.png"
                data-domain="codersblock.com"
                ><svg xmlns="http://www.w3.org/2000/svg"
                    width="24" height="24" viewBox="0 0 24 24" fill="none"
                    stroke="currentColor" stroke-width="2" stroke-linecap="square"
                    stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle>
                    <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path>
                    <line x1="12" y1="17" x2="12.01" y2="17"></line>
                </svg>
                <span class="sr-only">[archive]</span></a></em></cite></p>
 </blockquote>
 <p>Autre découverte du jour. J’aime bien l’idée de pouvoir évacuer certaines valeurs magiques de manière explicite. J’ai la flemme de tester ce qu’un <code>calc(infinity - 1)</code> donnerait sur un <code>z-index</code>&nbsp;🤭.</p>

  
    <nav>
      <p>
        
          <a href="/david/2024/apprentissage/"
             title="Liste de tous les articles 2024 associés à cette étiquette"
             rel="tag">#apprentissage</a>
        
          <a href="/david/2024/parentalite/"
             title="Liste de tous les articles 2024 associés à cette étiquette"
             rel="tag">#parentalité</a>
        
          <a href="/david/2024/protopie/"
             title="Liste de tous les articles 2024 associés à cette étiquette"
             rel="tag">#protopie</a>
        
        <a href="/david/2024/#tags" title="Liste de toutes les étiquettes 2024">tous ?</a>
      </p>
    </nav>
  
  <nav>
    <p>
      
        <a rel="prev"
           href="/david/2024/03/05/"
           title="Publication précédente : Jour&nbsp;2">← Précédent</a> •
      
      <a href="/david/2024/" title="Liste des publications récentes">↑ En 2024</a>
      
    </p>
  </nav>

      
        <form action="/david/recherche/" method="get">
          <fieldset>
            <legend>Recherche</legend>
            <label for="input-search">Termes de votre recherche :</label>
            <input id="input-search" type="search" name="s" aria-describedby="indexation-infos" required>
            <input type="submit" value="Chercher">
            <p id="indexation-infos">
              <small>
                Seuls les contenus de ces 8 dernières années sont indexés.
              </small>
            </p>
          </fieldset>
        </form>
      
      <aside>
        <theme-toggle></theme-toggle>
      </aside>
    </article>
    <hr>
    <footer>
      <p>
        <a href="/david/" title="Aller à l’accueil">Accueil</a>
        •
        <a href="/david/log/" title="Accès au flux RSS">Suivre</a>
        •
        <a href="http://larlet.com"
           title="Go to my English profile"
           data-instant>Pro</a>
        •
        <a href="mailto:david%40larlet.fr" title="Envoyer un courriel">Email</a>
        •
        <abbr title="Hébergeur : Alwaysdata, 62 rue Tiquetonne 75002 Paris, +33184162340">Légal</abbr>
      </p>
      <template id="theme-selector">
        <form>
          <style type="text/css">
            fieldset div {
              text-align: center;
            }
          </style>
          <fieldset>
            <legend>Thème</legend>
            <div>
              <label>
                <input type="radio" value="auto" name="chosen-color-scheme" checked>
                Auto
              </label>
              <label>
                <input type="radio" value="dark" name="chosen-color-scheme">
                Foncé
              </label>
              <label>
                <input type="radio" value="light" name="chosen-color-scheme">
                Clair
              </label>
            </div>
          </fieldset>
        </form>
      </template>
    </footer>
    <script src="/static/david/js/instantpage-5.1.0.min.js" type="module"></script>
    <script>
      class ThemeToggle extends HTMLElement {
        constructor() {
          super()
          const themeSelectorTemplate = document.querySelector('#theme-selector')
          const form = themeSelectorTemplate.content.firstElementChild
          this.attachShadow({ mode: 'open' })
          this.shadowRoot.appendChild(form.cloneNode(true))
        }

        connectedCallback() {
          const form = this.shadowRoot.querySelector('form')
          form.addEventListener('change', (e) => {
            const chosenColorScheme = e.target.value
            localStorage.setItem('theme', chosenColorScheme)
            toggleTheme(chosenColorScheme)
          })

          const selectedTheme = localStorage.getItem('theme')
          if (selectedTheme && selectedTheme !== 'undefined') {
            form.querySelector(`[value="${selectedTheme}"]`).checked = true
          }
        }
      }

      const prefersColorSchemeDark = '(prefers-color-scheme: dark)'
      window.addEventListener('load', () => {
        let colorsLayer = undefined
        let hasDarkRules = false
        for (const styleSheet of Array.from(document.styleSheets)) {
          let mediaRules = []
          for (const layerRule of styleSheet.cssRules) {
            if (!(layerRule instanceof CSSLayerBlockRule)) {
              continue
            }
            if (layerRule.name === 'colors') {
              colorsLayer = layerRule
            }
            for (const cssRule of layerRule.cssRules) {
              if (cssRule.type !== CSSRule.MEDIA_RULE) {
                continue
              }
              // WARNING: Safari does not have/supports `conditionText`.
              if (cssRule.conditionText) {
                if (cssRule.conditionText !== prefersColorSchemeDark) {
                  continue
                }
              } else {
                if (cssRule.cssText.startsWith(prefersColorSchemeDark)) {
                  continue
                }
              }
              mediaRules = mediaRules.concat(Array.from(cssRule.cssRules))
            }
          }

          // WARNING: do not try to insert a Rule to a styleSheet you are
          // currently iterating on, otherwise the browser will be stuck
          // in a infinite loop…
          for (const mediaRule of mediaRules) {
            // Safari requires the `0` second parameter (even if default).
            colorsLayer.insertRule(mediaRule.cssText, 0)
            hasDarkRules = true
          }
        }

        if (hasDarkRules) {
          if ('customElements' in window && !customElements.get('theme-toggle')) {
            customElements.define('theme-toggle', ThemeToggle)
          }
        }
      })
    </script>
    
  <script src="/static/david/js/popper-2.11.8.min.js"></script>
  <script src="/static/david/js/tippy-bundle-6.3.7.umd.min.js"></script>
  <script>
    tippy('[data-tippy]', {
      content(reference) {
        reference.addEventListener('click', (e) => e.preventDefault())
        return `
        <h3 lang="fr">
          <img src="${reference.dataset.favicon}" loading="lazy">
          <a href="${reference.dataset.source}"
            >Article sur ${reference.dataset.domain}</a></h3>
        <p lang="${reference.hreflang}"><em>${reference.dataset.description}</em></p>
        <div class="tippy-links" lang="fr">
          <a href="${reference.href}">Archive au ${reference.dataset.date}</a>
        </div>
        `
      },
      allowHTML: true,
      interactive: true,
      delay: [150, 700],
      hideOnClick: false
    })
  </script>

  </body>
 </html>
--- a/david/2024/_sources/2024-03-04
+++ b/david/2024/_sources/2024-03-04
@@ -0,0 +1,13 @@
 # Jour 1

 Une réservation de longue date qui s’est transformée en sortie familiale (!), malheureusement nous n’avons pas pu rejoindre le refuge à ski faute de neige suffisante. C’était problématique car j’avais prévu de traîner une bonne partie de l’équipement, ce qui se révélait être un peu plus lourd sur le dos. Bon, aussi, on était partis sur une raclette, ça n’aide pas 😅.

 J’avais très peur que le sentier soit peu praticable sans percer à chaque pas, ce qui m’était déjà arrivé dans un tel contexte. Vu le poids du sac, je craignais notamment que ma cheville en cours de réparation refasse le même mouvement en descente… mais nous étions à une poignée de degrés de cet état de la neige pour notre plus grand bonheur.

 Ce n’était pas non plus de tout repos et la récompense d’une lac dégelant à l’arrivée était bien méritée. Il est rare d’avoir ces conditions très douces dans un contexte hivernal, on en avait même oublié de prendre nos tuques !

 *Tests du jour : les barquettes en aluminium pour faire réflecteur de bougies. Efficace. Les bougies longues durées d’Ikea pour faire fondre du fromage. Pas efficace.*

 ![Lac corbeau avec des boulots au premier plan.](/static/david/2024/2024-03-04-lac-corbeau.jpg "Un décor très minecrafteux (sic).")

 #dystopie #forêt #solastalgia
--- a/david/2024/_sources/2024-03-05
+++ b/david/2024/_sources/2024-03-05
@@ -0,0 +1,17 @@
 # Jour 2

 On se réveille dans la brume avec le soleil peinant à passer à travers, le lac et la neige ont regelé pendant la nuit. C’est une belle ambiance après une nuit agitée par la chaleur du ~~sauna~~ refuge. Les poêles tirent à fond dans ces endroits pour éviter que des personnes n’arrivent pas à faire démarrer un feu (j’imagine que ça peut être critique) mais ça les rend très inefficaces dans la durée et très chauds dès qu’on met deux buches dedans.

 ![Lac corbeau à l’aube.](/static/david/2024/2024-03-05-lac-corbeau.jpg "De bien jolies couleurs au réveil.")

 Cet épisode me confirme encore une fois que les enfants ont des corps de sportifs de très haut niveau. Je suis impatient de pouvoir le charger un peu plus car c’est frustrant de le voir gambader devant de bon matin alors que mes muscles sont à peine réveillés. J’aime bien lorsqu’on va explorer un peu plus loin et que l’on se projette sur ce que l’on pourrait faire l’année suivante.

 ![Un enfant qui court dans la neige vers un refuge.](/static/david/2024/2024-03-05-enfant-refuge-corbeau.jpg "Jamais fatigué.")

 Le retour est moins joyeux car il s’agit d’enchainer les efforts et chaque heure qui passe rend la neige plus meuble. À tel point que l’on décide de couper par une piste sur une courte section. Mon évaluation est que la saison de ski est terminée, même une sous-couche bien travaillée ne tiendra pas la semaine qui s’en vient.

 J’aurais aimé faire une boucle un peu plus longue au retour mais il faut savoir s’adapter aux conditions. Le plus important est de terminer sans blessure ni dégoût.

 *Je commence à imaginer un parcours rapide sur plusieurs jours dans cette forêt que je connais bien. Peut-être qu’une fenêtre se dessine en avril… il faut que je récupère un peu de cardio d’ici là.*

 #adaptation #aventure #psychologie
--- a/david/2024/_sources/2024-03-06
+++ b/david/2024/_sources/2024-03-06
@@ -0,0 +1,33 @@
 # Vannerie

 L’atelier du jour était une initiation à la vannerie, cette fois-ci avec / pour l’enfant. Depuis le temps qu’il veut m’accompagner, j’ai sauté sur l’occasion lorsqu’une animatrice d’atelier — ancienne enseignante, ça doit jouer — acceptât les personnes de son âge.

 ![Un panier en vannerie.](/static/david/2024/2024-03-06-vannerie-panier.jpg "Un panier en vannerie, ça m’a pris 2h30.")

 Le *twist*, c’est que j’ai pu le faire aussi vu que nous étions les seuls présents pour la session au final. Autant dire qu’avec un cours particulier on a pu apprendre encore plus de choses ! Sur un spectre allant des techniques d’assouplissement à l’appropriation culturelle, on a passé un bon moment d’échanges. J’ai appris que la préparation du frêne noir utilisé dans la vannerie par les Premières Nations prend plusieurs mois, ce qui explique sa rareté (et son prix).

 ![Un sac à dos en vannerie.](/static/david/2024/2024-03-06-vannerie-sac-a-dos.jpg "Un sac à dos en vannerie sur le dos de l’enfant.")

 Toujours cette sensation de créer des objets utiles à partir de pas grand chose et avec un minimum de matériel.

 ---

 > [en] Like Stimulus, but *a lot* smaller and a bit more webcomponenty?
 > 
 > <cite>*[Musculus](https://github.com/johanhalse/musculus)*</cite>

 Découverte du jour que je trouve très inspirante. J’avais dans un coin de tête de tester des choses dans cette voie. Réussir à faire le pont entre les deux serait une très bonne combinaison. J’apprécie qu’une solution de test soit proposée, même si elle est légère (en terme de fiabilité) j’en peux plus d’attendre Playwright.

 ---

 > End the battle. Use `infinity` to get the highest possible `z-index` and win forever.
 > 
 > […]
 > 
 > But is `infinity` really any better than some arbitrarily big value like `9999px`? Functionally, no. Same end result. But I think ==it does help make code more self-documenting,== because `infinity` conveys intent. It expresses that it’s all about the magnitude, not a specific magic number.
 >
 > <cite>*[Playing with Infinity in CSS](https://codersblock.com/blog/playing-with-infinity-in-css/)*</cite>

 Autre découverte du jour. J’aime bien l’idée de pouvoir évacuer certaines valeurs magiques de manière explicite. J’ai la flemme de tester ce qu’un `calc(infinity - 1)` donnerait sur un `z-index` 🤭.

 #apprentissage #parentalité #protopie
--- a/david/2024/adaptation/index.html
+++ b/david/2024/adaptation/index.html
@@ -0,0 +1,334 @@
 <!DOCTYPE html><!-- This is a valid HTML5 document. -->
 <!-- Screen readers, SEO, extensions and so on. -->
 <html lang="fr">
  <!-- Has to be within the first 1024 bytes, hence before the `title` element
  See: https://www.w3.org/TR/2012/CR-html5-20121217/document-metadata.html#charset -->
  <meta charset="utf-8">
  <!-- Why no `X-UA-Compatible` meta: https://stackoverflow.com/a/6771584 -->
  <!-- The viewport meta is quite crowded and we are responsible for that.
  See: https://codepen.io/tigt/post/meta-viewport-for-2015 -->
  <meta name="viewport" content="width=device-width,initial-scale=1">
  <!-- Required to make a valid HTML5 document. -->
  <title>
    Étiquette #adaptation
  — David Larlet</title>
  <script>
    function toggleTheme(themeName) {
      document.documentElement.classList.toggle(
        'forced-dark',
        themeName === 'dark'
      )
      document.documentElement.classList.toggle(
        'forced-light',
        themeName === 'light'
      )
    }
    const selectedTheme = localStorage.getItem('theme')
    if (selectedTheme !== 'undefined') {
      toggleTheme(selectedTheme)
    }
  </script>
  <!-- Documented, feel free to shoot an email. -->
  <link rel="stylesheet" href="/static/david/css/style_2024-02-03.css">
  <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. -->
  <link rel="preload"
        href="/static/david/css/fonts/century_supra_ot_a_regular.woff2"
        as="font"
        type="font/woff2"
        media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)"
        crossorigin>
  <link rel="preload"
        href="/static/david/css/fonts/century_supra_ot_a_bold.woff2"
        as="font"
        type="font/woff2"
        media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)"
        crossorigin>
  <link rel="preload"
        href="/static/david/css/fonts/century_supra_ot_a_italic.woff2"
        as="font"
        type="font/woff2"
        media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)"
        crossorigin>
  <link rel="preload"
        href="/static/david/css/fonts/century_supra_ot_b_regular.woff2"
        as="font"
        type="font/woff2"
        media="(prefers-color-scheme: dark)"
        crossorigin>
  <link rel="preload"
        href="/static/david/css/fonts/century_supra_ot_b_bold.woff2"
        as="font"
        type="font/woff2"
        media="(prefers-color-scheme: dark)"
        crossorigin>
  <link rel="preload"
        href="/static/david/css/fonts/century_supra_ot_b_italic.woff2"
        as="font"
        type="font/woff2"
        media="(prefers-color-scheme: dark)"
        crossorigin>
  <meta name="description" content="Publications relatives au tag #adaptation">
  <!-- That good ol' feed, subscribe :). -->
  <link rel="alternate"
        type="application/atom+xml"
        title="Feed"
        href="/david/log/">
  <!-- Generated from https://realfavicongenerator.net/ such a mess. -->
  <link rel="apple-touch-icon"
        sizes="180x180"
        href="/static/david/icons2/apple-touch-icon.png">
  <link rel="icon"
        type="image/png"
        sizes="32x32"
        href="/static/david/icons2/favicon-32x32.png">
  <link rel="icon"
        type="image/png"
        sizes="16x16"
        href="/static/david/icons2/favicon-16x16.png">
  <link rel="manifest" href="/static/david/icons2/site.webmanifest">
  <link rel="mask-icon"
        href="/static/david/icons2/safari-pinned-tab.svg"
        color="#07486c">
  <link rel="shortcut icon" href="/static/david/icons2/favicon.ico">
  <meta name="msapplication-TileColor" content="#f7f7f7">
  <meta name="msapplication-config"
        content="/static/david/icons2/browserconfig.xml">
  <meta name="theme-color"
        content="#f7f7f7"
        media="(prefers-color-scheme: light)">
  <meta name="theme-color"
        content="#272727"
        media="(prefers-color-scheme: dark)">
  <!-- Is that even respected? Retrospectively? What a shAItshow…
  https://neil-clarke.com/block-the-bots-that-feed-ai-models-by-scraping-your-website/ -->
  <meta name="robots" content="noai, noimageai">
  
  <style type="text/css">
    details[open] summary {
      display: none;
    }
  </style>

  <body data-instant-intensity="viewport-all">
    <article>
      
  <header>
    <hgroup>
      <h1>#adaptation</h1>
      <p>Publications relatives à cette étiquette</p>
    </hgroup>
  </header>
  <nav>
    <p>
      <a href="/david/" title="Aller à l’accueil">
        Accueil</a>
      •
      <a rel="tags"
        href="/david/2024/#tags"
        title="Liste de toutes les étiquettes">
        Étiquettes</a>
      •
      <a href="/david/recherche/" title="Aller à la page de recherche" rel="search" data-no-instant>Recherche</a>
      •
      <a href="/david/log/" title="Accès au flux RSS">Suivre</a>
    </p>
  </nav>
  
    <h2>
      <a href="/david/2024/03/05/" title="Lien permanent vers cet article">Jour&nbsp;2</a> <time datetime="2024-03-05">5 mars 2024</time>
    </h2>
    
 <p>On se réveille dans la brume avec le soleil peinant à passer à travers, le lac et la neige ont regelé pendant la nuit. C’est une belle ambiance après une nuit agitée par la chaleur du <del>sauna</del> refuge. Les poêles tirent à fond dans ces endroits pour éviter que des personnes n’arrivent pas à faire démarrer un feu (j’imagine que ça peut être critique) mais ça les rend très inefficaces dans la durée et très chauds dès qu’on met deux buches&nbsp;dedans.</p>
 <figure>
    <a href="/static/david/2024/2024-03-05-lac-corbeau.jpg"
        title="Cliquer pour une version haute résolution">
        <img
            src="/static/david/2024/2024-03-05-lac-corbeau.jpg"
            width="4032" height="3024"
            srcset="/static/david/2024/2024-03-05-lac-corbeau.jpg 4032w, /static/david/2024/2024-03-05-lac-corbeau_660x440.jpg 660w, /static/david/2024/2024-03-05-lac-corbeau_990x660.jpg 990w, /static/david/2024/2024-03-05-lac-corbeau_1320x880.jpg 1320w"
            sizes="min(100vw, calc(100vh * 4032 / 3024))"
            loading="lazy"
            decoding="async"
            alt="Lac corbeau à l’aube.">
    </a>
    <figcaption>De bien jolies couleurs au&nbsp;réveil.</figcaption>
 </figure>
 <p>Cet épisode me confirme encore une fois que les enfants ont des corps de sportifs de très haut niveau. Je suis impatient de pouvoir le charger un peu plus car c’est frustrant de le voir gambader devant de bon matin alors que mes muscles sont à peine réveillés. J’aime bien lorsqu’on va explorer un peu plus loin et que l’on se projette sur ce que l’on pourrait faire l’année&nbsp;suivante.</p>
 <figure>
    <a href="/static/david/2024/2024-03-05-enfant-refuge-corbeau.jpg"
        title="Cliquer pour une version haute résolution">
        <img
            src="/static/david/2024/2024-03-05-enfant-refuge-corbeau.jpg"
            width="3024" height="4032"
            srcset="/static/david/2024/2024-03-05-enfant-refuge-corbeau.jpg 3024w, /static/david/2024/2024-03-05-enfant-refuge-corbeau_660x440.jpg 660w, /static/david/2024/2024-03-05-enfant-refuge-corbeau_990x660.jpg 990w, /static/david/2024/2024-03-05-enfant-refuge-corbeau_1320x880.jpg 1320w"
            sizes="min(100vw, calc(100vh * 3024 / 4032))"
            loading="lazy"
            decoding="async"
            alt="Un enfant qui court dans la neige vers un refuge.">
    </a>
    <figcaption>Jamais&nbsp;fatigué.</figcaption>
 </figure>
 <p>Le retour est moins joyeux car il s’agit d’enchainer les efforts et chaque heure qui passe rend la neige plus meuble. À tel point que l’on décide de couper par une piste sur une courte section. Mon évaluation est que la saison de ski est terminée, même une sous-couche bien travaillée ne tiendra pas la semaine qui s’en&nbsp;vient.</p>
 <p>J’aurais aimé faire une boucle un peu plus longue au retour mais il faut savoir s’adapter aux conditions. Le plus important est de terminer sans blessure ni&nbsp;dégoût.</p>
 <p><em>Je commence à imaginer un parcours rapide sur plusieurs jours dans cette forêt que je connais bien. Peut-être qu’une fenêtre se dessine en avril… il faut que je récupère un peu de cardio d’ici&nbsp;là.</em></p>

    
      <nav>
        <p>
          
            <a href="/david/2024/adaptation/"
               title="Liste de tous les articles 2024 associés à cette étiquette"
               rel="tag">#adaptation</a>
          
            <a href="/david/2024/aventure/"
               title="Liste de tous les articles 2024 associés à cette étiquette"
               rel="tag">#aventure</a>
          
            <a href="/david/2024/psychologie/"
               title="Liste de tous les articles 2024 associés à cette étiquette"
               rel="tag">#psychologie</a>
          
          <a href="/david/2024/#tags" title="Liste de toutes les étiquettes 2024">tous ?</a>
        </p>
      </nav>
    
  

      
        <form action="/david/recherche/" method="get">
          <fieldset>
            <legend>Recherche</legend>
            <label for="input-search">Termes de votre recherche :</label>
            <input id="input-search" type="search" name="s" aria-describedby="indexation-infos" required>
            <input type="submit" value="Chercher">
            <p id="indexation-infos">
              <small>
                Seuls les contenus de ces 8 dernières années sont indexés.
              </small>
            </p>
          </fieldset>
        </form>
      
      <aside>
        <theme-toggle></theme-toggle>
      </aside>
    </article>
    <hr>
    <footer>
      <p>
        <a href="/david/" title="Aller à l’accueil">Accueil</a>
        •
        <a href="/david/log/" title="Accès au flux RSS">Suivre</a>
        •
        <a href="http://larlet.com"
           title="Go to my English profile"
           data-instant>Pro</a>
        •
        <a href="mailto:david%40larlet.fr" title="Envoyer un courriel">Email</a>
        •
        <abbr title="Hébergeur : Alwaysdata, 62 rue Tiquetonne 75002 Paris, +33184162340">Légal</abbr>
      </p>
      <template id="theme-selector">
        <form>
          <style type="text/css">
            fieldset div {
              text-align: center;
            }
          </style>
          <fieldset>
            <legend>Thème</legend>
            <div>
              <label>
                <input type="radio" value="auto" name="chosen-color-scheme" checked>
                Auto
              </label>
              <label>
                <input type="radio" value="dark" name="chosen-color-scheme">
                Foncé
              </label>
              <label>
                <input type="radio" value="light" name="chosen-color-scheme">
                Clair
              </label>
            </div>
          </fieldset>
        </form>
      </template>
    </footer>
    <script src="/static/david/js/instantpage-5.1.0.min.js" type="module"></script>
    <script>
      class ThemeToggle extends HTMLElement {
        constructor() {
          super()
          const themeSelectorTemplate = document.querySelector('#theme-selector')
          const form = themeSelectorTemplate.content.firstElementChild
          this.attachShadow({ mode: 'open' })
          this.shadowRoot.appendChild(form.cloneNode(true))
        }

        connectedCallback() {
          const form = this.shadowRoot.querySelector('form')
          form.addEventListener('change', (e) => {
            const chosenColorScheme = e.target.value
            localStorage.setItem('theme', chosenColorScheme)
            toggleTheme(chosenColorScheme)
          })

          const selectedTheme = localStorage.getItem('theme')
          if (selectedTheme && selectedTheme !== 'undefined') {
            form.querySelector(`[value="${selectedTheme}"]`).checked = true
          }
        }
      }

      const prefersColorSchemeDark = '(prefers-color-scheme: dark)'
      window.addEventListener('load', () => {
        let colorsLayer = undefined
        let hasDarkRules = false
        for (const styleSheet of Array.from(document.styleSheets)) {
          let mediaRules = []
          for (const layerRule of styleSheet.cssRules) {
            if (!(layerRule instanceof CSSLayerBlockRule)) {
              continue
            }
            if (layerRule.name === 'colors') {
              colorsLayer = layerRule
            }
            for (const cssRule of layerRule.cssRules) {
              if (cssRule.type !== CSSRule.MEDIA_RULE) {
                continue
              }
              // WARNING: Safari does not have/supports `conditionText`.
              if (cssRule.conditionText) {
                if (cssRule.conditionText !== prefersColorSchemeDark) {
                  continue
                }
              } else {
                if (cssRule.cssText.startsWith(prefersColorSchemeDark)) {
                  continue
                }
              }
              mediaRules = mediaRules.concat(Array.from(cssRule.cssRules))
            }
          }

          // WARNING: do not try to insert a Rule to a styleSheet you are
          // currently iterating on, otherwise the browser will be stuck
          // in a infinite loop…
          for (const mediaRule of mediaRules) {
            // Safari requires the `0` second parameter (even if default).
            colorsLayer.insertRule(mediaRule.cssText, 0)
            hasDarkRules = true
          }
        }

        if (hasDarkRules) {
          if ('customElements' in window && !customElements.get('theme-toggle')) {
            customElements.define('theme-toggle', ThemeToggle)
          }
        }
      })
    </script>
    
  </body>
 </html>
--- a/david/2024/apprentissage/index.html
+++ b/david/2024/apprentissage/index.html
@@ -134,6 +134,94 @@
    </p>
  </nav>
  
    <h2>
      <a href="/david/2024/03/06/" title="Lien permanent vers cet article">Vannerie</a> <time datetime="2024-03-06">6 mars 2024</time>
    </h2>
    
 <p>L’atelier du jour était une initiation à la vannerie, cette fois-ci avec / pour l’enfant. Depuis le temps qu’il veut m’accompagner, j’ai sauté sur l’occasion lorsqu’une animatrice d’atelier — ancienne enseignante, ça doit jouer&nbsp;— acceptât les personnes de son&nbsp;âge.</p>
 <figure>
    <a href="/static/david/2024/2024-03-06-vannerie-panier.jpg"
        title="Cliquer pour une version haute résolution">
        <img
            src="/static/david/2024/2024-03-06-vannerie-panier.jpg"
            width="4032" height="3024"
            srcset="/static/david/2024/2024-03-06-vannerie-panier.jpg 4032w, /static/david/2024/2024-03-06-vannerie-panier_660x440.jpg 660w, /static/david/2024/2024-03-06-vannerie-panier_990x660.jpg 990w, /static/david/2024/2024-03-06-vannerie-panier_1320x880.jpg 1320w"
            sizes="min(100vw, calc(100vh * 4032 / 3024))"
            loading="lazy"
            decoding="async"
            alt="Un panier en vannerie.">
    </a>
    <figcaption>Un panier en vannerie, ça m’a pris&nbsp;2h30.</figcaption>
 </figure>
 <p>Le <em>twist</em>, c’est que j’ai pu le faire aussi vu que nous étions les seuls présents pour la session au final. Autant dire qu’avec un cours particulier on a pu apprendre encore plus de choses&#8239;! Sur un spectre allant des techniques d’assouplissement à l’appropriation culturelle, on a passé un bon moment d’échanges. J’ai appris que la préparation du frêne noir utilisé dans la vannerie par les Premières Nations prend plusieurs mois, ce qui explique sa rareté (et son&nbsp;prix).</p>
 <figure>
    <a href="/static/david/2024/2024-03-06-vannerie-sac-a-dos.jpg"
        title="Cliquer pour une version haute résolution">
        <img
            src="/static/david/2024/2024-03-06-vannerie-sac-a-dos.jpg"
            width="3024" height="4032"
            srcset="/static/david/2024/2024-03-06-vannerie-sac-a-dos.jpg 3024w, /static/david/2024/2024-03-06-vannerie-sac-a-dos_660x440.jpg 660w, /static/david/2024/2024-03-06-vannerie-sac-a-dos_990x660.jpg 990w, /static/david/2024/2024-03-06-vannerie-sac-a-dos_1320x880.jpg 1320w"
            sizes="min(100vw, calc(100vh * 3024 / 4032))"
            loading="lazy"
            decoding="async"
            alt="Un sac à dos en vannerie.">
    </a>
    <figcaption>Un sac à dos en vannerie sur le dos de&nbsp;l’enfant.</figcaption>
 </figure>
 <p>Toujours cette sensation de créer des objets utiles à partir de pas grand chose et avec un minimum de&nbsp;matériel.</p>
 <a href="#hr-100" title="Lien vers cette section de la page"><hr id="hr-100" /></a>

 <blockquote lang="en">
 <p>Like Stimulus, but <em>a lot</em> smaller and a bit more&nbsp;webcomponenty?</p>
 <p><cite><em><a data-link-domain="github.com" href="https://github.com/johanhalse/musculus">Musculus</a></em></cite></p>
 </blockquote>
 <p>Découverte du jour que je trouve très inspirante. J’avais dans un coin de tête de tester des choses dans cette voie. Réussir à faire le pont entre les deux serait une très bonne combinaison. J’apprécie qu’une solution de test soit proposée, même si elle est légère (en terme de fiabilité) j’en peux plus d’attendre&nbsp;Playwright.</p>
 <a href="#hr-101" title="Lien vers cette section de la page"><hr id="hr-101" /></a>

 <blockquote>
 <p>End the battle. Use <code>infinity</code> to get the highest possible <code>z-index</code> and win&nbsp;forever.</p>
 <p>[…]</p>
 <p>But is <code>infinity</code> really any better than some arbitrarily big value like <code>9999px</code>? Functionally, no. Same end result. But I think <mark>it does help make code more self-documenting,</mark> because <code>infinity</code> conveys intent. It expresses that it’s all about the magnitude, not a specific magic&nbsp;number.</p>
 <p><cite><em><a data-link-domain="codersblock.com" href="https://codersblock.com/blog/playing-with-infinity-in-css/" hreflang="en"
            title="Consultation de l’article (anglais)">Playing with Infinity in CSS</a>
            <a href="/david/cache/2024/1f4e359d100592aee6e46505a40b2a01/" hreflang="en"
                data-tippy data-description="CSS has an infinity constant. When I first learned about this, my brain lit up with all kinds of absurd possibilities. Let’s discuss! There might even be some..."
                data-source="https://codersblock.com/blog/playing-with-infinity-in-css/"
                data-date="2024-03-06"
                data-favicon="https://codersblock.com/favicon-32x32.png"
                data-domain="codersblock.com"
                ><svg xmlns="http://www.w3.org/2000/svg"
                    width="24" height="24" viewBox="0 0 24 24" fill="none"
                    stroke="currentColor" stroke-width="2" stroke-linecap="square"
                    stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle>
                    <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path>
                    <line x1="12" y1="17" x2="12.01" y2="17"></line>
                </svg>
                <span class="sr-only">[archive]</span></a></em></cite></p>
 </blockquote>
 <p>Autre découverte du jour. J’aime bien l’idée de pouvoir évacuer certaines valeurs magiques de manière explicite. J’ai la flemme de tester ce qu’un <code>calc(infinity - 1)</code> donnerait sur un <code>z-index</code>&nbsp;🤭.</p>

    
      <nav>
        <p>
          
            <a href="/david/2024/apprentissage/"
               title="Liste de tous les articles 2024 associés à cette étiquette"
               rel="tag">#apprentissage</a>
          
            <a href="/david/2024/parentalite/"
               title="Liste de tous les articles 2024 associés à cette étiquette"
               rel="tag">#parentalité</a>
          
            <a href="/david/2024/protopie/"
               title="Liste de tous les articles 2024 associés à cette étiquette"
               rel="tag">#protopie</a>
          
          <a href="/david/2024/#tags" title="Liste de toutes les étiquettes 2024">tous ?</a>
        </p>
      </nav>
    
  
    <h2>
      <a href="/david/2024/02/23/" title="Lien permanent vers cet article">Préparatifs</a> <time datetime="2024-02-23">23 février 2024</time>
    </h2>
--- a/david/2024/aventure/index.html
+++ b/david/2024/aventure/index.html
@@ -134,6 +134,65 @@
    </p>
  </nav>
  
    <h2>
      <a href="/david/2024/03/05/" title="Lien permanent vers cet article">Jour&nbsp;2</a> <time datetime="2024-03-05">5 mars 2024</time>
    </h2>
    
 <p>On se réveille dans la brume avec le soleil peinant à passer à travers, le lac et la neige ont regelé pendant la nuit. C’est une belle ambiance après une nuit agitée par la chaleur du <del>sauna</del> refuge. Les poêles tirent à fond dans ces endroits pour éviter que des personnes n’arrivent pas à faire démarrer un feu (j’imagine que ça peut être critique) mais ça les rend très inefficaces dans la durée et très chauds dès qu’on met deux buches&nbsp;dedans.</p>
 <figure>
    <a href="/static/david/2024/2024-03-05-lac-corbeau.jpg"
        title="Cliquer pour une version haute résolution">
        <img
            src="/static/david/2024/2024-03-05-lac-corbeau.jpg"
            width="4032" height="3024"
            srcset="/static/david/2024/2024-03-05-lac-corbeau.jpg 4032w, /static/david/2024/2024-03-05-lac-corbeau_660x440.jpg 660w, /static/david/2024/2024-03-05-lac-corbeau_990x660.jpg 990w, /static/david/2024/2024-03-05-lac-corbeau_1320x880.jpg 1320w"
            sizes="min(100vw, calc(100vh * 4032 / 3024))"
            loading="lazy"
            decoding="async"
            alt="Lac corbeau à l’aube.">
    </a>
    <figcaption>De bien jolies couleurs au&nbsp;réveil.</figcaption>
 </figure>
 <p>Cet épisode me confirme encore une fois que les enfants ont des corps de sportifs de très haut niveau. Je suis impatient de pouvoir le charger un peu plus car c’est frustrant de le voir gambader devant de bon matin alors que mes muscles sont à peine réveillés. J’aime bien lorsqu’on va explorer un peu plus loin et que l’on se projette sur ce que l’on pourrait faire l’année&nbsp;suivante.</p>
 <figure>
    <a href="/static/david/2024/2024-03-05-enfant-refuge-corbeau.jpg"
        title="Cliquer pour une version haute résolution">
        <img
            src="/static/david/2024/2024-03-05-enfant-refuge-corbeau.jpg"
            width="3024" height="4032"
            srcset="/static/david/2024/2024-03-05-enfant-refuge-corbeau.jpg 3024w, /static/david/2024/2024-03-05-enfant-refuge-corbeau_660x440.jpg 660w, /static/david/2024/2024-03-05-enfant-refuge-corbeau_990x660.jpg 990w, /static/david/2024/2024-03-05-enfant-refuge-corbeau_1320x880.jpg 1320w"
            sizes="min(100vw, calc(100vh * 3024 / 4032))"
            loading="lazy"
            decoding="async"
            alt="Un enfant qui court dans la neige vers un refuge.">
    </a>
    <figcaption>Jamais&nbsp;fatigué.</figcaption>
 </figure>
 <p>Le retour est moins joyeux car il s’agit d’enchainer les efforts et chaque heure qui passe rend la neige plus meuble. À tel point que l’on décide de couper par une piste sur une courte section. Mon évaluation est que la saison de ski est terminée, même une sous-couche bien travaillée ne tiendra pas la semaine qui s’en&nbsp;vient.</p>
 <p>J’aurais aimé faire une boucle un peu plus longue au retour mais il faut savoir s’adapter aux conditions. Le plus important est de terminer sans blessure ni&nbsp;dégoût.</p>
 <p><em>Je commence à imaginer un parcours rapide sur plusieurs jours dans cette forêt que je connais bien. Peut-être qu’une fenêtre se dessine en avril… il faut que je récupère un peu de cardio d’ici&nbsp;là.</em></p>

    
      <nav>
        <p>
          
            <a href="/david/2024/adaptation/"
               title="Liste de tous les articles 2024 associés à cette étiquette"
               rel="tag">#adaptation</a>
          
            <a href="/david/2024/aventure/"
               title="Liste de tous les articles 2024 associés à cette étiquette"
               rel="tag">#aventure</a>
          
            <a href="/david/2024/psychologie/"
               title="Liste de tous les articles 2024 associés à cette étiquette"
               rel="tag">#psychologie</a>
          
          <a href="/david/2024/#tags" title="Liste de toutes les étiquettes 2024">tous ?</a>
        </p>
      </nav>
    
  
    <h2>
      <a href="/david/2024/02/25/" title="Lien permanent vers cet article">Jour&nbsp;2</a> <time datetime="2024-02-25">25 février 2024</time>
    </h2>
--- a/david/2024/dystopie/index.html
+++ b/david/2024/dystopie/index.html
@@ -134,6 +134,50 @@
    </p>
  </nav>
  
    <h2>
      <a href="/david/2024/03/04/" title="Lien permanent vers cet article">Jour&nbsp;1</a> <time datetime="2024-03-04">4 mars 2024</time>
    </h2>
    
 <p>Une réservation de longue date qui s’est transformée en sortie familiale (!), malheureusement nous n’avons pas pu rejoindre le refuge à ski faute de neige suffisante. C’était problématique car j’avais prévu de traîner une bonne partie de l’équipement, ce qui se révélait être un peu plus lourd sur le dos. Bon, aussi, on était partis sur une raclette, ça n’aide&nbsp;pas&nbsp;😅.</p>
 <p>J’avais très peur que le sentier soit peu praticable sans percer à chaque pas, ce qui m’était déjà arrivé dans un tel contexte. Vu le poids du sac, je craignais notamment que ma cheville en cours de réparation refasse le même mouvement en descente… mais nous étions à une poignée de degrés de cet état de la neige pour notre plus grand&nbsp;bonheur.</p>
 <p>Ce n’était pas non plus de tout repos et la récompense d’une lac dégelant à l’arrivée était bien méritée. Il est rare d’avoir ces conditions très douces dans un contexte hivernal, on en avait même oublié de prendre nos&nbsp;tuques&#8239;!</p>
 <p><em>Tests du jour&nbsp;: les barquettes en aluminium pour faire réflecteur de bougies. Efficace. Les bougies longues durées d’Ikea pour faire fondre du fromage. Pas&nbsp;efficace.</em></p>
 <figure>
    <a href="/static/david/2024/2024-03-04-lac-corbeau.jpg"
        title="Cliquer pour une version haute résolution">
        <img
            src="/static/david/2024/2024-03-04-lac-corbeau.jpg"
            width="3024" height="4032"
            srcset="/static/david/2024/2024-03-04-lac-corbeau.jpg 3024w, /static/david/2024/2024-03-04-lac-corbeau_660x440.jpg 660w, /static/david/2024/2024-03-04-lac-corbeau_990x660.jpg 990w, /static/david/2024/2024-03-04-lac-corbeau_1320x880.jpg 1320w"
            sizes="min(100vw, calc(100vh * 3024 / 4032))"
            loading="lazy"
            decoding="async"
            alt="Lac corbeau avec des boulots au premier plan.">
    </a>
    <figcaption>Un décor très minecrafteux&nbsp;(sic).</figcaption>
 </figure>

    
      <nav>
        <p>
          
            <a href="/david/2024/dystopie/"
               title="Liste de tous les articles 2024 associés à cette étiquette"
               rel="tag">#dystopie</a>
          
            <a href="/david/2024/foret/"
               title="Liste de tous les articles 2024 associés à cette étiquette"
               rel="tag">#forêt</a>
          
            <a href="/david/2024/solastalgia/"
               title="Liste de tous les articles 2024 associés à cette étiquette"
               rel="tag">#solastalgia</a>
          
          <a href="/david/2024/#tags" title="Liste de toutes les étiquettes 2024">tous ?</a>
        </p>
      </nav>
    
  
    <h2>
      <a href="/david/2024/02/21/" title="Lien permanent vers cet article">Cinéma</a> <time datetime="2024-02-21">21 février 2024</time>
    </h2>
--- a/david/2024/foret/index.html
+++ b/david/2024/foret/index.html
@@ -134,6 +134,50 @@
    </p>
  </nav>
  
    <h2>
      <a href="/david/2024/03/04/" title="Lien permanent vers cet article">Jour&nbsp;1</a> <time datetime="2024-03-04">4 mars 2024</time>
    </h2>
    
 <p>Une réservation de longue date qui s’est transformée en sortie familiale (!), malheureusement nous n’avons pas pu rejoindre le refuge à ski faute de neige suffisante. C’était problématique car j’avais prévu de traîner une bonne partie de l’équipement, ce qui se révélait être un peu plus lourd sur le dos. Bon, aussi, on était partis sur une raclette, ça n’aide&nbsp;pas&nbsp;😅.</p>
 <p>J’avais très peur que le sentier soit peu praticable sans percer à chaque pas, ce qui m’était déjà arrivé dans un tel contexte. Vu le poids du sac, je craignais notamment que ma cheville en cours de réparation refasse le même mouvement en descente… mais nous étions à une poignée de degrés de cet état de la neige pour notre plus grand&nbsp;bonheur.</p>
 <p>Ce n’était pas non plus de tout repos et la récompense d’une lac dégelant à l’arrivée était bien méritée. Il est rare d’avoir ces conditions très douces dans un contexte hivernal, on en avait même oublié de prendre nos&nbsp;tuques&#8239;!</p>
 <p><em>Tests du jour&nbsp;: les barquettes en aluminium pour faire réflecteur de bougies. Efficace. Les bougies longues durées d’Ikea pour faire fondre du fromage. Pas&nbsp;efficace.</em></p>
 <figure>
    <a href="/static/david/2024/2024-03-04-lac-corbeau.jpg"
        title="Cliquer pour une version haute résolution">
        <img
            src="/static/david/2024/2024-03-04-lac-corbeau.jpg"
            width="3024" height="4032"
            srcset="/static/david/2024/2024-03-04-lac-corbeau.jpg 3024w, /static/david/2024/2024-03-04-lac-corbeau_660x440.jpg 660w, /static/david/2024/2024-03-04-lac-corbeau_990x660.jpg 990w, /static/david/2024/2024-03-04-lac-corbeau_1320x880.jpg 1320w"
            sizes="min(100vw, calc(100vh * 3024 / 4032))"
            loading="lazy"
            decoding="async"
            alt="Lac corbeau avec des boulots au premier plan.">
    </a>
    <figcaption>Un décor très minecrafteux&nbsp;(sic).</figcaption>
 </figure>

    
      <nav>
        <p>
          
            <a href="/david/2024/dystopie/"
               title="Liste de tous les articles 2024 associés à cette étiquette"
               rel="tag">#dystopie</a>
          
            <a href="/david/2024/foret/"
               title="Liste de tous les articles 2024 associés à cette étiquette"
               rel="tag">#forêt</a>
          
            <a href="/david/2024/solastalgia/"
               title="Liste de tous les articles 2024 associés à cette étiquette"
               rel="tag">#solastalgia</a>
          
          <a href="/david/2024/#tags" title="Liste de toutes les étiquettes 2024">tous ?</a>
        </p>
      </nav>
    
  
    <h2>
      <a href="/david/2024/02/25/" title="Lien permanent vers cet article">Jour&nbsp;2</a> <time datetime="2024-02-25">25 février 2024</time>
    </h2>
--- a/david/2024/index.html
+++ b/david/2024/index.html
@@ -201,7 +201,10 @@
    <p>
      <a href="/david/2024/03/01/">Simple</a>, 
      <a href="/david/2024/03/02/">Montre</a>, 
      <a href="/david/2024/03/03/">Permanence</a>.
      <a href="/david/2024/03/03/">Permanence</a>, 
      <a href="/david/2024/03/04/">Jour&nbsp;1</a>, 
      <a href="/david/2024/03/05/">Jour&nbsp;2</a>, 
      <a href="/david/2024/03/06/">Vannerie</a>.
      
    </p>
  
@@ -210,38 +213,39 @@
    <p>
      <a href="/david/2024/accessibilite/" rel="tag">#accessibilité (3)</a>, 
      <a href="/david/2024/accompagnement/" rel="tag">#accompagnement (2)</a>, 
      <a href="/david/2024/adaptation/" rel="tag">#adaptation (1)</a>, 
      <a href="/david/2024/addiction/" rel="tag">#addiction (4)</a>, 
      <a href="/david/2024/apprentissage/" rel="tag">#apprentissage (13)</a>, 
      <a href="/david/2024/aventure/" rel="tag">#aventure (2)</a>, 
      <a href="/david/2024/apprentissage/" rel="tag">#apprentissage (14)</a>, 
      <a href="/david/2024/aventure/" rel="tag">#aventure (3)</a>, 
      <a href="/david/2024/commun/" rel="tag">#commun (8)</a>, 
      <a href="/david/2024/communaute/" rel="tag">#communauté (5)</a>, 
      <a href="/david/2024/deception/" rel="tag">#déception (1)</a>, 
      <a href="/david/2024/decision/" rel="tag">#décision (7)</a>, 
      <a href="/david/2024/dependance/" rel="tag">#dépendance (5)</a>, 
      <a href="/david/2024/documentation/" rel="tag">#documentation (2)</a>, 
      <a href="/david/2024/dystopie/" rel="tag">#dystopie (2)</a>, 
      <a href="/david/2024/dystopie/" rel="tag">#dystopie (3)</a>, 
      <a href="/david/2024/echanges/" rel="tag">#échanges (5)</a>, 
      <a href="/david/2024/ecriture/" rel="tag">#écriture (6)</a>, 
      <a href="/david/2024/equipe/" rel="tag">#équipe (7)</a>, 
      <a href="/david/2024/evolution/" rel="tag">#évolution (7)</a>, 
      <a href="/david/2024/experience/" rel="tag">#expérience (11)</a>, 
      <a href="/david/2024/fediverse/" rel="tag">#fédiverse (1)</a>, 
      <a href="/david/2024/foret/" rel="tag">#forêt (6)</a>, 
      <a href="/david/2024/foret/" rel="tag">#forêt (7)</a>, 
      <a href="/david/2024/gratitude/" rel="tag">#gratitude (3)</a>, 
      <a href="/david/2024/ia/" rel="tag">#IA (3)</a>, 
      <a href="/david/2024/laboratoire/" rel="tag">#laboratoire (3)</a>, 
      <a href="/david/2024/lecture/" rel="tag">#lecture (1)</a>, 
      <a href="/david/2024/opendata/" rel="tag">#opendata (1)</a>, 
      <a href="/david/2024/opensource/" rel="tag">#opensource (7)</a>, 
      <a href="/david/2024/parentalite/" rel="tag">#parentalité (4)</a>, 
      <a href="/david/2024/parentalite/" rel="tag">#parentalité (5)</a>, 
      <a href="/david/2024/partage/" rel="tag">#partage (4)</a>, 
      <a href="/david/2024/parvenir/" rel="tag">#parvenir (2)</a>, 
      <a href="/david/2024/photographie/" rel="tag">#photographie (2)</a>, 
      <a href="/david/2024/poesie/" rel="tag">#poésie (1)</a>, 
      <a href="/david/2024/processus/" rel="tag">#processus (10)</a>, 
      <a href="/david/2024/protopie/" rel="tag">#protopie (6)</a>, 
      <a href="/david/2024/psychologie/" rel="tag">#psychologie (8)</a>, 
      <a href="/david/2024/solastalgia/" rel="tag">#solastalgia (3)</a>, 
      <a href="/david/2024/protopie/" rel="tag">#protopie (7)</a>, 
      <a href="/david/2024/psychologie/" rel="tag">#psychologie (9)</a>, 
      <a href="/david/2024/solastalgia/" rel="tag">#solastalgia (4)</a>, 
      <a href="/david/2024/sport/" rel="tag">#sport (5)</a>, 
      <a href="/david/2024/technique/" rel="tag">#technique (13)</a>, 
      <a href="/david/2024/velo/" rel="tag">#vélo (1)</a>, 
--- a/david/2024/parentalite/index.html
+++ b/david/2024/parentalite/index.html
@@ -134,6 +134,94 @@
    </p>
  </nav>
  
    <h2>
      <a href="/david/2024/03/06/" title="Lien permanent vers cet article">Vannerie</a> <time datetime="2024-03-06">6 mars 2024</time>
    </h2>
    
 <p>L’atelier du jour était une initiation à la vannerie, cette fois-ci avec / pour l’enfant. Depuis le temps qu’il veut m’accompagner, j’ai sauté sur l’occasion lorsqu’une animatrice d’atelier — ancienne enseignante, ça doit jouer&nbsp;— acceptât les personnes de son&nbsp;âge.</p>
 <figure>
    <a href="/static/david/2024/2024-03-06-vannerie-panier.jpg"
        title="Cliquer pour une version haute résolution">
        <img
            src="/static/david/2024/2024-03-06-vannerie-panier.jpg"
            width="4032" height="3024"
            srcset="/static/david/2024/2024-03-06-vannerie-panier.jpg 4032w, /static/david/2024/2024-03-06-vannerie-panier_660x440.jpg 660w, /static/david/2024/2024-03-06-vannerie-panier_990x660.jpg 990w, /static/david/2024/2024-03-06-vannerie-panier_1320x880.jpg 1320w"
            sizes="min(100vw, calc(100vh * 4032 / 3024))"
            loading="lazy"
            decoding="async"
            alt="Un panier en vannerie.">
    </a>
    <figcaption>Un panier en vannerie, ça m’a pris&nbsp;2h30.</figcaption>
 </figure>
 <p>Le <em>twist</em>, c’est que j’ai pu le faire aussi vu que nous étions les seuls présents pour la session au final. Autant dire qu’avec un cours particulier on a pu apprendre encore plus de choses&#8239;! Sur un spectre allant des techniques d’assouplissement à l’appropriation culturelle, on a passé un bon moment d’échanges. J’ai appris que la préparation du frêne noir utilisé dans la vannerie par les Premières Nations prend plusieurs mois, ce qui explique sa rareté (et son&nbsp;prix).</p>
 <figure>
    <a href="/static/david/2024/2024-03-06-vannerie-sac-a-dos.jpg"
        title="Cliquer pour une version haute résolution">
        <img
            src="/static/david/2024/2024-03-06-vannerie-sac-a-dos.jpg"
            width="3024" height="4032"
            srcset="/static/david/2024/2024-03-06-vannerie-sac-a-dos.jpg 3024w, /static/david/2024/2024-03-06-vannerie-sac-a-dos_660x440.jpg 660w, /static/david/2024/2024-03-06-vannerie-sac-a-dos_990x660.jpg 990w, /static/david/2024/2024-03-06-vannerie-sac-a-dos_1320x880.jpg 1320w"
            sizes="min(100vw, calc(100vh * 3024 / 4032))"
            loading="lazy"
            decoding="async"
            alt="Un sac à dos en vannerie.">
    </a>
    <figcaption>Un sac à dos en vannerie sur le dos de&nbsp;l’enfant.</figcaption>
 </figure>
 <p>Toujours cette sensation de créer des objets utiles à partir de pas grand chose et avec un minimum de&nbsp;matériel.</p>
 <a href="#hr-100" title="Lien vers cette section de la page"><hr id="hr-100" /></a>

 <blockquote lang="en">
 <p>Like Stimulus, but <em>a lot</em> smaller and a bit more&nbsp;webcomponenty?</p>
 <p><cite><em><a data-link-domain="github.com" href="https://github.com/johanhalse/musculus">Musculus</a></em></cite></p>
 </blockquote>
 <p>Découverte du jour que je trouve très inspirante. J’avais dans un coin de tête de tester des choses dans cette voie. Réussir à faire le pont entre les deux serait une très bonne combinaison. J’apprécie qu’une solution de test soit proposée, même si elle est légère (en terme de fiabilité) j’en peux plus d’attendre&nbsp;Playwright.</p>
 <a href="#hr-101" title="Lien vers cette section de la page"><hr id="hr-101" /></a>

 <blockquote>
 <p>End the battle. Use <code>infinity</code> to get the highest possible <code>z-index</code> and win&nbsp;forever.</p>
 <p>[…]</p>
 <p>But is <code>infinity</code> really any better than some arbitrarily big value like <code>9999px</code>? Functionally, no. Same end result. But I think <mark>it does help make code more self-documenting,</mark> because <code>infinity</code> conveys intent. It expresses that it’s all about the magnitude, not a specific magic&nbsp;number.</p>
 <p><cite><em><a data-link-domain="codersblock.com" href="https://codersblock.com/blog/playing-with-infinity-in-css/" hreflang="en"
            title="Consultation de l’article (anglais)">Playing with Infinity in CSS</a>
            <a href="/david/cache/2024/1f4e359d100592aee6e46505a40b2a01/" hreflang="en"
                data-tippy data-description="CSS has an infinity constant. When I first learned about this, my brain lit up with all kinds of absurd possibilities. Let’s discuss! There might even be some..."
                data-source="https://codersblock.com/blog/playing-with-infinity-in-css/"
                data-date="2024-03-06"
                data-favicon="https://codersblock.com/favicon-32x32.png"
                data-domain="codersblock.com"
                ><svg xmlns="http://www.w3.org/2000/svg"
                    width="24" height="24" viewBox="0 0 24 24" fill="none"
                    stroke="currentColor" stroke-width="2" stroke-linecap="square"
                    stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle>
                    <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path>
                    <line x1="12" y1="17" x2="12.01" y2="17"></line>
                </svg>
                <span class="sr-only">[archive]</span></a></em></cite></p>
 </blockquote>
 <p>Autre découverte du jour. J’aime bien l’idée de pouvoir évacuer certaines valeurs magiques de manière explicite. J’ai la flemme de tester ce qu’un <code>calc(infinity - 1)</code> donnerait sur un <code>z-index</code>&nbsp;🤭.</p>

    
      <nav>
        <p>
          
            <a href="/david/2024/apprentissage/"
               title="Liste de tous les articles 2024 associés à cette étiquette"
               rel="tag">#apprentissage</a>
          
            <a href="/david/2024/parentalite/"
               title="Liste de tous les articles 2024 associés à cette étiquette"
               rel="tag">#parentalité</a>
          
            <a href="/david/2024/protopie/"
               title="Liste de tous les articles 2024 associés à cette étiquette"
               rel="tag">#protopie</a>
          
          <a href="/david/2024/#tags" title="Liste de toutes les étiquettes 2024">tous ?</a>
        </p>
      </nav>
    
  
    <h2>
      <a href="/david/2024/02/26/" title="Lien permanent vers cet article">Galaxie</a> <time datetime="2024-02-26">26 février 2024</time>
    </h2>
--- a/david/2024/protopie/index.html
+++ b/david/2024/protopie/index.html
@@ -134,6 +134,94 @@
    </p>
  </nav>
  
    <h2>
      <a href="/david/2024/03/06/" title="Lien permanent vers cet article">Vannerie</a> <time datetime="2024-03-06">6 mars 2024</time>
    </h2>
    
 <p>L’atelier du jour était une initiation à la vannerie, cette fois-ci avec / pour l’enfant. Depuis le temps qu’il veut m’accompagner, j’ai sauté sur l’occasion lorsqu’une animatrice d’atelier — ancienne enseignante, ça doit jouer&nbsp;— acceptât les personnes de son&nbsp;âge.</p>
 <figure>
    <a href="/static/david/2024/2024-03-06-vannerie-panier.jpg"
        title="Cliquer pour une version haute résolution">
        <img
            src="/static/david/2024/2024-03-06-vannerie-panier.jpg"
            width="4032" height="3024"
            srcset="/static/david/2024/2024-03-06-vannerie-panier.jpg 4032w, /static/david/2024/2024-03-06-vannerie-panier_660x440.jpg 660w, /static/david/2024/2024-03-06-vannerie-panier_990x660.jpg 990w, /static/david/2024/2024-03-06-vannerie-panier_1320x880.jpg 1320w"
            sizes="min(100vw, calc(100vh * 4032 / 3024))"
            loading="lazy"
            decoding="async"
            alt="Un panier en vannerie.">
    </a>
    <figcaption>Un panier en vannerie, ça m’a pris&nbsp;2h30.</figcaption>
 </figure>
 <p>Le <em>twist</em>, c’est que j’ai pu le faire aussi vu que nous étions les seuls présents pour la session au final. Autant dire qu’avec un cours particulier on a pu apprendre encore plus de choses&#8239;! Sur un spectre allant des techniques d’assouplissement à l’appropriation culturelle, on a passé un bon moment d’échanges. J’ai appris que la préparation du frêne noir utilisé dans la vannerie par les Premières Nations prend plusieurs mois, ce qui explique sa rareté (et son&nbsp;prix).</p>
 <figure>
    <a href="/static/david/2024/2024-03-06-vannerie-sac-a-dos.jpg"
        title="Cliquer pour une version haute résolution">
        <img
            src="/static/david/2024/2024-03-06-vannerie-sac-a-dos.jpg"
            width="3024" height="4032"
            srcset="/static/david/2024/2024-03-06-vannerie-sac-a-dos.jpg 3024w, /static/david/2024/2024-03-06-vannerie-sac-a-dos_660x440.jpg 660w, /static/david/2024/2024-03-06-vannerie-sac-a-dos_990x660.jpg 990w, /static/david/2024/2024-03-06-vannerie-sac-a-dos_1320x880.jpg 1320w"
            sizes="min(100vw, calc(100vh * 3024 / 4032))"
            loading="lazy"
            decoding="async"
            alt="Un sac à dos en vannerie.">
    </a>
    <figcaption>Un sac à dos en vannerie sur le dos de&nbsp;l’enfant.</figcaption>
 </figure>
 <p>Toujours cette sensation de créer des objets utiles à partir de pas grand chose et avec un minimum de&nbsp;matériel.</p>
 <a href="#hr-100" title="Lien vers cette section de la page"><hr id="hr-100" /></a>

 <blockquote lang="en">
 <p>Like Stimulus, but <em>a lot</em> smaller and a bit more&nbsp;webcomponenty?</p>
 <p><cite><em><a data-link-domain="github.com" href="https://github.com/johanhalse/musculus">Musculus</a></em></cite></p>
 </blockquote>
 <p>Découverte du jour que je trouve très inspirante. J’avais dans un coin de tête de tester des choses dans cette voie. Réussir à faire le pont entre les deux serait une très bonne combinaison. J’apprécie qu’une solution de test soit proposée, même si elle est légère (en terme de fiabilité) j’en peux plus d’attendre&nbsp;Playwright.</p>
 <a href="#hr-101" title="Lien vers cette section de la page"><hr id="hr-101" /></a>

 <blockquote>
 <p>End the battle. Use <code>infinity</code> to get the highest possible <code>z-index</code> and win&nbsp;forever.</p>
 <p>[…]</p>
 <p>But is <code>infinity</code> really any better than some arbitrarily big value like <code>9999px</code>? Functionally, no. Same end result. But I think <mark>it does help make code more self-documenting,</mark> because <code>infinity</code> conveys intent. It expresses that it’s all about the magnitude, not a specific magic&nbsp;number.</p>
 <p><cite><em><a data-link-domain="codersblock.com" href="https://codersblock.com/blog/playing-with-infinity-in-css/" hreflang="en"
            title="Consultation de l’article (anglais)">Playing with Infinity in CSS</a>
            <a href="/david/cache/2024/1f4e359d100592aee6e46505a40b2a01/" hreflang="en"
                data-tippy data-description="CSS has an infinity constant. When I first learned about this, my brain lit up with all kinds of absurd possibilities. Let’s discuss! There might even be some..."
                data-source="https://codersblock.com/blog/playing-with-infinity-in-css/"
                data-date="2024-03-06"
                data-favicon="https://codersblock.com/favicon-32x32.png"
                data-domain="codersblock.com"
                ><svg xmlns="http://www.w3.org/2000/svg"
                    width="24" height="24" viewBox="0 0 24 24" fill="none"
                    stroke="currentColor" stroke-width="2" stroke-linecap="square"
                    stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle>
                    <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path>
                    <line x1="12" y1="17" x2="12.01" y2="17"></line>
                </svg>
                <span class="sr-only">[archive]</span></a></em></cite></p>
 </blockquote>
 <p>Autre découverte du jour. J’aime bien l’idée de pouvoir évacuer certaines valeurs magiques de manière explicite. J’ai la flemme de tester ce qu’un <code>calc(infinity - 1)</code> donnerait sur un <code>z-index</code>&nbsp;🤭.</p>

    
      <nav>
        <p>
          
            <a href="/david/2024/apprentissage/"
               title="Liste de tous les articles 2024 associés à cette étiquette"
               rel="tag">#apprentissage</a>
          
            <a href="/david/2024/parentalite/"
               title="Liste de tous les articles 2024 associés à cette étiquette"
               rel="tag">#parentalité</a>
          
            <a href="/david/2024/protopie/"
               title="Liste de tous les articles 2024 associés à cette étiquette"
               rel="tag">#protopie</a>
          
          <a href="/david/2024/#tags" title="Liste de toutes les étiquettes 2024">tous ?</a>
        </p>
      </nav>
    
  
    <h2>
      <a href="/david/2024/02/20/" title="Lien permanent vers cet article">Véhicule</a> <time datetime="2024-02-20">20 février 2024</time>
    </h2>
--- a/david/2024/psychologie/index.html
+++ b/david/2024/psychologie/index.html
@@ -134,6 +134,65 @@
    </p>
  </nav>
  
    <h2>
      <a href="/david/2024/03/05/" title="Lien permanent vers cet article">Jour&nbsp;2</a> <time datetime="2024-03-05">5 mars 2024</time>
    </h2>
    
 <p>On se réveille dans la brume avec le soleil peinant à passer à travers, le lac et la neige ont regelé pendant la nuit. C’est une belle ambiance après une nuit agitée par la chaleur du <del>sauna</del> refuge. Les poêles tirent à fond dans ces endroits pour éviter que des personnes n’arrivent pas à faire démarrer un feu (j’imagine que ça peut être critique) mais ça les rend très inefficaces dans la durée et très chauds dès qu’on met deux buches&nbsp;dedans.</p>
 <figure>
    <a href="/static/david/2024/2024-03-05-lac-corbeau.jpg"
        title="Cliquer pour une version haute résolution">
        <img
            src="/static/david/2024/2024-03-05-lac-corbeau.jpg"
            width="4032" height="3024"
            srcset="/static/david/2024/2024-03-05-lac-corbeau.jpg 4032w, /static/david/2024/2024-03-05-lac-corbeau_660x440.jpg 660w, /static/david/2024/2024-03-05-lac-corbeau_990x660.jpg 990w, /static/david/2024/2024-03-05-lac-corbeau_1320x880.jpg 1320w"
            sizes="min(100vw, calc(100vh * 4032 / 3024))"
            loading="lazy"
            decoding="async"
            alt="Lac corbeau à l’aube.">
    </a>
    <figcaption>De bien jolies couleurs au&nbsp;réveil.</figcaption>
 </figure>
 <p>Cet épisode me confirme encore une fois que les enfants ont des corps de sportifs de très haut niveau. Je suis impatient de pouvoir le charger un peu plus car c’est frustrant de le voir gambader devant de bon matin alors que mes muscles sont à peine réveillés. J’aime bien lorsqu’on va explorer un peu plus loin et que l’on se projette sur ce que l’on pourrait faire l’année&nbsp;suivante.</p>
 <figure>
    <a href="/static/david/2024/2024-03-05-enfant-refuge-corbeau.jpg"
        title="Cliquer pour une version haute résolution">
        <img
            src="/static/david/2024/2024-03-05-enfant-refuge-corbeau.jpg"
            width="3024" height="4032"
            srcset="/static/david/2024/2024-03-05-enfant-refuge-corbeau.jpg 3024w, /static/david/2024/2024-03-05-enfant-refuge-corbeau_660x440.jpg 660w, /static/david/2024/2024-03-05-enfant-refuge-corbeau_990x660.jpg 990w, /static/david/2024/2024-03-05-enfant-refuge-corbeau_1320x880.jpg 1320w"
            sizes="min(100vw, calc(100vh * 3024 / 4032))"
            loading="lazy"
            decoding="async"
            alt="Un enfant qui court dans la neige vers un refuge.">
    </a>
    <figcaption>Jamais&nbsp;fatigué.</figcaption>
 </figure>
 <p>Le retour est moins joyeux car il s’agit d’enchainer les efforts et chaque heure qui passe rend la neige plus meuble. À tel point que l’on décide de couper par une piste sur une courte section. Mon évaluation est que la saison de ski est terminée, même une sous-couche bien travaillée ne tiendra pas la semaine qui s’en&nbsp;vient.</p>
 <p>J’aurais aimé faire une boucle un peu plus longue au retour mais il faut savoir s’adapter aux conditions. Le plus important est de terminer sans blessure ni&nbsp;dégoût.</p>
 <p><em>Je commence à imaginer un parcours rapide sur plusieurs jours dans cette forêt que je connais bien. Peut-être qu’une fenêtre se dessine en avril… il faut que je récupère un peu de cardio d’ici&nbsp;là.</em></p>

    
      <nav>
        <p>
          
            <a href="/david/2024/adaptation/"
               title="Liste de tous les articles 2024 associés à cette étiquette"
               rel="tag">#adaptation</a>
          
            <a href="/david/2024/aventure/"
               title="Liste de tous les articles 2024 associés à cette étiquette"
               rel="tag">#aventure</a>
          
            <a href="/david/2024/psychologie/"
               title="Liste de tous les articles 2024 associés à cette étiquette"
               rel="tag">#psychologie</a>
          
          <a href="/david/2024/#tags" title="Liste de toutes les étiquettes 2024">tous ?</a>
        </p>
      </nav>
    
  
    <h2>
      <a href="/david/2024/02/29/" title="Lien permanent vers cet article">Wikipédia</a> <time datetime="2024-02-29">29 février 2024</time>
    </h2>
--- a/david/2024/solastalgia/index.html
+++ b/david/2024/solastalgia/index.html
@@ -134,6 +134,50 @@
    </p>
  </nav>
  
    <h2>
      <a href="/david/2024/03/04/" title="Lien permanent vers cet article">Jour&nbsp;1</a> <time datetime="2024-03-04">4 mars 2024</time>
    </h2>
    
 <p>Une réservation de longue date qui s’est transformée en sortie familiale (!), malheureusement nous n’avons pas pu rejoindre le refuge à ski faute de neige suffisante. C’était problématique car j’avais prévu de traîner une bonne partie de l’équipement, ce qui se révélait être un peu plus lourd sur le dos. Bon, aussi, on était partis sur une raclette, ça n’aide&nbsp;pas&nbsp;😅.</p>
 <p>J’avais très peur que le sentier soit peu praticable sans percer à chaque pas, ce qui m’était déjà arrivé dans un tel contexte. Vu le poids du sac, je craignais notamment que ma cheville en cours de réparation refasse le même mouvement en descente… mais nous étions à une poignée de degrés de cet état de la neige pour notre plus grand&nbsp;bonheur.</p>
 <p>Ce n’était pas non plus de tout repos et la récompense d’une lac dégelant à l’arrivée était bien méritée. Il est rare d’avoir ces conditions très douces dans un contexte hivernal, on en avait même oublié de prendre nos&nbsp;tuques&#8239;!</p>
 <p><em>Tests du jour&nbsp;: les barquettes en aluminium pour faire réflecteur de bougies. Efficace. Les bougies longues durées d’Ikea pour faire fondre du fromage. Pas&nbsp;efficace.</em></p>
 <figure>
    <a href="/static/david/2024/2024-03-04-lac-corbeau.jpg"
        title="Cliquer pour une version haute résolution">
        <img
            src="/static/david/2024/2024-03-04-lac-corbeau.jpg"
            width="3024" height="4032"
            srcset="/static/david/2024/2024-03-04-lac-corbeau.jpg 3024w, /static/david/2024/2024-03-04-lac-corbeau_660x440.jpg 660w, /static/david/2024/2024-03-04-lac-corbeau_990x660.jpg 990w, /static/david/2024/2024-03-04-lac-corbeau_1320x880.jpg 1320w"
            sizes="min(100vw, calc(100vh * 3024 / 4032))"
            loading="lazy"
            decoding="async"
            alt="Lac corbeau avec des boulots au premier plan.">
    </a>
    <figcaption>Un décor très minecrafteux&nbsp;(sic).</figcaption>
 </figure>

    
      <nav>
        <p>
          
            <a href="/david/2024/dystopie/"
               title="Liste de tous les articles 2024 associés à cette étiquette"
               rel="tag">#dystopie</a>
          
            <a href="/david/2024/foret/"
               title="Liste de tous les articles 2024 associés à cette étiquette"
               rel="tag">#forêt</a>
          
            <a href="/david/2024/solastalgia/"
               title="Liste de tous les articles 2024 associés à cette étiquette"
               rel="tag">#solastalgia</a>
          
          <a href="/david/2024/#tags" title="Liste de toutes les étiquettes 2024">tous ?</a>
        </p>
      </nav>
    
  
    <h2>
      <a href="/david/2024/02/28/" title="Lien permanent vers cet article">Dérèglement</a> <time datetime="2024-02-28">28 février 2024</time>
    </h2>
--- a/david/blogroll/index.html
+++ b/david/blogroll/index.html
@@ -226,32 +226,32 @@
      </dl>
    <dl>
        <dt>
          <a href="https://www.la-grange.net/2024/02/20/reve">rêve</a>,
          20-02-2024
          <a href="https://www.la-grange.net/2024/02/21/entre-travail">entre-travail</a>,
          21-02-2024
        </dt>
        <dd>
          Cupertino, États-Unis, 15 février 2024 Après le Têt, je lui rappellerai que parfos les choses s'accumulent dans la vie sans faire d'édifices. — Parfum de pagode, Anna Moï, urn:isbn:978-2-7526-0363-0 Rêve de la nuit dernière : Je suis un artiste photographe. On me demande une œuvre pour une exposition sur le thème de la photographie et du rapport du spectateur à la photographie dans les…
          Takinogawa, Japon, 21 février 2024 Vous quittez Hanoi en contournant le temple de la Littérature. Aucun itinéraire n'a été choisi au préalable, mais tout semble y converger. Et puis vous êtres encore somnolent, et l'aube se lève à peine. — Parfum de pagode, Anna Moï, urn:isbn:978-2-7526-0363-0 J'aime les jours de pluie. Nous prenons le métro pour aller à l'école et parfois je prends le temps de…
          — <a href="https://www.la-grange.net/">Karl Dubost</a>
        </dd>
      </dl>
    <dl>
        <dt>
          <a href="https://n.survol.fr/n/le-monde-tel-quil-aurait-pu-etre-2">Le monde tel qu’il aurait pu être</a>,
          <a href="https://www.la-grange.net/2024/02/20/reve">rêve</a>,
          20-02-2024
        </dt>
        <dd>
          J’ai arrêté cette série de billets très rapidement. J’y tiens. Je veux recréer de l’utopie et penser plus au monde possible qu’à celui qu’on est en train de construire. Le problème c’est que ces billets sont viciés à la base. Ils ne fonctionnent que par contraste avec ce qui est fait, ou pas fait, aujourd’hui. […]
          — <a href="https://n.survol.fr/">Éric D.</a>
          Cupertino, États-Unis, 15 février 2024 Après le Têt, je lui rappellerai que parfos les choses s'accumulent dans la vie sans faire d'édifices. — Parfum de pagode, Anna Moï, urn:isbn:978-2-7526-0363-0 Rêve de la nuit dernière : Je suis un artiste photographe. On me demande une œuvre pour une exposition sur le thème de la photographie et du rapport du spectateur à la photographie dans les…
          — <a href="https://www.la-grange.net/">Karl Dubost</a>
        </dd>
      </dl>
    <dl>
        <dt>
          <a href="https://www.la-grange.net/2024/02/19/crapaud">crapaud</a>,
          19-02-2024
          <a href="https://n.survol.fr/n/le-monde-tel-quil-aurait-pu-etre-2">Le monde tel qu’il aurait pu être</a>,
          20-02-2024
        </dt>
        <dd>
          Komagome, Japon, 18 février 2024 De grands saladiers à moitié remplis de jus de coco concentré, de fleurs de cocotier d'eau coupées en cubes, de longans séchés et réhydratés, de noix de ginkgo avoisinent les récipients de compote chaude. — Parfum de pagode, Anna Moï, urn:isbn:978-2-7526-0363-0 18:51. Une jolie rencontre nocturne au cœur de la ville alors que nous rentrions d'un dîner simple chez…
          — <a href="https://www.la-grange.net/">Karl Dubost</a>
          J’ai arrêté cette série de billets très rapidement. J’y tiens. Je veux recréer de l’utopie et penser plus au monde possible qu’à celui qu’on est en train de construire. Le problème c’est que ces billets sont viciés à la base. Ils ne fonctionnent que par contraste avec ce qui est fait, ou pas fait, aujourd’hui. […]
          — <a href="https://n.survol.fr/">Éric D.</a>
        </dd>
      </dl>
    <dl>
--- a/david/index.html
+++ b/david/index.html
@@ -143,6 +143,9 @@
  <h2>Publications 2024</h2>
  <p>Liste des publications récentes en ordre anté-chronologique :</p>
  <p>
    <a href="/david/2024/03/06/">Vannerie</a>,
    <a href="/david/2024/03/05/">Jour&nbsp;2</a>,
    <a href="/david/2024/03/04/">Jour&nbsp;1</a>,
    <a href="/david/2024/03/03/">Permanence</a>,
    <a href="/david/2024/03/02/">Montre</a>,
    <a href="/david/2024/03/01/">Simple</a>,
@@ -213,38 +216,39 @@
  <p>
    <a href="/david/2024/accessibilite/" rel="tag">#accessibilité (3)</a>,
    <a href="/david/2024/accompagnement/" rel="tag">#accompagnement (2)</a>,
    <a href="/david/2024/adaptation/" rel="tag">#adaptation (1)</a>,
    <a href="/david/2024/addiction/" rel="tag">#addiction (4)</a>,
    <a href="/david/2024/apprentissage/" rel="tag">#apprentissage (13)</a>,
    <a href="/david/2024/aventure/" rel="tag">#aventure (2)</a>,
    <a href="/david/2024/apprentissage/" rel="tag">#apprentissage (14)</a>,
    <a href="/david/2024/aventure/" rel="tag">#aventure (3)</a>,
    <a href="/david/2024/commun/" rel="tag">#commun (8)</a>,
    <a href="/david/2024/communaute/" rel="tag">#communauté (5)</a>,
    <a href="/david/2024/deception/" rel="tag">#déception (1)</a>,
    <a href="/david/2024/decision/" rel="tag">#décision (7)</a>,
    <a href="/david/2024/dependance/" rel="tag">#dépendance (5)</a>,
    <a href="/david/2024/documentation/" rel="tag">#documentation (2)</a>,
    <a href="/david/2024/dystopie/" rel="tag">#dystopie (2)</a>,
    <a href="/david/2024/dystopie/" rel="tag">#dystopie (3)</a>,
    <a href="/david/2024/echanges/" rel="tag">#échanges (5)</a>,
    <a href="/david/2024/ecriture/" rel="tag">#écriture (6)</a>,
    <a href="/david/2024/equipe/" rel="tag">#équipe (7)</a>,
    <a href="/david/2024/evolution/" rel="tag">#évolution (7)</a>,
    <a href="/david/2024/experience/" rel="tag">#expérience (11)</a>,
    <a href="/david/2024/fediverse/" rel="tag">#fédiverse (1)</a>,
    <a href="/david/2024/foret/" rel="tag">#forêt (6)</a>,
    <a href="/david/2024/foret/" rel="tag">#forêt (7)</a>,
    <a href="/david/2024/gratitude/" rel="tag">#gratitude (3)</a>,
    <a href="/david/2024/ia/" rel="tag">#IA (3)</a>,
    <a href="/david/2024/laboratoire/" rel="tag">#laboratoire (3)</a>,
    <a href="/david/2024/lecture/" rel="tag">#lecture (1)</a>,
    <a href="/david/2024/opendata/" rel="tag">#opendata (1)</a>,
    <a href="/david/2024/opensource/" rel="tag">#opensource (7)</a>,
    <a href="/david/2024/parentalite/" rel="tag">#parentalité (4)</a>,
    <a href="/david/2024/parentalite/" rel="tag">#parentalité (5)</a>,
    <a href="/david/2024/partage/" rel="tag">#partage (4)</a>,
    <a href="/david/2024/parvenir/" rel="tag">#parvenir (2)</a>,
    <a href="/david/2024/photographie/" rel="tag">#photographie (2)</a>,
    <a href="/david/2024/poesie/" rel="tag">#poésie (1)</a>,
    <a href="/david/2024/processus/" rel="tag">#processus (10)</a>,
    <a href="/david/2024/protopie/" rel="tag">#protopie (6)</a>,
    <a href="/david/2024/psychologie/" rel="tag">#psychologie (8)</a>,
    <a href="/david/2024/solastalgia/" rel="tag">#solastalgia (3)</a>,
    <a href="/david/2024/protopie/" rel="tag">#protopie (7)</a>,
    <a href="/david/2024/psychologie/" rel="tag">#psychologie (9)</a>,
    <a href="/david/2024/solastalgia/" rel="tag">#solastalgia (4)</a>,
    <a href="/david/2024/sport/" rel="tag">#sport (5)</a>,
    <a href="/david/2024/technique/" rel="tag">#technique (13)</a>,
    <a href="/david/2024/velo/" rel="tag">#vélo (1)</a>,
--- a/david/log/index.xml
+++ b/david/log/index.xml
@@ -6,13 +6,138 @@
    <link href="https://larlet.fr/david/" rel="alternate" type="text/html" />
    <link href="https://larlet.fr/david/log/" rel="self" />
    <id>https://larlet.fr/david/</id>
    <updated>2024-03-04T12:00:00+01:00</updated>
    <updated>2024-03-07T12:00:00+01:00</updated>
    <author>
        <name>David Larlet</name>
        <uri>https://larlet.fr/david/</uri>
    </author>
    <rights>Copyright (c) 2004-2024, David Larlet</rights>
    
        <entry xml:lang="fr">
            <title type="html">Vannerie</title>
            <link href="https://larlet.fr/david/2024/03/06/" rel="alternate" type="text/html" />
            <updated>2024-03-06T12:00:00+01:00</updated>
            <id>https://larlet.fr/david/2024/03/06/</id>
            <summary type="html">
 &lt;p&gt;L’atelier du jour était une initiation à la vannerie, cette fois-ci avec / pour l’enfant. Depuis le temps qu’il veut m’accompagner, j’ai sauté sur l’occasion lorsqu’une animatrice d’atelier — ancienne enseignante, ça doit jouer&amp;nbsp;— acceptât les personnes de son&amp;nbsp;âge.&lt;/p&gt;
 &lt;figure&gt;
    &lt;a href=&quot;https://larlet.fr/static/david/2024/2024-03-06-vannerie-panier.jpg&quot;
        title=&quot;Cliquer pour une version haute résolution&quot;&gt;
        &lt;img
            src=&quot;https://larlet.fr/static/david/2024/2024-03-06-vannerie-panier.jpg&quot;
            width=&quot;4032&quot; height=&quot;3024&quot;
            srcset=&quot;/static/david/2024/2024-03-06-vannerie-panier.jpg 4032w, /static/david/2024/2024-03-06-vannerie-panier_660x440.jpg 660w, /static/david/2024/2024-03-06-vannerie-panier_990x660.jpg 990w, /static/david/2024/2024-03-06-vannerie-panier_1320x880.jpg 1320w&quot;
            sizes=&quot;min(100vw, calc(100vh * 4032 / 3024))&quot;
            loading=&quot;lazy&quot;
            decoding=&quot;async&quot;
            alt=&quot;Un panier en vannerie.&quot;&gt;
    &lt;/a&gt;
    &lt;figcaption&gt;Un panier en vannerie, ça m’a pris&amp;nbsp;2h30.&lt;/figcaption&gt;
 &lt;/figure&gt;
 &lt;p&gt;Le &lt;em&gt;twist&lt;/em&gt;, c’est que j’ai pu le faire aussi vu que nous étions les seuls présents pour la session au final. Autant dire qu’avec un cours particulier on a pu apprendre encore plus de choses&amp;#8239;! Sur un spectre allant des techniques d’assouplissement à l’appropriation culturelle, on a passé un bon moment d’échanges. J’ai appris que la préparation du frêne noir utilisé dans la vannerie par les Premières Nations prend plusieurs mois, ce qui explique sa rareté (et son&amp;nbsp;prix).&lt;/p&gt;
 &lt;figure&gt;
    &lt;a href=&quot;https://larlet.fr/static/david/2024/2024-03-06-vannerie-sac-a-dos.jpg&quot;
        title=&quot;Cliquer pour une version haute résolution&quot;&gt;
        &lt;img
            src=&quot;https://larlet.fr/static/david/2024/2024-03-06-vannerie-sac-a-dos.jpg&quot;
            width=&quot;3024&quot; height=&quot;4032&quot;
            srcset=&quot;/static/david/2024/2024-03-06-vannerie-sac-a-dos.jpg 3024w, /static/david/2024/2024-03-06-vannerie-sac-a-dos_660x440.jpg 660w, /static/david/2024/2024-03-06-vannerie-sac-a-dos_990x660.jpg 990w, /static/david/2024/2024-03-06-vannerie-sac-a-dos_1320x880.jpg 1320w&quot;
            sizes=&quot;min(100vw, calc(100vh * 3024 / 4032))&quot;
            loading=&quot;lazy&quot;
            decoding=&quot;async&quot;
            alt=&quot;Un sac à dos en vannerie.&quot;&gt;
    &lt;/a&gt;
    &lt;figcaption&gt;Un sac à dos en vannerie sur le dos de&amp;nbsp;l’enfant.&lt;/figcaption&gt;
 &lt;/figure&gt;
 &lt;p&gt;Toujours cette sensation de créer des objets utiles à partir de pas grand chose et avec un minimum de&amp;nbsp;matériel.&lt;/p&gt;
 &lt;hr /&gt;

 &lt;blockquote lang=&quot;en&quot;&gt;
 &lt;p&gt;Like Stimulus, but &lt;em&gt;a lot&lt;/em&gt; smaller and a bit more&amp;nbsp;webcomponenty?&lt;/p&gt;
 &lt;p&gt;&lt;cite&gt;&lt;em&gt;&lt;a href=&quot;https://github.com/johanhalse/musculus&quot;&gt;Musculus&lt;/a&gt;&lt;/em&gt;&lt;/cite&gt;&lt;/p&gt;
 &lt;/blockquote&gt;
 &lt;p&gt;Découverte du jour que je trouve très inspirante. J’avais dans un coin de tête de tester des choses dans cette voie. Réussir à faire le pont entre les deux serait une très bonne combinaison. J’apprécie qu’une solution de test soit proposée, même si elle est légère (en terme de fiabilité) j’en peux plus d’attendre&amp;nbsp;Playwright.&lt;/p&gt;
 &lt;hr /&gt;

 &lt;blockquote&gt;
 &lt;p&gt;End the battle. Use &lt;code&gt;infinity&lt;/code&gt; to get the highest possible &lt;code&gt;z-index&lt;/code&gt; and win&amp;nbsp;forever.&lt;/p&gt;
 &lt;p&gt;[…]&lt;/p&gt;
 &lt;p&gt;But is &lt;code&gt;infinity&lt;/code&gt; really any better than some arbitrarily big value like &lt;code&gt;9999px&lt;/code&gt;? Functionally, no. Same end result. But I think &lt;mark&gt;it does help make code more self-documenting,&lt;/mark&gt; because &lt;code&gt;infinity&lt;/code&gt; conveys intent. It expresses that it’s all about the magnitude, not a specific magic&amp;nbsp;number.&lt;/p&gt;
 &lt;p&gt;&lt;cite&gt;&lt;em&gt;&lt;a href=&quot;https://codersblock.com/blog/playing-with-infinity-in-css/&quot;&gt;Playing with Infinity in&amp;nbsp;CSS&lt;/a&gt;&lt;/em&gt;&lt;/cite&gt;&lt;/p&gt;
 &lt;/blockquote&gt;
 &lt;p&gt;Autre découverte du jour. J’aime bien l’idée de pouvoir évacuer certaines valeurs magiques de manière explicite. J’ai la flemme de tester ce qu’un &lt;code&gt;calc(infinity - 1)&lt;/code&gt; donnerait sur un &lt;code&gt;z-index&lt;/code&gt;&amp;nbsp;🤭.&lt;/p&gt;
 &lt;nav&gt;&lt;p&gt;&lt;a href=&quot;https://larlet.fr/david/2024/apprentissage/&quot;&gt;#apprentissage&lt;/a&gt; &lt;a href=&quot;https://larlet.fr/david/2024/parentalite/&quot;&gt;#parentalité&lt;/a&gt; &lt;a href=&quot;https://larlet.fr/david/2024/protopie/&quot;&gt;#protopie&lt;/a&gt;&lt;/p&gt;&lt;/nav&gt;&lt;hr/&gt;&lt;p&gt;&lt;a href=&quot;mailto:david@larlet.fr&quot;&gt;Réagir ?&lt;/a&gt;&lt;/p&gt;</summary>
        </entry>
    
        <entry xml:lang="fr">
            <title type="html">Jour&amp;nbsp;2</title>
            <link href="https://larlet.fr/david/2024/03/05/" rel="alternate" type="text/html" />
            <updated>2024-03-05T12:00:00+01:00</updated>
            <id>https://larlet.fr/david/2024/03/05/</id>
            <summary type="html">
 &lt;p&gt;On se réveille dans la brume avec le soleil peinant à passer à travers, le lac et la neige ont regelé pendant la nuit. C’est une belle ambiance après une nuit agitée par la chaleur du &lt;del&gt;sauna&lt;/del&gt; refuge. Les poêles tirent à fond dans ces endroits pour éviter que des personnes n’arrivent pas à faire démarrer un feu (j’imagine que ça peut être critique) mais ça les rend très inefficaces dans la durée et très chauds dès qu’on met deux buches&amp;nbsp;dedans.&lt;/p&gt;
 &lt;figure&gt;
    &lt;a href=&quot;https://larlet.fr/static/david/2024/2024-03-05-lac-corbeau.jpg&quot;
        title=&quot;Cliquer pour une version haute résolution&quot;&gt;
        &lt;img
            src=&quot;https://larlet.fr/static/david/2024/2024-03-05-lac-corbeau.jpg&quot;
            width=&quot;4032&quot; height=&quot;3024&quot;
            srcset=&quot;/static/david/2024/2024-03-05-lac-corbeau.jpg 4032w, /static/david/2024/2024-03-05-lac-corbeau_660x440.jpg 660w, /static/david/2024/2024-03-05-lac-corbeau_990x660.jpg 990w, /static/david/2024/2024-03-05-lac-corbeau_1320x880.jpg 1320w&quot;
            sizes=&quot;min(100vw, calc(100vh * 4032 / 3024))&quot;
            loading=&quot;lazy&quot;
            decoding=&quot;async&quot;
            alt=&quot;Lac corbeau à l’aube.&quot;&gt;
    &lt;/a&gt;
    &lt;figcaption&gt;De bien jolies couleurs au&amp;nbsp;réveil.&lt;/figcaption&gt;
 &lt;/figure&gt;
 &lt;p&gt;Cet épisode me confirme encore une fois que les enfants ont des corps de sportifs de très haut niveau. Je suis impatient de pouvoir le charger un peu plus car c’est frustrant de le voir gambader devant de bon matin alors que mes muscles sont à peine réveillés. J’aime bien lorsqu’on va explorer un peu plus loin et que l’on se projette sur ce que l’on pourrait faire l’année&amp;nbsp;suivante.&lt;/p&gt;
 &lt;figure&gt;
    &lt;a href=&quot;https://larlet.fr/static/david/2024/2024-03-05-enfant-refuge-corbeau.jpg&quot;
        title=&quot;Cliquer pour une version haute résolution&quot;&gt;
        &lt;img
            src=&quot;https://larlet.fr/static/david/2024/2024-03-05-enfant-refuge-corbeau.jpg&quot;
            width=&quot;3024&quot; height=&quot;4032&quot;
            srcset=&quot;/static/david/2024/2024-03-05-enfant-refuge-corbeau.jpg 3024w, /static/david/2024/2024-03-05-enfant-refuge-corbeau_660x440.jpg 660w, /static/david/2024/2024-03-05-enfant-refuge-corbeau_990x660.jpg 990w, /static/david/2024/2024-03-05-enfant-refuge-corbeau_1320x880.jpg 1320w&quot;
            sizes=&quot;min(100vw, calc(100vh * 3024 / 4032))&quot;
            loading=&quot;lazy&quot;
            decoding=&quot;async&quot;
            alt=&quot;Un enfant qui court dans la neige vers un refuge.&quot;&gt;
    &lt;/a&gt;
    &lt;figcaption&gt;Jamais&amp;nbsp;fatigué.&lt;/figcaption&gt;
 &lt;/figure&gt;
 &lt;p&gt;Le retour est moins joyeux car il s’agit d’enchainer les efforts et chaque heure qui passe rend la neige plus meuble. À tel point que l’on décide de couper par une piste sur une courte section. Mon évaluation est que la saison de ski est terminée, même une sous-couche bien travaillée ne tiendra pas la semaine qui s’en&amp;nbsp;vient.&lt;/p&gt;
 &lt;p&gt;J’aurais aimé faire une boucle un peu plus longue au retour mais il faut savoir s’adapter aux conditions. Le plus important est de terminer sans blessure ni&amp;nbsp;dégoût.&lt;/p&gt;
 &lt;p&gt;&lt;em&gt;Je commence à imaginer un parcours rapide sur plusieurs jours dans cette forêt que je connais bien. Peut-être qu’une fenêtre se dessine en avril… il faut que je récupère un peu de cardio d’ici&amp;nbsp;là.&lt;/em&gt;&lt;/p&gt;
 &lt;nav&gt;&lt;p&gt;&lt;a href=&quot;https://larlet.fr/david/2024/adaptation/&quot;&gt;#adaptation&lt;/a&gt; &lt;a href=&quot;https://larlet.fr/david/2024/aventure/&quot;&gt;#aventure&lt;/a&gt; &lt;a href=&quot;https://larlet.fr/david/2024/psychologie/&quot;&gt;#psychologie&lt;/a&gt;&lt;/p&gt;&lt;/nav&gt;&lt;hr/&gt;&lt;p&gt;&lt;a href=&quot;mailto:david@larlet.fr&quot;&gt;Réagir ?&lt;/a&gt;&lt;/p&gt;</summary>
        </entry>
    
        <entry xml:lang="fr">
            <title type="html">Jour&amp;nbsp;1</title>
            <link href="https://larlet.fr/david/2024/03/04/" rel="alternate" type="text/html" />
            <updated>2024-03-04T12:00:00+01:00</updated>
            <id>https://larlet.fr/david/2024/03/04/</id>
            <summary type="html">
 &lt;p&gt;Une réservation de longue date qui s’est transformée en sortie familiale (!), malheureusement nous n’avons pas pu rejoindre le refuge à ski faute de neige suffisante. C’était problématique car j’avais prévu de traîner une bonne partie de l’équipement, ce qui se révélait être un peu plus lourd sur le dos. Bon, aussi, on était partis sur une raclette, ça n’aide&amp;nbsp;pas&amp;nbsp;😅.&lt;/p&gt;
 &lt;p&gt;J’avais très peur que le sentier soit peu praticable sans percer à chaque pas, ce qui m’était déjà arrivé dans un tel contexte. Vu le poids du sac, je craignais notamment que ma cheville en cours de réparation refasse le même mouvement en descente… mais nous étions à une poignée de degrés de cet état de la neige pour notre plus grand&amp;nbsp;bonheur.&lt;/p&gt;
 &lt;p&gt;Ce n’était pas non plus de tout repos et la récompense d’une lac dégelant à l’arrivée était bien méritée. Il est rare d’avoir ces conditions très douces dans un contexte hivernal, on en avait même oublié de prendre nos&amp;nbsp;tuques&amp;#8239;!&lt;/p&gt;
 &lt;p&gt;&lt;em&gt;Tests du jour&amp;nbsp;: les barquettes en aluminium pour faire réflecteur de bougies. Efficace. Les bougies longues durées d’Ikea pour faire fondre du fromage. Pas&amp;nbsp;efficace.&lt;/em&gt;&lt;/p&gt;
 &lt;figure&gt;
    &lt;a href=&quot;https://larlet.fr/static/david/2024/2024-03-04-lac-corbeau.jpg&quot;
        title=&quot;Cliquer pour une version haute résolution&quot;&gt;
        &lt;img
            src=&quot;https://larlet.fr/static/david/2024/2024-03-04-lac-corbeau.jpg&quot;
            width=&quot;3024&quot; height=&quot;4032&quot;
            srcset=&quot;/static/david/2024/2024-03-04-lac-corbeau.jpg 3024w, /static/david/2024/2024-03-04-lac-corbeau_660x440.jpg 660w, /static/david/2024/2024-03-04-lac-corbeau_990x660.jpg 990w, /static/david/2024/2024-03-04-lac-corbeau_1320x880.jpg 1320w&quot;
            sizes=&quot;min(100vw, calc(100vh * 3024 / 4032))&quot;
            loading=&quot;lazy&quot;
            decoding=&quot;async&quot;
            alt=&quot;Lac corbeau avec des boulots au premier plan.&quot;&gt;
    &lt;/a&gt;
    &lt;figcaption&gt;Un décor très minecrafteux&amp;nbsp;(sic).&lt;/figcaption&gt;
 &lt;/figure&gt;
 &lt;nav&gt;&lt;p&gt;&lt;a href=&quot;https://larlet.fr/david/2024/dystopie/&quot;&gt;#dystopie&lt;/a&gt; &lt;a href=&quot;https://larlet.fr/david/2024/foret/&quot;&gt;#forêt&lt;/a&gt; &lt;a href=&quot;https://larlet.fr/david/2024/solastalgia/&quot;&gt;#solastalgia&lt;/a&gt;&lt;/p&gt;&lt;/nav&gt;&lt;hr/&gt;&lt;p&gt;&lt;a href=&quot;mailto:david@larlet.fr&quot;&gt;Réagir ?&lt;/a&gt;&lt;/p&gt;</summary>
        </entry>
    
        <entry xml:lang="fr">
            <title type="html">Permanence</title>
            <link href="https://larlet.fr/david/2024/03/03/" rel="alternate" type="text/html" />
@@ -1020,119 +1145,4 @@ etc.&lt;/p&gt;
 &lt;nav&gt;&lt;p&gt;&lt;a href=&quot;https://larlet.fr/david/2024/communaute/&quot;&gt;#communauté&lt;/a&gt; &lt;a href=&quot;https://larlet.fr/david/2024/equipe/&quot;&gt;#équipe&lt;/a&gt; &lt;a href=&quot;https://larlet.fr/david/2024/lecture/&quot;&gt;#lecture&lt;/a&gt;&lt;/p&gt;&lt;/nav&gt;&lt;hr/&gt;&lt;p&gt;&lt;a href=&quot;mailto:david@larlet.fr&quot;&gt;Réagir ?&lt;/a&gt;&lt;/p&gt;</summary>
        </entry>
    
        <entry xml:lang="fr">
            <title type="html">Jeu</title>
            <link href="https://larlet.fr/david/2024/02/05/" rel="alternate" type="text/html" />
            <updated>2024-02-05T12:00:00+01:00</updated>
            <id>https://larlet.fr/david/2024/02/05/</id>
            <summary type="html">
 &lt;p&gt;Dans la même&amp;nbsp;journée&amp;nbsp;:&lt;/p&gt;

 &lt;blockquote lang=&quot;en&quot;&gt;
 &lt;p&gt;&lt;mark&gt;Built like a video&amp;nbsp;game&lt;/mark&gt;&lt;/p&gt;
 &lt;p&gt;Designed to perform smoothly at 60&amp;nbsp;frames per second, our tool disappears and you can focus on what matters: working with your&amp;nbsp;data.&lt;/p&gt;
 &lt;p&gt;&lt;cite&gt;&lt;em&gt;&lt;a href=&quot;https://www.quadratichq.com/&quot;&gt;quadratic&lt;/a&gt;&lt;/em&gt;&lt;/cite&gt;&lt;/p&gt;
 &lt;/blockquote&gt;
 &lt;p&gt;Puis&amp;nbsp;:&lt;/p&gt;

 &lt;blockquote lang=&quot;en&quot;&gt;
 &lt;p&gt;&lt;mark&gt;Built like a video&amp;nbsp;game&lt;/mark&gt;&lt;/p&gt;
 &lt;p&gt;Zed’s breakthrough performance starts with our GPUI framework, a new way to build 2D user interfaces. GPUI rasterizes the entire window on the GPU, just like a 3D video game. The result? Fast, reliable, and smooth delivery of pixels on every&amp;nbsp;frame.&lt;/p&gt;
 &lt;p&gt;&lt;cite&gt;&lt;em&gt;&lt;a href=&quot;https://zed.dev/&quot;&gt;Zed&lt;/a&gt;&lt;/em&gt;&lt;/cite&gt;&lt;/p&gt;
 &lt;/blockquote&gt;
 &lt;p&gt;Intéressant comme coïncidence&amp;nbsp;commerciale.&lt;/p&gt;
 &lt;hr /&gt;
 &lt;p&gt;J’ai réussi à trottiner 3&amp;#8239;km aujourd’hui, à vitesse très réduite et en étant strapé. C’est une première après 4&amp;nbsp;semaines &lt;a href=&quot;https://larlet.fr/david/2024/01/09/&quot;&gt;de repos&lt;/a&gt;. Il s’agit de reculer maintenant au maximum le moment où je vais me retordre cette cheville. Afin de réduire ce risque, j’hésite à repartir sur du &lt;em&gt;barefoot&lt;/em&gt; car le mollet a aussi souffert pendant la torsion. Puis bon, il fait encore un peu&amp;nbsp;frais…&lt;/p&gt;
 &lt;p&gt;Il y a cette nostalgie des sorties longues à Tokyo, en étant &lt;a href=&quot;https://larlet.fr/david/thoughts/#barefoot&quot;&gt;quasiment pieds nus&lt;/a&gt;. Si j’étais joueur, j’appellerais ça &lt;em&gt;bearfoot&lt;/em&gt; dans mon contexte&amp;nbsp;actuel.&lt;/p&gt;
 &lt;nav&gt;&lt;p&gt;&lt;a href=&quot;https://larlet.fr/david/2024/experience/&quot;&gt;#expérience&lt;/a&gt; &lt;a href=&quot;https://larlet.fr/david/2024/psychologie/&quot;&gt;#psychologie&lt;/a&gt; &lt;a href=&quot;https://larlet.fr/david/2024/technique/&quot;&gt;#technique&lt;/a&gt;&lt;/p&gt;&lt;/nav&gt;&lt;hr/&gt;&lt;p&gt;&lt;a href=&quot;mailto:david@larlet.fr&quot;&gt;Réagir ?&lt;/a&gt;&lt;/p&gt;</summary>
        </entry>
    
        <entry xml:lang="fr">
            <title type="html">Tooltipopover</title>
            <link href="https://larlet.fr/david/2024/02/04/" rel="alternate" type="text/html" />
            <updated>2024-02-04T12:00:00+01:00</updated>
            <id>https://larlet.fr/david/2024/02/04/</id>
            <summary type="html">

 &lt;blockquote lang=&quot;en&quot;&gt;
 &lt;p&gt;&lt;a href=&quot;https://developer.mozilla.org/en-US/docs/Web/API/Popover_API&quot;&gt;Popover API&lt;/a&gt; – This provides a declarative mechanism to create content that always renders in the topmost-layer, so that it overlays other web page content. &lt;mark&gt;This can be useful for building features like tooltips&lt;/mark&gt; and notifications. Support for popover was the #1&amp;nbsp;author request in the recent State of HTML&amp;nbsp;survey.&lt;/p&gt;
 &lt;p&gt;&lt;cite&gt;&lt;em&gt;&lt;a href=&quot;https://hacks.mozilla.org/2024/02/announcing-interop-2024/&quot;&gt;Announcing Interop&amp;nbsp;2024&lt;/a&gt;&lt;/em&gt;&lt;/cite&gt;&lt;/p&gt;
 &lt;/blockquote&gt;
 &lt;p&gt;Ma première intuition pour enrichir les liens de la version archivée était de passer par des éléments natifs (comme toujours). Initialement, j’ai même envisagé un &lt;a href=&quot;https://developer.mozilla.org/en-US/docs/Web/HTML/Element/dialog&quot;&gt;élément &lt;code&gt;&amp;lt;dialog&amp;gt;&lt;/code&gt;&lt;/a&gt; qui est déjà mieux supporté mais ça rentrait mal dans le DOM là où je voulais l’insérer. Je me met alors en quête d’un &lt;em&gt;&lt;a href=&quot;https://github.com/oddbird/popover-polyfill&quot;&gt;polyfill&lt;/a&gt;&lt;/em&gt; pour la Popover API qui pourrait convenir mais j’ai un peu peur des effets de bord vu que je découvre et qu’il y a quand même &lt;a href=&quot;https://developer.mozilla.org/en-US/docs/Web/API/Popover_API/Using&quot;&gt;pas mal de possibilités&lt;/a&gt;. J’en suis même à me &lt;a href=&quot;https://open-ui.org/components/popover.research.explainer/&quot;&gt;lire une bonne page de doc&lt;/a&gt; pour essayer de comprendre la distinction entre les&amp;nbsp;deux.&lt;/p&gt;
 &lt;p&gt;Je finis par abandonner cette piste et je me dis que ça pourrait être un &lt;em&gt;Web Component&lt;/em&gt; intéressant. Je m’arrache les cheveux un bon petit moment sur le positionnement et je capitule en me disant qu’il y a déjà des personnes qui ont produit des outils comme &lt;a href=&quot;https://floating-ui.com/&quot;&gt;Floating UI&lt;/a&gt; ou &lt;a href=&quot;https://atomiks.github.io/tippyjs/&quot;&gt;Tippy.js&lt;/a&gt;. Choisir c’est renoncer… et j’ai fait les deux à la fois en optant pour Tippy qui &lt;a href=&quot;https://atomiks.github.io/tippyjs/v6/accessibility/&quot;&gt;prend soin de l’accessibilité&lt;/a&gt;. J’ai trop besoin d’avoir &lt;em&gt;l’expérience de l’interface&lt;/em&gt; pour pouvoir affiner par la suite et faire les choses à ma&amp;nbsp;sauce.&lt;/p&gt;
 &lt;p&gt;N’hésitez pas à jouer avec et à me faire des retours, c’est amené à&amp;nbsp;évoluer.&lt;/p&gt;
 &lt;hr /&gt;

 &lt;blockquote lang=&quot;en&quot;&gt;
 &lt;p&gt;My recipe for fiction set ten years in the future used to be 90% already-here, 9% not-here-yet but predictable, and 1% who-ordered-that. But &lt;mark&gt;unfortunately the ratios have changed.&lt;/mark&gt; I think we&#x27;re now down to maybe 80% already-here —climate change takes a huge toll on infrastructure— then 15% not-here-yet but predictable, and a whopping 5% of utterly unpredictable deep&amp;nbsp;craziness.&lt;/p&gt;
 &lt;p&gt;&lt;cite&gt;&lt;em&gt;&lt;a href=&quot;https://www.antipope.org/charlie/blog-static/2018/01/dude-you-broke-the-future.html&quot;&gt;Dude, you broke the&amp;nbsp;future!&lt;/a&gt;&lt;/em&gt;&lt;/cite&gt;&lt;/p&gt;
 &lt;/blockquote&gt;
 &lt;p&gt;Cela me rappelle une discussion récente au sujet du manque de pertinence de la météo et de la difficulté à faire de la prédiction sur des données rendues obsolètes par le changement climatique. Les modèles ne sont pas (encore&amp;#8239;?) adaptés à un tel&amp;nbsp;chaos.&lt;/p&gt;
 &lt;p&gt;Manifestement, les écrivains non&amp;nbsp;plus.&lt;/p&gt;

 &lt;blockquote lang=&quot;en&quot;&gt;
 &lt;p&gt;Someone out there is working on it: a geolocation-aware social media scraping deep learning application, that uses a gamified, competitive interface to reward its “players” for joining in acts of mob violence against whoever the app developer hates. Probably it has an inoccuous-seeming but highly addictive training mode to get the users accustomed to working in teams and obeying the app&#x27;s instructions—think Ingress or Pokemon Go. Then, at some pre-planned zero hour, &lt;mark&gt;it switches mode and starts rewarding players for violence&lt;/mark&gt;—players who have been primed to think of their targets as vermin, by a steady drip-feed of micro-targeted dehumanizing propaganda delivered over a period of&amp;nbsp;months.&lt;/p&gt;
 &lt;p&gt;&lt;cite&gt;&lt;em&gt;Ibid.&lt;/em&gt;&lt;/cite&gt;&lt;/p&gt;
 &lt;/blockquote&gt;
 &lt;p&gt;Ah si en&amp;nbsp;fait&amp;nbsp;😬.&lt;/p&gt;
 &lt;hr /&gt;

 &lt;blockquote lang=&quot;en&quot;&gt;
 &lt;p&gt;If we want a system that is consistent with the flourishing of life on earth, we will need a system that mimics nature. Our current economic model doesn’t - for many reasons - and needs to change. Looking at nature, including our own human nature in our private lives, gives us many ideas for what this new, harmonious system could look&amp;nbsp;like.&lt;/p&gt;
 &lt;p&gt;&lt;cite&gt;&lt;em&gt;&lt;a href=&quot;https://erinremblance.substack.com/p/we-are-all-socialists-in-our-private&quot;&gt;“We Are All Socialists in Our Private&amp;nbsp;Lives”&lt;/a&gt;&lt;/em&gt;&lt;/cite&gt;&lt;/p&gt;
 &lt;/blockquote&gt;
 &lt;p&gt;Il n’y a que les classes moyennes qui peuvent être socialistes. C’était tout l’enjeu de leur destruction pour n’avoir plus que des personnes qui aient peur de perdre le &lt;em&gt;trop peu&lt;/em&gt; ou le &lt;em&gt;vraiment beaucoup&lt;/em&gt; qu’elles ont. Et la peur rend la manipulation tellement plus&amp;nbsp;facile…&lt;/p&gt;

 &lt;blockquote lang=&quot;en&quot;&gt;
 &lt;p&gt;If a monkey hoarded more bananas than it could eat, while most of the other monkeys starved, scientists would study that monkey to figure out what the heck was wrong with it. When humans do it, we put them on the cover of&amp;nbsp;Forbes.&lt;/p&gt;
 &lt;p&gt;&lt;cite&gt;&lt;em&gt;Ibid.&lt;/em&gt;&lt;/cite&gt;&lt;/p&gt;
 &lt;/blockquote&gt;
 &lt;p&gt;🙈&lt;/p&gt;
 &lt;nav&gt;&lt;p&gt;&lt;a href=&quot;https://larlet.fr/david/2024/apprentissage/&quot;&gt;#apprentissage&lt;/a&gt; &lt;a href=&quot;https://larlet.fr/david/2024/technique/&quot;&gt;#technique&lt;/a&gt; &lt;a href=&quot;https://larlet.fr/david/2024/web/&quot;&gt;#web&lt;/a&gt;&lt;/p&gt;&lt;/nav&gt;&lt;hr/&gt;&lt;p&gt;&lt;a href=&quot;mailto:david@larlet.fr&quot;&gt;Réagir ?&lt;/a&gt;&lt;/p&gt;</summary>
        </entry>
    
        <entry xml:lang="fr">
            <title type="html">Archives</title>
            <link href="https://larlet.fr/david/2024/02/03/" rel="alternate" type="text/html" />
            <updated>2024-02-03T12:00:00+01:00</updated>
            <id>https://larlet.fr/david/2024/02/03/</id>
            <summary type="html">

 &lt;blockquote lang=&quot;en&quot;&gt;
 &lt;p&gt;Google will no longer be keeping a backup of the entire Internet. Google Search’s “cached” links have long been an alternative way to load a website that was down or had changed, but now the company is killing them off. Google “Search Liaison” Danny Sullivan confirmed the feature removal in an X post, saying the feature “was meant for helping people access pages when way back, you often couldn’t depend on a page loading. These days, &lt;mark&gt;things have greatly improved.&lt;/mark&gt; So, it was decided to retire&amp;nbsp;it.”&lt;/p&gt;
 &lt;p&gt;&lt;cite&gt;&lt;em&gt;&lt;a href=&quot;https://arstechnica.com/gadgets/2024/02/google-search-kills-off-cached-webpages/&quot;&gt;Google will no longer back up the Internet: Cached webpages are&amp;nbsp;dead&lt;/a&gt;&lt;/em&gt;&lt;/cite&gt;&lt;/p&gt;
 &lt;/blockquote&gt;
 &lt;p&gt;&lt;em&gt;(rires)&lt;/em&gt;&lt;/p&gt;
 &lt;p&gt;Forcément en lisant ça un samedi matin, j’étais immédiatement motivé pour améliorer la façon dont j’archive les liens par ici. À commencer par des méta-données qui permettraient d’avoir une prévisualisation des liens un peu&amp;nbsp;enrichie.&lt;/p&gt;
 &lt;p&gt;Je me dis que je ne dois pas être le seul à essayer d’extraire des informations des pages. Et j’en trouve pas mal&amp;nbsp;: &lt;a href=&quot;https://github.com/gri38/hyperlink_preview&quot;&gt;hyperlink_preview&lt;/a&gt;, &lt;a href=&quot;https://github.com/scrapinghub/extruct&quot;&gt;extruct&lt;/a&gt; ou &lt;a href=&quot;https://github.com/seanbreckenridge/url_cache&quot;&gt;url_cache&lt;/a&gt; pour ne citer qu’eux. Cela me met sur la piste de &lt;a href=&quot;https://github.com/michaelhelmick/lassie&quot;&gt;Lassie&lt;/a&gt; qui semble extraire ce que j’aimerais avoir&amp;nbsp;: une image ou favicon, potentiellement une description, ainsi qu’une langue. Jake Lazaroff m’avait &lt;a href=&quot;https://larlet.fr/david/2024/02/01/#hr-60&quot;&gt;depuis répondu&lt;/a&gt; qu’il génère en fait ses vignettes au moment de la &lt;a href=&quot;https://gist.github.com/jakelazaroff/36b9665efe02870576acfc033171d6bf&quot;&gt;construction du site&lt;/a&gt;. Je ne veux pas totalement suivre cette approche car je ne veux pas stocker d’images additionnelles mais je vais essayer d’avoir une solution&amp;nbsp;hybride.&lt;/p&gt;
 &lt;p&gt;Cela m’embête de plus en plus de coupler le générateur de site aux (méta-)données des archives. &lt;em&gt;À&amp;nbsp;méditer.&lt;/em&gt;&lt;/p&gt;
 &lt;p&gt;Pour ce qui est de l’interface, ça attendra un autre jour. J’ai tout de même ajouté des attributs &lt;code&gt;hreflang&lt;/code&gt; et la bonne langue dans les pages d’archives, un truc qui me grattait depuis un bout de&amp;nbsp;temps.&lt;/p&gt;
 &lt;hr /&gt;
 &lt;p&gt;Cela fait &lt;a href=&quot;https://larlet.fr/david/2020/02/07/#sonos&quot;&gt;bien longtemps&lt;/a&gt; que je regrette d’avoir acheté des enceintes Sonos. Hier —&amp;nbsp;encore une fois frustré par l’application proposée par défaut&amp;nbsp;— je découvre &lt;a href=&quot;https://github.com/SoCo/SoCo&quot;&gt;SoCo&lt;/a&gt; ainsi que &lt;a href=&quot;https://github.com/avantrec/soco-cli&quot;&gt;soco-cli&lt;/a&gt; après quelques recherches. Je passe ensuite la soirée à batailler avec Automator pour pouvoir faire un clic-droit sur un dossier local et que ça me lise les fichiers FLAC qui sont&amp;nbsp;dedans.&lt;/p&gt;
 &lt;p&gt;J’arrive à la solution&amp;nbsp;suivante&amp;nbsp;:&lt;/p&gt;
 &lt;pre&gt;&lt;code&gt;on run {input, parameters}
    tell application &amp;quot;Terminal&amp;quot;
        do script &amp;quot;cd ~/sonos &amp;amp;&amp;amp; sonos Chambre play_dir &#x27;&amp;quot; &amp;amp; (POSIX path of input) &amp;amp; &amp;quot;&#x27;&amp;quot;
    end tell
    return input
 end run
 &lt;/code&gt;&lt;/pre&gt;
 &lt;p&gt;Ce n’est pas très élégant et je n’ai pas réussi à faire en sorte que ça se lance dans iTerm mais au moins ça joue de la&amp;nbsp;musique.&lt;/p&gt;
 &lt;hr /&gt;

 &lt;blockquote lang=&quot;en&quot;&gt;
 &lt;p&gt;&lt;strong&gt;drab&lt;/strong&gt; focuses on providing JavaScript functionality where it’s most useful. Many of the elements are helpful wrappers &lt;mark&gt;around browser APIs.&lt;/mark&gt; Here are some of the features of the&amp;nbsp;library.&lt;/p&gt;
 &lt;p&gt;&lt;cite&gt;&lt;em&gt;&lt;a href=&quot;https://drab.robino.dev/&quot;&gt;drab - A Headless Custom Element&amp;nbsp;Library&lt;/a&gt;&lt;/em&gt;&lt;/cite&gt;&lt;/p&gt;
 &lt;/blockquote&gt;
 &lt;p&gt;Le futur qui se dessine à ce sujet est &lt;em&gt;très&lt;/em&gt; stimulant. Cela fait 15&amp;nbsp;ans qu’il y a une production de masse de code JS qui n’est ni réutilisable, ni interopérable. J’ai bon espoir que ce soit en train de&amp;nbsp;changer.&lt;/p&gt;
 &lt;hr /&gt;

 &lt;blockquote lang=&quot;en&quot;&gt;
 &lt;p&gt;When trying to defend this, economists typically claim that we have unlimited desire for new stuff. Apparently, rather than dedicating the time gains from technology to leisure, we pour it into making more stuff for ourselves. This is bogus. People do have a limited desire for new things, because dedicating yourself to endless production (and consumption) comes at the expense of hanging out with your family, friends and pets, or doing stuff like walking in the wilderness or surfing the waves. What people actually desire is a balance of many things, but &lt;mark&gt;the system we’re stuck in has unlimited desire for one direction only.&lt;/mark&gt; That’s because it’s a vortex unleashed by humans who no longer know how to stop&amp;nbsp;it.&lt;/p&gt;
 &lt;p&gt;&lt;cite&gt;&lt;em&gt;&lt;a href=&quot;https://brettscott.substack.com/p/tech-doesnt-make-our-lives-easier&quot;&gt;Tech doesn’t make our lives easier. It makes them&amp;nbsp;faster&lt;/a&gt;&lt;/em&gt;&lt;/cite&gt;&lt;/p&gt;
 &lt;/blockquote&gt;
 &lt;p&gt;Un bon article à lire après 24h de galères&amp;nbsp;techniques&amp;nbsp;😅.&lt;/p&gt;
 &lt;nav&gt;&lt;p&gt;&lt;a href=&quot;https://larlet.fr/david/2024/dependance/&quot;&gt;#dépendance&lt;/a&gt; &lt;a href=&quot;https://larlet.fr/david/2024/opensource/&quot;&gt;#opensource&lt;/a&gt; &lt;a href=&quot;https://larlet.fr/david/2024/technique/&quot;&gt;#technique&lt;/a&gt;&lt;/p&gt;&lt;/nav&gt;&lt;hr/&gt;&lt;p&gt;&lt;a href=&quot;mailto:david@larlet.fr&quot;&gt;Réagir ?&lt;/a&gt;&lt;/p&gt;</summary>
        </entry>
    
 </feed>
--- a/david/recherche/index.html
+++ b/david/recherche/index.html
@@ -276,6 +276,24 @@
    </template>
    
    <script id="search-index" type="application/json">[
  {
    "title": "Vannerie",
    "url": "/david/2024/03/06/",
    "date": "2024-03-06",
    "content": "L\u2019atelier du jour \u00e9tait une initiation \u00e0 la vannerie, cette fois-ci avec / pour l\u2019enfant. Depuis le temps qu\u2019il veut m\u2019accompagner, j\u2019ai saut\u00e9 sur l\u2019occasion lorsqu\u2019une animatrice d\u2019atelier \u2014 ancienne enseignante, \u00e7a doit jouer\u00a0\u2014 accept\u00e2t les personnes de son\u00a0\u00e2ge. <a href=\"/static/david/2024/2024-03-06-vannerie-panier.jpg\" title=\"Cliquer pour une version haute r\u00e9solution\"> <img src=\"/static/david/2024/2024-03-06-vannerie-panier.jpg\" width=\"4032\" height=\"3024\" srcset=\"/static/david/2024/2024-03-06-vannerie-panier.jpg 4032w, /static/david/2024/2024-03-06-vannerie-panier_660x440.jpg 660w, /static/david/2024/2024-03-06-vannerie-panier_990x660.jpg 990w, /static/david/2024/2024-03-06-vannerie-panier_1320x880.jpg 1320w\" sizes=\"min(100vw, calc(100vh * 4032 / 3024))\" loading=\"lazy\" decoding=\"async\" alt=\"Un panier en vannerie.\"> Un panier en vannerie, \u00e7a m\u2019a pris\u00a02h30. Le twist, c\u2019est que j\u2019ai pu le faire aussi vu que nous \u00e9tions les seuls pr\u00e9sents pour la session au final. Autant dire qu\u2019avec un cours particulier on a pu apprendre encore plus de choses\u202f! Sur un spectre allant des techniques d\u2019assouplissement \u00e0 l\u2019appropriation culturelle, on a pass\u00e9 un bon moment d\u2019\u00e9changes. J\u2019ai appris que la pr\u00e9paration du fr\u00eane noir utilis\u00e9 dans la vannerie par les Premi\u00e8res Nations prend plusieurs mois, ce qui explique sa raret\u00e9 (et son\u00a0prix). <a href=\"/static/david/2024/2024-03-06-vannerie-sac-a-dos.jpg\" title=\"Cliquer pour une version haute r\u00e9solution\"> <img src=\"/static/david/2024/2024-03-06-vannerie-sac-a-dos.jpg\" width=\"3024\" height=\"4032\" srcset=\"/static/david/2024/2024-03-06-vannerie-sac-a-dos.jpg 3024w, /static/david/2024/2024-03-06-vannerie-sac-a-dos_660x440.jpg 660w, /static/david/2024/2024-03-06-vannerie-sac-a-dos_990x660.jpg 990w, /static/david/2024/2024-03-06-vannerie-sac-a-dos_1320x880.jpg 1320w\" sizes=\"min(100vw, calc(100vh * 3024 / 4032))\" loading=\"lazy\" decoding=\"async\" alt=\"Un sac \u00e0 dos en vannerie.\"> Un sac \u00e0 dos en vannerie sur le dos de\u00a0l\u2019enfant. Toujours cette sensation de cr\u00e9er des objets utiles \u00e0 partir de pas grand chose et avec un minimum de\u00a0mat\u00e9riel. Like Stimulus, but a lot smaller and a bit more\u00a0webcomponenty? Musculus D\u00e9couverte du jour que je trouve tr\u00e8s inspirante. J\u2019avais dans un coin de t\u00eate de tester des choses dans cette voie. R\u00e9ussir \u00e0 faire le pont entre les deux serait une tr\u00e8s bonne combinaison. J\u2019appr\u00e9cie qu\u2019une solution de test soit propos\u00e9e, m\u00eame si elle est l\u00e9g\u00e8re (en terme de fiabilit\u00e9) j\u2019en peux plus d\u2019attendre\u00a0Playwright. End the battle. Use infinity to get the highest possible z-index and win\u00a0forever. [\u2026] But is infinity really any better than some arbitrarily big value like 9999px? Functionally, no. Same end result. But I think it does help make code more self-documenting, because infinity conveys intent. It expresses that it\u2019s all about the magnitude, not a specific magic\u00a0number. Playing with Infinity in\u00a0CSS Autre d\u00e9couverte du jour. J\u2019aime bien l\u2019id\u00e9e de pouvoir \u00e9vacuer certaines valeurs magiques de mani\u00e8re explicite. J\u2019ai la flemme de tester ce qu\u2019un calc(infinity - 1) donnerait sur un z-index\u00a0\ud83e\udd2d."
  },
  {
    "title": "Jour&nbsp;2",
    "url": "/david/2024/03/05/",
    "date": "2024-03-05",
    "content": "On se r\u00e9veille dans la brume avec le soleil peinant \u00e0 passer \u00e0 travers, le lac et la neige ont regel\u00e9 pendant la nuit. C\u2019est une belle ambiance apr\u00e8s une nuit agit\u00e9e par la chaleur du sauna refuge. Les po\u00eales tirent \u00e0 fond dans ces endroits pour \u00e9viter que des personnes n\u2019arrivent pas \u00e0 faire d\u00e9marrer un feu (j\u2019imagine que \u00e7a peut \u00eatre critique) mais \u00e7a les rend tr\u00e8s inefficaces dans la dur\u00e9e et tr\u00e8s chauds d\u00e8s qu\u2019on met deux buches\u00a0dedans. <a href=\"/static/david/2024/2024-03-05-lac-corbeau.jpg\" title=\"Cliquer pour une version haute r\u00e9solution\"> <img src=\"/static/david/2024/2024-03-05-lac-corbeau.jpg\" width=\"4032\" height=\"3024\" srcset=\"/static/david/2024/2024-03-05-lac-corbeau.jpg 4032w, /static/david/2024/2024-03-05-lac-corbeau_660x440.jpg 660w, /static/david/2024/2024-03-05-lac-corbeau_990x660.jpg 990w, /static/david/2024/2024-03-05-lac-corbeau_1320x880.jpg 1320w\" sizes=\"min(100vw, calc(100vh * 4032 / 3024))\" loading=\"lazy\" decoding=\"async\" alt=\"Lac corbeau \u00e0 l\u2019aube.\"> De bien jolies couleurs au\u00a0r\u00e9veil. Cet \u00e9pisode me confirme encore une fois que les enfants ont des corps de sportifs de tr\u00e8s haut niveau. Je suis impatient de pouvoir le charger un peu plus car c\u2019est frustrant de le voir gambader devant de bon matin alors que mes muscles sont \u00e0 peine r\u00e9veill\u00e9s. J\u2019aime bien lorsqu\u2019on va explorer un peu plus loin et que l\u2019on se projette sur ce que l\u2019on pourrait faire l\u2019ann\u00e9e\u00a0suivante. <a href=\"/static/david/2024/2024-03-05-enfant-refuge-corbeau.jpg\" title=\"Cliquer pour une version haute r\u00e9solution\"> <img src=\"/static/david/2024/2024-03-05-enfant-refuge-corbeau.jpg\" width=\"3024\" height=\"4032\" srcset=\"/static/david/2024/2024-03-05-enfant-refuge-corbeau.jpg 3024w, /static/david/2024/2024-03-05-enfant-refuge-corbeau_660x440.jpg 660w, /static/david/2024/2024-03-05-enfant-refuge-corbeau_990x660.jpg 990w, /static/david/2024/2024-03-05-enfant-refuge-corbeau_1320x880.jpg 1320w\" sizes=\"min(100vw, calc(100vh * 3024 / 4032))\" loading=\"lazy\" decoding=\"async\" alt=\"Un enfant qui court dans la neige vers un refuge.\"> Jamais\u00a0fatigu\u00e9. Le retour est moins joyeux car il s\u2019agit d\u2019enchainer les efforts et chaque heure qui passe rend la neige plus meuble. \u00c0 tel point que l\u2019on d\u00e9cide de couper par une piste sur une courte section. Mon \u00e9valuation est que la saison de ski est termin\u00e9e, m\u00eame une sous-couche bien travaill\u00e9e ne tiendra pas la semaine qui s\u2019en\u00a0vient. J\u2019aurais aim\u00e9 faire une boucle un peu plus longue au retour mais il faut savoir s\u2019adapter aux conditions. Le plus important est de terminer sans blessure ni\u00a0d\u00e9go\u00fbt. Je commence \u00e0 imaginer un parcours rapide sur plusieurs jours dans cette for\u00eat que je connais bien. Peut-\u00eatre qu\u2019une fen\u00eatre se dessine en avril\u2026 il faut que je r\u00e9cup\u00e8re un peu de cardio d\u2019ici\u00a0l\u00e0."
  },
  {
    "title": "Jour&nbsp;1",
    "url": "/david/2024/03/04/",
    "date": "2024-03-04",
    "content": "Une r\u00e9servation de longue date qui s\u2019est transform\u00e9e en sortie familiale (!), malheureusement nous n\u2019avons pas pu rejoindre le refuge \u00e0 ski faute de neige suffisante. C\u2019\u00e9tait probl\u00e9matique car j\u2019avais pr\u00e9vu de tra\u00eener une bonne partie de l\u2019\u00e9quipement, ce qui se r\u00e9v\u00e9lait \u00eatre un peu plus lourd sur le dos. Bon, aussi, on \u00e9tait partis sur une raclette, \u00e7a n\u2019aide\u00a0pas\u00a0\ud83d\ude05. J\u2019avais tr\u00e8s peur que le sentier soit peu praticable sans percer \u00e0 chaque pas, ce qui m\u2019\u00e9tait d\u00e9j\u00e0 arriv\u00e9 dans un tel contexte. Vu le poids du sac, je craignais notamment que ma cheville en cours de r\u00e9paration refasse le m\u00eame mouvement en descente\u2026 mais nous \u00e9tions \u00e0 une poign\u00e9e de degr\u00e9s de cet \u00e9tat de la neige pour notre plus grand\u00a0bonheur. Ce n\u2019\u00e9tait pas non plus de tout repos et la r\u00e9compense d\u2019une lac d\u00e9gelant \u00e0 l\u2019arriv\u00e9e \u00e9tait bien m\u00e9rit\u00e9e. Il est rare d\u2019avoir ces conditions tr\u00e8s douces dans un contexte hivernal, on en avait m\u00eame oubli\u00e9 de prendre nos\u00a0tuques\u202f! Tests du jour\u00a0: les barquettes en aluminium pour faire r\u00e9flecteur de bougies. Efficace. Les bougies longues dur\u00e9es d\u2019Ikea pour faire fondre du fromage. Pas\u00a0efficace. <a href=\"/static/david/2024/2024-03-04-lac-corbeau.jpg\" title=\"Cliquer pour une version haute r\u00e9solution\"> <img src=\"/static/david/2024/2024-03-04-lac-corbeau.jpg\" width=\"3024\" height=\"4032\" srcset=\"/static/david/2024/2024-03-04-lac-corbeau.jpg 3024w, /static/david/2024/2024-03-04-lac-corbeau_660x440.jpg 660w, /static/david/2024/2024-03-04-lac-corbeau_990x660.jpg 990w, /static/david/2024/2024-03-04-lac-corbeau_1320x880.jpg 1320w\" sizes=\"min(100vw, calc(100vh * 3024 / 4032))\" loading=\"lazy\" decoding=\"async\" alt=\"Lac corbeau avec des boulots au premier plan.\"> Un d\u00e9cor tr\u00e8s minecrafteux\u00a0(sic)."
  },
  {
    "title": "Permanence",
    "url": "/david/2024/03/03/",
@@ -654,6 +672,24 @@
    "date": "2024-01-01",
    "content": "33\u202f% de 44\u00a0millions de consommateurs vont faire le Dry January 22\u202f% des consommateurs ont une conso excessive, c\u2019est-\u00e0-dire 10\u00a0verres/semaine max et plus de deux\u00a0verres/jour. Les seniors sont aussi tr\u00e8s touch\u00e9\u00b7es. L\u2019alcool est une drogue.. On peut faire la f\u00eate sans alcool et\u00a0s\u2019\u00e9clater. Quand on arr\u00eate\u00a0: bienfaits sur le foie, la peau, le coeur, etc\u2026 Pb\u00a0: m\u00e9moire, troubles cognitifs, responsable de cancer, pb sommeil, d\u00e9compensation de maladie psy,\u2026 41000\u00a0d\u00e9c\u00e8s par an en\u00a0France. Les cinq sympt\u00f4mes d\u00e9finissent un probl\u00e8me de\u00a0d\u00e9pendance\u00a0: Perte de\u00a0contr\u00f4le Usage\u00a0compulsif Envie\u00a0r\u00e9pressive Usage\u00a0chronique Cons\u00e9quences psychiques, physiques, sociales,\u2026 Bon Dry J. pour celleux qui le font\u202f! Moi j\u2019en\u00a0suis\u202f! @Air@framapiaf.org Dans mon entourage, de plus en plus de personnes que j\u2019estime ne boivent pas d\u2019alcool, de plus en plus de personnes qui vieillissent en deviennent d\u00e9pendantes. Je suis davantage attir\u00e9 par la premi\u00e8re option\u2026 et pas pour un seul\u00a0mois. Je me sens pr\u00eat, on verra bien o\u00f9 cela me\u00a0m\u00e8ne. Grosse envie de reprendre la CSS par ici en ce d\u00e9but d\u2019ann\u00e9e. Avec le dilemme de faire chuter cette motivation si je publie d\u00e8s maintenant avec l\u2019ancienne (qui restera effective sur les anciens articles). Je vais essayer de me\u00a0retenir."
  },
  {
    "title": "Vannerie",
    "url": "/david/2024/03/06/",
    "date": "2024-03-06",
    "content": "L\u2019atelier du jour \u00e9tait une initiation \u00e0 la vannerie, cette fois-ci avec / pour l\u2019enfant. Depuis le temps qu\u2019il veut m\u2019accompagner, j\u2019ai saut\u00e9 sur l\u2019occasion lorsqu\u2019une animatrice d\u2019atelier \u2014 ancienne enseignante, \u00e7a doit jouer\u00a0\u2014 accept\u00e2t les personnes de son\u00a0\u00e2ge. <a href=\"/static/david/2024/2024-03-06-vannerie-panier.jpg\" title=\"Cliquer pour une version haute r\u00e9solution\"> <img src=\"/static/david/2024/2024-03-06-vannerie-panier.jpg\" width=\"4032\" height=\"3024\" srcset=\"/static/david/2024/2024-03-06-vannerie-panier.jpg 4032w, /static/david/2024/2024-03-06-vannerie-panier_660x440.jpg 660w, /static/david/2024/2024-03-06-vannerie-panier_990x660.jpg 990w, /static/david/2024/2024-03-06-vannerie-panier_1320x880.jpg 1320w\" sizes=\"min(100vw, calc(100vh * 4032 / 3024))\" loading=\"lazy\" decoding=\"async\" alt=\"Un panier en vannerie.\"> Un panier en vannerie, \u00e7a m\u2019a pris\u00a02h30. Le twist, c\u2019est que j\u2019ai pu le faire aussi vu que nous \u00e9tions les seuls pr\u00e9sents pour la session au final. Autant dire qu\u2019avec un cours particulier on a pu apprendre encore plus de choses\u202f! Sur un spectre allant des techniques d\u2019assouplissement \u00e0 l\u2019appropriation culturelle, on a pass\u00e9 un bon moment d\u2019\u00e9changes. J\u2019ai appris que la pr\u00e9paration du fr\u00eane noir utilis\u00e9 dans la vannerie par les Premi\u00e8res Nations prend plusieurs mois, ce qui explique sa raret\u00e9 (et son\u00a0prix). <a href=\"/static/david/2024/2024-03-06-vannerie-sac-a-dos.jpg\" title=\"Cliquer pour une version haute r\u00e9solution\"> <img src=\"/static/david/2024/2024-03-06-vannerie-sac-a-dos.jpg\" width=\"3024\" height=\"4032\" srcset=\"/static/david/2024/2024-03-06-vannerie-sac-a-dos.jpg 3024w, /static/david/2024/2024-03-06-vannerie-sac-a-dos_660x440.jpg 660w, /static/david/2024/2024-03-06-vannerie-sac-a-dos_990x660.jpg 990w, /static/david/2024/2024-03-06-vannerie-sac-a-dos_1320x880.jpg 1320w\" sizes=\"min(100vw, calc(100vh * 3024 / 4032))\" loading=\"lazy\" decoding=\"async\" alt=\"Un sac \u00e0 dos en vannerie.\"> Un sac \u00e0 dos en vannerie sur le dos de\u00a0l\u2019enfant. Toujours cette sensation de cr\u00e9er des objets utiles \u00e0 partir de pas grand chose et avec un minimum de\u00a0mat\u00e9riel. Like Stimulus, but a lot smaller and a bit more\u00a0webcomponenty? Musculus D\u00e9couverte du jour que je trouve tr\u00e8s inspirante. J\u2019avais dans un coin de t\u00eate de tester des choses dans cette voie. R\u00e9ussir \u00e0 faire le pont entre les deux serait une tr\u00e8s bonne combinaison. J\u2019appr\u00e9cie qu\u2019une solution de test soit propos\u00e9e, m\u00eame si elle est l\u00e9g\u00e8re (en terme de fiabilit\u00e9) j\u2019en peux plus d\u2019attendre\u00a0Playwright. End the battle. Use infinity to get the highest possible z-index and win\u00a0forever. [\u2026] But is infinity really any better than some arbitrarily big value like 9999px? Functionally, no. Same end result. But I think it does help make code more self-documenting, because infinity conveys intent. It expresses that it\u2019s all about the magnitude, not a specific magic\u00a0number. Playing with Infinity in\u00a0CSS Autre d\u00e9couverte du jour. J\u2019aime bien l\u2019id\u00e9e de pouvoir \u00e9vacuer certaines valeurs magiques de mani\u00e8re explicite. J\u2019ai la flemme de tester ce qu\u2019un calc(infinity - 1) donnerait sur un z-index\u00a0\ud83e\udd2d."
  },
  {
    "title": "Jour&nbsp;2",
    "url": "/david/2024/03/05/",
    "date": "2024-03-05",
    "content": "On se r\u00e9veille dans la brume avec le soleil peinant \u00e0 passer \u00e0 travers, le lac et la neige ont regel\u00e9 pendant la nuit. C\u2019est une belle ambiance apr\u00e8s une nuit agit\u00e9e par la chaleur du sauna refuge. Les po\u00eales tirent \u00e0 fond dans ces endroits pour \u00e9viter que des personnes n\u2019arrivent pas \u00e0 faire d\u00e9marrer un feu (j\u2019imagine que \u00e7a peut \u00eatre critique) mais \u00e7a les rend tr\u00e8s inefficaces dans la dur\u00e9e et tr\u00e8s chauds d\u00e8s qu\u2019on met deux buches\u00a0dedans. <a href=\"/static/david/2024/2024-03-05-lac-corbeau.jpg\" title=\"Cliquer pour une version haute r\u00e9solution\"> <img src=\"/static/david/2024/2024-03-05-lac-corbeau.jpg\" width=\"4032\" height=\"3024\" srcset=\"/static/david/2024/2024-03-05-lac-corbeau.jpg 4032w, /static/david/2024/2024-03-05-lac-corbeau_660x440.jpg 660w, /static/david/2024/2024-03-05-lac-corbeau_990x660.jpg 990w, /static/david/2024/2024-03-05-lac-corbeau_1320x880.jpg 1320w\" sizes=\"min(100vw, calc(100vh * 4032 / 3024))\" loading=\"lazy\" decoding=\"async\" alt=\"Lac corbeau \u00e0 l\u2019aube.\"> De bien jolies couleurs au\u00a0r\u00e9veil. Cet \u00e9pisode me confirme encore une fois que les enfants ont des corps de sportifs de tr\u00e8s haut niveau. Je suis impatient de pouvoir le charger un peu plus car c\u2019est frustrant de le voir gambader devant de bon matin alors que mes muscles sont \u00e0 peine r\u00e9veill\u00e9s. J\u2019aime bien lorsqu\u2019on va explorer un peu plus loin et que l\u2019on se projette sur ce que l\u2019on pourrait faire l\u2019ann\u00e9e\u00a0suivante. <a href=\"/static/david/2024/2024-03-05-enfant-refuge-corbeau.jpg\" title=\"Cliquer pour une version haute r\u00e9solution\"> <img src=\"/static/david/2024/2024-03-05-enfant-refuge-corbeau.jpg\" width=\"3024\" height=\"4032\" srcset=\"/static/david/2024/2024-03-05-enfant-refuge-corbeau.jpg 3024w, /static/david/2024/2024-03-05-enfant-refuge-corbeau_660x440.jpg 660w, /static/david/2024/2024-03-05-enfant-refuge-corbeau_990x660.jpg 990w, /static/david/2024/2024-03-05-enfant-refuge-corbeau_1320x880.jpg 1320w\" sizes=\"min(100vw, calc(100vh * 3024 / 4032))\" loading=\"lazy\" decoding=\"async\" alt=\"Un enfant qui court dans la neige vers un refuge.\"> Jamais\u00a0fatigu\u00e9. Le retour est moins joyeux car il s\u2019agit d\u2019enchainer les efforts et chaque heure qui passe rend la neige plus meuble. \u00c0 tel point que l\u2019on d\u00e9cide de couper par une piste sur une courte section. Mon \u00e9valuation est que la saison de ski est termin\u00e9e, m\u00eame une sous-couche bien travaill\u00e9e ne tiendra pas la semaine qui s\u2019en\u00a0vient. J\u2019aurais aim\u00e9 faire une boucle un peu plus longue au retour mais il faut savoir s\u2019adapter aux conditions. Le plus important est de terminer sans blessure ni\u00a0d\u00e9go\u00fbt. Je commence \u00e0 imaginer un parcours rapide sur plusieurs jours dans cette for\u00eat que je connais bien. Peut-\u00eatre qu\u2019une fen\u00eatre se dessine en avril\u2026 il faut que je r\u00e9cup\u00e8re un peu de cardio d\u2019ici\u00a0l\u00e0."
  },
  {
    "title": "Jour&nbsp;1",
    "url": "/david/2024/03/04/",
    "date": "2024-03-04",
    "content": "Une r\u00e9servation de longue date qui s\u2019est transform\u00e9e en sortie familiale (!), malheureusement nous n\u2019avons pas pu rejoindre le refuge \u00e0 ski faute de neige suffisante. C\u2019\u00e9tait probl\u00e9matique car j\u2019avais pr\u00e9vu de tra\u00eener une bonne partie de l\u2019\u00e9quipement, ce qui se r\u00e9v\u00e9lait \u00eatre un peu plus lourd sur le dos. Bon, aussi, on \u00e9tait partis sur une raclette, \u00e7a n\u2019aide\u00a0pas\u00a0\ud83d\ude05. J\u2019avais tr\u00e8s peur que le sentier soit peu praticable sans percer \u00e0 chaque pas, ce qui m\u2019\u00e9tait d\u00e9j\u00e0 arriv\u00e9 dans un tel contexte. Vu le poids du sac, je craignais notamment que ma cheville en cours de r\u00e9paration refasse le m\u00eame mouvement en descente\u2026 mais nous \u00e9tions \u00e0 une poign\u00e9e de degr\u00e9s de cet \u00e9tat de la neige pour notre plus grand\u00a0bonheur. Ce n\u2019\u00e9tait pas non plus de tout repos et la r\u00e9compense d\u2019une lac d\u00e9gelant \u00e0 l\u2019arriv\u00e9e \u00e9tait bien m\u00e9rit\u00e9e. Il est rare d\u2019avoir ces conditions tr\u00e8s douces dans un contexte hivernal, on en avait m\u00eame oubli\u00e9 de prendre nos\u00a0tuques\u202f! Tests du jour\u00a0: les barquettes en aluminium pour faire r\u00e9flecteur de bougies. Efficace. Les bougies longues dur\u00e9es d\u2019Ikea pour faire fondre du fromage. Pas\u00a0efficace. <a href=\"/static/david/2024/2024-03-04-lac-corbeau.jpg\" title=\"Cliquer pour une version haute r\u00e9solution\"> <img src=\"/static/david/2024/2024-03-04-lac-corbeau.jpg\" width=\"3024\" height=\"4032\" srcset=\"/static/david/2024/2024-03-04-lac-corbeau.jpg 3024w, /static/david/2024/2024-03-04-lac-corbeau_660x440.jpg 660w, /static/david/2024/2024-03-04-lac-corbeau_990x660.jpg 990w, /static/david/2024/2024-03-04-lac-corbeau_1320x880.jpg 1320w\" sizes=\"min(100vw, calc(100vh * 3024 / 4032))\" loading=\"lazy\" decoding=\"async\" alt=\"Lac corbeau avec des boulots au premier plan.\"> Un d\u00e9cor tr\u00e8s minecrafteux\u00a0(sic)."
  },
  {
    "title": "Permanence",
    "url": "/david/2024/03/03/",