davidbgk
/
larlet-fr-david


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334
							<!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>Marcher — David Larlet</title>
<meta name="description" content="Mais l’ennui est aussi une volupté tranquille, un retrait provisoire hors de la frénésie ordinaire qui laisse démuni et étonné, les mains vides, du temps plein la tête avec une vague culpabilité de ne pas être à la tâche. S’ennuyer est un art qui s’apprend à l’usage. La marche induit peu à peu une sorte de transe, une douce fatigue imprègne les muscles et libère l’esprit qui n’est plus assujetti à la rumination des soucis. Après quelques heures d’effort les mouvements glissent comme la durée, comme l’eau s’écoule dans le lit de la rivière, dans une sorte d’évidence. La conscience s’est élargie, elle développe une lucidité tranquille sur la progression, sur les incidents possibles du parcours.">
<!-- 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)">
<!-- Documented, feel free to shoot an email. -->
<link rel="stylesheet" href="/static/david/css/style_2021-01-20.css">
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. -->
<link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_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/triplicate_t4_poly_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/triplicate_t4_poly_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/triplicate_t3_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin>
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin>
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_italic.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin>
<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>

<body class="remarkdown h1-underline h2-underline h3-underline em-underscore hr-center ul-star pre-tick" data-instant-intensity="viewport-all">


<article>
<header>
  <h1>Marcher</h1>
</header>
<nav>
  <p class="center">
    <a rel="prev" href="/david/2022/12/19/" title="Publication précédente : Traces">← Précédent</a> •
    <nobr>
      <a href="/david/" title="Aller à l’accueil"
        ><svg class="icon icon-home">
          <use
            xlink:href="/static/david/icons2/symbol-defs-2022-03.svg#icon-home"
          ></use>
        </svg>
        Accueil</a
      >
    </nobr>
    •
    <nobr>
      <a href="/david/recherche/" title="Aller à la page de recherche"
        ><svg class="icon icon-search">
          <use
            xlink:href="/static/david/icons2/symbol-defs-2022-03.svg#icon-search"
          ></use>
        </svg>
        Recherche</a
      >
    </nobr>
    
  </p>
</nav>
<hr>


<blockquote>
<p>Mais l’ennui est aussi une volupté tranquille, un retrait provisoire hors de la frénésie ordinaire qui laisse démuni et étonné, les mains vides, du temps plein la tête avec une vague culpabilité de ne pas être à la tâche. S’ennuyer est un art qui s’apprend à l’usage. La marche induit peu à peu une sorte de transe, une douce fatigue imprègne les muscles et libère l’esprit qui n’est plus assujetti à la rumination des soucis. Après quelques heures d’effort les mouvements glissent comme la durée, comme l’eau s’écoule dans le lit de la rivière, dans une sorte d’évidence. La conscience s’est élargie, elle développe une lucidité tranquille sur la progression, sur les incidents possibles du&nbsp;parcours.</p>
<p>La pensée flottante qui naît de la marche est affranchie des contraintes de raisonnement, elle va et vient, enracinée dans la sensorialité, l’instant qui passe. <mark>La marche est un élagage des pensées trop lourdes</mark> qui empêchent de vivre par leur poids&nbsp;d’inquiétude.</p>
<p><cite><em>Marcher, éloge des chemins de la lenteur</em>, David Le&nbsp;Breton</cite></p>
</blockquote>
<p><a href="/david/2022/10/18/" title="Esclavage">Encore</a> un ouvrage dont je pourrais citer de très nombreux passages. Il y aurait tellement de choses à écrire autour de la marche, comme un poncif dont on n’aurait jamais fait le tour car le chemin est différent pour chacun·e. Parfois, il me faut des kilomètres pour dé-penser, d’autres fois au bout de 50&nbsp;mètres je suis déjà pleinement (dans) la forêt. Très difficile d’anticiper le temps et l’espace qui vont être nécessaires à ce jeu de&nbsp;déconnexion/reconnexion.</p>
<p>Réussir à détourner volontairement son attention n’est pas chose aisée. Il y a l’œil du photographe, le pistage de la gélinotte huppée, la peur du chasseur, la recherche d’un campement ou tout simplement d’eau. Le cerveau est un élastique entre le présent et son&nbsp;analyse.</p>
<p>Et puis il y a la marche qui prépare la marche, cet entraînement qui fait partie du chemin aussi, qui en rendra possible un autre. Celui-ci permet de tester le corps, de le pousser plus loin, de vérifier l’équipement parfois. Il a la monotonie que l’on souhaite bien lui&nbsp;accorder.</p>

<blockquote>
<p>Ce qui importe ce n’est pas le chemin mais ce que le marcheur en&nbsp;fait.</p>
<p><cite><em>Marcher, éloge des chemins de la lenteur</em>, David Le&nbsp;Breton</cite></p>
</blockquote>
<p><strong>L’écriture est une forme de marche qui me manque.</strong> J’ai ressenti fortement cette année ce sentiment d’être à l’arrêt dans mes pensées car elles n’arrivaient pas à sortir. Une routine se perd si facilement… j’en arrive même à avoir du mal à l’exprimer ici et&nbsp;maintenant.</p>
<p>En 2023, je mets un pas devant&nbsp;l’autre.</p>
<hr />
<p>Mot du moment&nbsp;: <a href="https://fr.wikipedia.org/wiki/S%C3%A9dition">Sédition</a>.</p>
<p>Bande son du moment&nbsp;: <a href="https://www.youtube-nocookie.com/embed/1WnisEbdpN0">Beds are burning</a> par Julia&nbsp;Stone.</p>
<p>Chaîne Youtube du moment&nbsp;: <a href="https://www.youtube.com/@davidmbird">David M Bird</a>.</p>
<p>Citation du&nbsp;moment&nbsp;:</p>

<blockquote>
<p>Nous nous sommes vendus, et nous n’avons plus les moyens de nous racheter. — <a href="https://toot.portes-imaginaire.org/@loevenbruck/109393130645158796">Henri&nbsp;Loevenbruck</a></p>
</blockquote>
<h2 id="arpenter-plus-loin">Arpenter plus loin <a href="#arpenter-plus-loin" title="Ancre vers cette partie">#</a></h2>
<blockquote>
<p>🚶 Il y a une de mes performances, Le chemin se fait en marchant, très importante pour moi. La phrase provient d’une poésie de 1917&nbsp;d’Antonio Machado, un poète républicain que j’ai toujours adoré. C’est l’idée qu’il n’y a pas de chemin, que c’est toi qui fais ce chemin. “Caminante, no hay camino, se hace camino al andar” (<mark>«&nbsp;Marcheur, il n’y a pas de chemin, le chemin se construit en marchant.&nbsp;»</mark>)</p>
<p><cite><em><a href="https://laviematerielle.substack.com/p/le-jour-ou-il-ne-faudra-plus-etre">«&nbsp;Le jour où il ne faudra plus être féministe, ce sera bien, parce que c’est fatigant.&nbsp;»</a></em>&nbsp;(<a href="/david/cache/2022/e0589fba236da1d8b224c75da8bb82cb/">cache</a>)</cite></p>
</blockquote>

<blockquote lang="en">
<p>🫣 How do you let go of the guilt? How do you not feel it every time you stand up to go for a walk, close your email and put on some headphones, or have a coffee with a colleague to discuss an idea you have? Because sometimes <mark>knowing you are doing the right thing doesn’t translate into feeling it,</mark> and that’s where guilt comes&nbsp;in.</p>
<p>Guilt is insidious. Not only do we usually feel guilt, but then we feel guilty about feeling&nbsp;guilty.</p>
<p><cite><em><a href="https://fs.blog/learning-baggage/">Let Go of the Learning Baggage</a></em>&nbsp;(<a href="/david/cache/2022/33c9132d6cb60f0f40f9b926b596a3c7/">cache</a>)</cite></p>
</blockquote>

<blockquote>
<p>🏝 La dromomanie signifie la manie du déplacement. Or la mobilité – pas simplement le fait d’être en vacances, mais de partir en vacances – a été survalorisée. Comme si rester chez soi était une affaire de ringard. Pour être moderne, voire postmoderne, il faut forcément partir, se sentir «&nbsp;nomade&nbsp;». Pour être heureux, intelligent et serein, il faut quitter son chez-soi. Il y a une connotation positive attachée au fait de se déplacer. L’idée admise qu’on revient forcément l’esprit plus ouvert d’un voyage ou d’un séjour touristique. Comme si un monde où les gens se déplacent facilement devait être plus harmonieux. <mark>Rien ne prouve cette&nbsp;idée.</mark></p>
<p><cite><em><a href="https://cqfd-journal.org/Le-tourisme-est-une-industrie-de">«&nbsp;Le tourisme est une industrie de la compensation&nbsp;»</a></em>&nbsp;(<a href="/david/cache/2022/f0cc8cd88f5fb119ce628b56716ce419/">cache</a>)</cite></p>
</blockquote>

<blockquote lang="en">
<p>💰 I find it telling that no one EVER tries to quantify the paper billionaire argument. They never ask “how big is the total market?” or “what portion <em>could</em> we safely liquidate without some major negative consequence?” No. They simply look at the massive scale of global wealth, and the massive scale of global poverty, and then retreat into cynicism. The millions dead from preventable diseases? Unsolvable, they declare. Those who would address global poverty just “don’t understand how stocks work.” Perhaps it’s easier to just declare the problem unsolvable than to confront the massive human cost of your ideology. But confront it we must. <mark>The money is there, we just need to take&nbsp;it.</mark></p>
<p><cite><em><a href="https://github.com/MKorostoff/1-pixel-wealth/blob/master/THE_PAPER_BILLIONAIRE.md">The Paper Billionaire Argument</a></em>&nbsp;(<a href="/david/cache/2022/0d004d900e6fd42c0390be1ca2e339a5/">cache</a>)</cite></p>
</blockquote>

<blockquote>
<p>✍️ La première condition de l’appropriation étatique (quel qu’en soit l’objet) est nécessairement un inventaire des ressources disponibles — population, terres, rendement des cultures, bétail, réserves stockées disponibles. Sauf que ce type d’information, à l’instar des relevés cadastraux, n’est qu’un instantané bien vite dépassé. Au fur et à mesure que progresse l’effort d’appropriation, il faut constamment mettre à jour les registres de livraisons de céréales, de corvées effectuées, de réquisitions, de reçus, etc. Dès qu’une entité politique embrasse ne serait-ce que quelques milliers de sujets, une certaine forme de notation et de documentation allant au-delà de la simple mémoire et de la tradition orale devient&nbsp;nécessaire.</p>
<p>Ce lien fondamental entre administration étatique et écriture est d’autant plus plausible qu’il semble bien qu’<mark>en Mésopotamie, l’écriture ait été essentiellement utilisée à des fins de comptabilité</mark> pendant plus de cinq siècles avant de commencer à refléter les gloires civilisationnelles auxquelles on l’associe généralement&nbsp;: littérature, mythologies, panégyriques, listes et généalogies royales, chroniques et textes&nbsp;religieux.</p>
<p><cite><em>Homo Domesticus</em>, James C. Scott</cite></p>
</blockquote>

<blockquote lang="en">
<p>🤗 Turns out “soft” skills are quite&nbsp;hard.</p>
<p><cite><em><a href="https://www.baldurbjarnason.com/coaching/">I’m offering research, writing, and notetaking coaching for techies and programmers</a></em>&nbsp;(<a href="/david/cache/2022/edea79e07b920846edef77b35be19c71/">cache</a>)</cite></p>
</blockquote>

<blockquote>
<p>🌱 Pour moi la bombe à graines c’est ça, cette façon dont les actions influence d’autres actions. Je me dis que au-delà de l’influence personnel, d’autres reçoivent ces graines et vont, à leur tour, les faire germer à leur&nbsp;tour.</p>
<p><cite><em><a href="https://blog.pelmel.org/2022/09/30/fresque-du-climat-bombe-a-graines-et-autres-idees/">Fresque du climat, bombe à graines et autres idées…</a></em>&nbsp;(<a href="/david/cache/2022/c1ceebc3a6312283982e840d69f7f010/">cache</a>)</cite></p>
</blockquote>

<blockquote lang="en">
<p>😮 I learned that the Quakers (Friends) don’t just seek <em>consent</em> (as in sociocracy), but seek <em>unity</em> (or <em>concord</em>). <mark>It’s a subtle but important difference.</mark> I noticed how the Friends deliberately slowed down when there were objections. The Swedish Friends call it “framkallningstid” (<em>development time</em>).</p>
<p><cite><em><a href="https://janhoglund.eu/my-10-year-summary/">My 10&nbsp;Year Summary: What I Have Learned</a></em>&nbsp;(<a href="/david/cache/2022/2e20d075443fd560d80e788be22b40bc/">cache</a>)</cite></p>
</blockquote>

<blockquote>
<p>🏢 <mark>Sous un gouvernement qui emprisonne un seul être injustement, la juste place du juste est aussi la prison.</mark> La place idoine aujourd’hui, la seule place que le Massachusetts ait fournie à ses esprits les plus libres et les moins serviles, ce sont les prisons, pour être rejetés et enfermés hors de l’État par lui-même, car ils s’en sont déjà retirés par leurs principes. C’est là que l’esclave fugitif, que le prisonnier mexicain en liberté conditionnelle, que l’Indien venu plaider les torts subis par sa race se retrouveront&#8239;; en ce lieu séparé, plus libre et plus honorable, où l’État situe ceux qui ne sont pas avec lui, mais <em>contre</em> lui —&nbsp;la seule demeure d’un État esclave où l’homme libre puisse résider avec&nbsp;honneur.</p>
<p><cite><em>La Désobéissance civile</em>, Henry David&nbsp;Thoreau</cite></p>
</blockquote>

<blockquote lang="en">
<p>⚔️ I am asked quite often what I think about CSS-in-JS or utility-first frameworks, or even CSS libraries &amp; conventions more generally. And I try to stay out of any spicy flame wars, or gate-keeping&nbsp;nonsense.</p>
<p>For myself? I don’t find many of these tools useful. They don’t solve a problem that I have. […]</p>
<p>(Anyone marketing their product as _The Only Solution_™️ to some _Essential Problem with CSS_™️ is selling you a religion, not a&nbsp;tool.)</p>
<p><cite><em><a href="https://www.oddbird.net/2022/11/11/platform-tools/">When Our Tools Hold Us Back</a></em>&nbsp;(<a href="/david/cache/2022/28c9baf3ff21fbc616ccf13776104ccd/">cache</a>)</cite></p>
</blockquote>

<blockquote lang="en">
<p>👥 It’s likely that both word persons and web persons are in the minority on the modern internet. Most people would rather read short snippets of text rather than long blog posts. Most people would rather use apps than browse the web or consume content rather than write it or create their own websites always. But hopefully <mark>there will always be room for those of us</mark> who enjoy plain text and simple&nbsp;HTML.</p>
<p><cite><em><a href="https://roytang.net/2022/11/word-web-persons/">Word Persons and Web Persons · roytang.net</a></em>&nbsp;(<a href="/david/cache/2022/989dafbb1b7a9141a6f2ecbb8bfb2917/">cache</a>)</cite></p>
</blockquote>

<blockquote>
<p>🐘 Tout fonctionnement interne n’a pas forcément à être démocratique. C’est important pour un pays ou une collectivité territoriale parce qu’on ne choisit pas son pays d’origine et qu’on ne change pas facilement de pays ou de&nbsp;territoire.</p>
<p>La démocratie c’est «&nbsp;le pouvoir au peuple&nbsp;». <mark>Sur Mastodon l’utilisateur a le pouvoir</mark> vu qu’il peut choisir à tout moment une instance avec des règles qui lui conviennent, sans avoir de conséquences négatives&nbsp;significatives.</p>
<p><cite><em><a href="https://n.survol.fr/n/dis-tonton-cest-quoi-les-blocages-dinstance-sur-mastodon">Dis tonton, c’est quoi les blocages d’instance sur Mastodon&#8239;?</a></em>&nbsp;(<a href="/david/cache/2022/e33bbb49c8c58793420809f920c92868/">cache</a>)</cite></p>
</blockquote>

<blockquote>
<p>🏴 Dictionnaire anarchiste des&nbsp;enfants</p>
<p><a href="http://www.atelierdecreationlibertaire.com/Dictionnaire-anarchiste-des-enfants,1025.html">Lire le&nbsp;livre</a></p>
</blockquote>

<blockquote>
<p>🤗 Cher·e modérateurice qui me lis, tu fais un boulot pas facile, et grâce à toi le réseau est plus beau chaque jour. Merci pour ton travail, j’espère que tu as un collectif qui te soutiens, et que se soit le cas ou non, pense à avoir sous la main le numéro d’un·e psychologue, au cas où un jour tu tombes sur quelque chose de vraiment difficile pour&nbsp;toi/vous.</p>
<p><cite><em><a href="https://www.maiwann.net/blog/laventuredelamoderation4/">Avantages et limites — L’aventure de la modération&nbsp;: Chapitre 4</a></em>&nbsp;(<a href="/david/cache/2022/57abeb7689c96b43032c66e7d008f074/">cache</a>)</cite></p>
</blockquote>

<blockquote lang="en">
<p>🚶 Initially I thought I’ll only be walking because I cannot run, but since starting these long morning walks I realised this is something that I want to do continuously in my life. <mark>Walking is just so simple, so anywhere.</mark> I don’t have to be in special clothing or footwear. The slowness of it makes me notice my environment more, and I am more in tune and connected with the universe, whereas cycling and running envelopes me in my own&nbsp;world.</p>
<p><cite><em><a href="https://winnielim.org/journal/walking-longer-distance-scenes-snippets/">walking longer distance: scenes &amp; snippets</a></em>&nbsp;(<a href="/david/cache/2022/0a4a9498ff6edf9552ec59a4511124dc/">cache</a>)</cite></p>
</blockquote>


<nav>
  <p class="center">
    <a rel="prev" href="/david/2022/12/19/" title="Publication précédente : Traces">← Précédent</a> •
    <a href="/david/2022/" title="Liste des publications récentes">↑ En 2022</a>
    
  </p>
</nav>
</article>


<hr>

<footer>
  <p>
    <nobr>
      <a href="/david/" title="Aller à l’accueil"
        ><svg class="icon icon-home">
          <use
            xlink:href="/static/david/icons2/symbol-defs-2022-03.svg#icon-home"
          ></use>
        </svg>
        Accueil</a
      >
    </nobr>
    •
    <nobr>
      <a href="/david/log/" title="Accès au flux RSS"
        ><svg class="icon icon-rss2">
          <use xlink:href="/static/david/icons2/symbol-defs-2022-03.svg#icon-rss2"></use>
        </svg>
        Suivre</a
      >
    </nobr>
    •
    <nobr>
      <a href="http://larlet.com" title="Go to my English profile" data-instant
        ><svg class="icon icon-user-tie">
          <use xlink:href="/static/david/icons2/symbol-defs-2022-03.svg#icon-user-tie"></use>
        </svg>
        Pro</a
      >
    </nobr>
    •
    <nobr>
      <a href="mailto:david%40larlet.fr" title="Envoyer un courriel"
        ><svg class="icon icon-mail">
          <use xlink:href="/static/david/icons2/symbol-defs-2022-03.svg#icon-mail"></use>
        </svg>
        Email</a
      >
    </nobr>
    •
    <nobr>
      <abbr
        class="nowrap"
        title="Hébergeur : Alwaysdata, 62 rue Tiquetonne 75002 Paris, +33184162340"
        ><svg class="icon icon-hammer2">
          <use xlink:href="/static/david/icons2/symbol-defs-2022-03.svg#icon-hammer2"></use>
        </svg>
        Légal</abbr
      >
    </nobr>
  </p>
  <template id="theme-selector">
      <form>
          <fieldset>
              <legend><svg class="icon icon-brightness-contrast">
                <use xlink:href="/static/david/icons2/symbol-defs-2022-03.svg#icon-brightness-contrast"></use>
              </svg> Thème</legend>
              <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>
          </fieldset>
      </form>
  </template>
</footer>
<script src="/static/david/js/instantpage-5.1.0.min.js" type="module"></script>
<script>
    function loadThemeForm(templateName) {
        const themeSelectorTemplate = document.querySelector(templateName)
        const form = themeSelectorTemplate.content.firstElementChild
        themeSelectorTemplate.replaceWith(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 hasDarkRules = false
        for (const styleSheet of Array.from(document.styleSheets)) {
            let mediaRules = []
            for (const cssRule of styleSheet.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) {
                styleSheet.insertRule(mediaRule.cssText)
                hasDarkRules = true
            }
        }
        if (hasDarkRules) {
            loadThemeForm('#theme-selector')
        }
    })
</script>

</body>
</html>