Repository with sources and generator of https://larlet.fr/david/ https://larlet.fr/david/
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

index.html 22KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326
  1. <!doctype html><!-- This is a valid HTML5 document. -->
  2. <!-- Screen readers, SEO, extensions and so on. -->
  3. <html lang="fr">
  4. <!-- Has to be within the first 1024 bytes, hence before the `title` element
  5. See: https://www.w3.org/TR/2012/CR-html5-20121217/document-metadata.html#charset -->
  6. <meta charset="utf-8">
  7. <!-- Why no `X-UA-Compatible` meta: https://stackoverflow.com/a/6771584 -->
  8. <!-- The viewport meta is quite crowded and we are responsible for that.
  9. See: https://codepen.io/tigt/post/meta-viewport-for-2015 -->
  10. <meta name="viewport" content="width=device-width,initial-scale=1">
  11. <!-- Required to make a valid HTML5 document. -->
  12. <title>Tag #confiance — David Larlet</title>
  13. <meta name="description" content="Publications relatives au tag #confiance">
  14. <!-- That good ol' feed, subscribe :). -->
  15. <link rel="alternate" type="application/atom+xml" title="Feed" href="/david/log/">
  16. <!-- Generated from https://realfavicongenerator.net/ such a mess. -->
  17. <link rel="apple-touch-icon" sizes="180x180" href="/static/david/icons2/apple-touch-icon.png">
  18. <link rel="icon" type="image/png" sizes="32x32" href="/static/david/icons2/favicon-32x32.png">
  19. <link rel="icon" type="image/png" sizes="16x16" href="/static/david/icons2/favicon-16x16.png">
  20. <link rel="manifest" href="/static/david/icons2/site.webmanifest">
  21. <link rel="mask-icon" href="/static/david/icons2/safari-pinned-tab.svg" color="#07486c">
  22. <link rel="shortcut icon" href="/static/david/icons2/favicon.ico">
  23. <meta name="msapplication-TileColor" content="#f7f7f7">
  24. <meta name="msapplication-config" content="/static/david/icons2/browserconfig.xml">
  25. <meta name="theme-color" content="#f7f7f7" media="(prefers-color-scheme: light)">
  26. <meta name="theme-color" content="#272727" media="(prefers-color-scheme: dark)">
  27. <!-- Documented, feel free to shoot an email. -->
  28. <link rel="stylesheet" href="/static/david/css/style_2021-01-20.css">
  29. <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. -->
  30. <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>
  31. <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>
  32. <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>
  33. <link rel="preload" href="/static/david/css/fonts/triplicate_t3_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin>
  34. <link rel="preload" href="/static/david/css/fonts/triplicate_t3_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin>
  35. <link rel="preload" href="/static/david/css/fonts/triplicate_t3_italic.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin>
  36. <script>
  37. function toggleTheme(themeName) {
  38. document.documentElement.classList.toggle(
  39. 'forced-dark',
  40. themeName === 'dark'
  41. )
  42. document.documentElement.classList.toggle(
  43. 'forced-light',
  44. themeName === 'light'
  45. )
  46. }
  47. const selectedTheme = localStorage.getItem('theme')
  48. if (selectedTheme !== 'undefined') {
  49. toggleTheme(selectedTheme)
  50. }
  51. </script>
  52. <style type="text/css">
  53. details[open] summary {
  54. display: none;
  55. }
  56. </style>
  57. <body class="remarkdown h1-underline h2-underline h3-underline em-underscore hr-center ul-star pre-tick" data-instant-intensity="viewport-all">
  58. <header>
  59. <h1>Publications relatives au tag #confiance</h1>
  60. </header>
  61. <nav>
  62. <p class="center">
  63. <a href="/david/" title="Aller à l’accueil"><svg class="icon icon-home">
  64. <use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-home"></use>
  65. </svg> Accueil</a>
  66. • <a rel="tags" href="/david/#tags-2023" title="Liste de toutes les étiquettes"><svg class="icon icon-tags">
  67. <use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-tags"></use>
  68. </svg> Étiquettes</a>
  69. </p>
  70. </nav>
  71. <hr>
  72. <main>
  73. <p>Les plus récentes en premier, les 3 premières sont dépliées et ensuite c’est à la demande, bonne exploration !</p>
  74. <h2><a href="/david/2023/02/25/" title="Lien permanent vers cet article">Transmission</a> (2023-02-25)</h2>
  75. <blockquote lang="en">
  76. <p>So I would. I would grab a coffee, sit down, and start reading. Often we’d share posts back and forth, or chat about some of the more interesting ones we had read. It was something we did that was never on accident… <mark>it was intentional, deliberate.</mark> It was a way, I think, of investing in ourselves while also acknowledging how much we still could learn from&nbsp;others.</p>
  77. <p><cite><em><a href="https://timkadlec.com/remembers/2023-02-23-investing-in-rss/">Investing in RSS</a></em>&nbsp;(<a href="/david/cache/2023/19ec475bd5d92b02fbef043c52ea0589/">cache</a>)</cite></p>
  78. </blockquote>
  79. <p>Il y a ce réveil des blogs qui me rend silencieux, laisser la place d’une attention pour les autres. Et en même temps, ce sont plutôt des réveils que de nouvelles personnes. <strong>Je suis très disposé à me faire le relais de nouveaux blogs si vous en créez&nbsp;un.</strong></p>
  80. <p>Il y a la constatation récurrente que la <a href="https://fr.wikipedia.org/wiki/Loi_de_Conway">Loi de Conway</a> se vérifie dès que je travaille avec des structures à taille inhumaine. L’aliénation de l’humain aux processus est l’un des grands mystères de ce temps. L’expérience de ces hiérarchies me permet d’attendre d’être en communication avec LA personne compétente pour aller de&nbsp;l’avant.</p>
  81. <p>Il y a la transmission douloureuse, je me demande par exemple si sa génération sera la dernière à pouvoir faire du ski de fond dans les parcs montréalais. Au même titre qu’il a été l’un des derniers à pouvoir patiner sur le Lac aux Castors du Mont-Royal. Et encore, il était dans la&nbsp;poussette.</p>
  82. <p>Il y a cette rupture vraiment pas conventionnelle qui me questionne sur le fait qu’une transmission ultime puisse passer par la destruction pour voir ce qui est recréé ensuite, valider les acquis et les envies en quelque sorte. Tellement difficile de décortiquer certaines intentions sans raviver les&nbsp;tensions.</p>
  83. <hr />
  84. <blockquote>
  85. <p>🔄 Que se passe-t-il quand un LLM se nourrit en continu&#8239;&#8239;? Soit il se retrouve exposé à des <mark>contenus produits par d’autres LLM</mark>, soit il continue à être alimenté par des données hiérarchisées par des scrutins alimentés par des personnes qui, elles-mêmes, sont exposées à des contenus produits par un LLM.&nbsp;Quel impact cela pourrait-il avoir sur la qualité des&nbsp;contenus&#8239;&#8239;?</p>
  86. <p><cite><em><a href="https://boris.schapira.dev/notes/2023-02-des-questions/">Des questions · Boris Schapira</a></em>&nbsp;(<a href="/david/cache/2023/482252d2b8806e99bc30ffab2b2c51c9/">cache</a>)</cite></p>
  87. </blockquote>
  88. <blockquote lang="en">
  89. <p>🚜 Today’s cloud services have the look and feel of that tractor. They’re conceived by infrastructure people who care about efficient computation, fast networking, and cheap storage. The comfort and convenience of the developers who need to drive these services to build end-user facing applications has been an&nbsp;afterthought.</p>
  90. <p>Both the tractor and the cloud service of the past made sense: <mark>The majority of people who made the purchasing decisions didn’t operate them</mark>, and those who did had little influence. Why bother making them nice to&nbsp;operate?</p>
  91. <p><cite><em><a href="https://pydantic.dev/announcement/">Company Announcement | Pydantic</a></em>&nbsp;(<a href="/david/cache/2023/0f8bbba127c48a13b35fdf265c2dc106/">cache</a>)</cite></p>
  92. </blockquote>
  93. <blockquote lang="en">
  94. <p>🤸 It comes down to this annoying, upsetting, stupid fact: <mark>the only way to build a great product is to use it every day, to stare at it, to hold it in your hands to feel its lumps.</mark> The data and customers will lie to you but the product never will. And most product orgs suck because they simply don’t use the products that they’re building; they ship incremental nothings without direction because they’re looking at spreadsheets all day long filled with junk data&nbsp;nothings.</p>
  95. <p><cite><em><a href="https://www.robinrendle.com/notes/vibe-driven-development/">Vibe Driven Development</a></em>&nbsp;(<a href="/david/cache/2023/660b2a27b116787ac44e536e6c9dbcd3/">cache</a>)</cite></p>
  96. </blockquote>
  97. <blockquote lang="en">
  98. <p>🧑‍⚖️ Traditional open source is based on the flawed premise that technology is fundamentally neutral, and that unrestricted access to source code— even for explicitly “evil” purposes— is in fact an unqualified good. But around the world, open source developers are starting to realize that the software that they create, with its tremendous potential to change the world for the better, is also being abused to sustain and promote systems of inequity and injustice, globally, and at unprecedented&nbsp;scale.</p>
  99. <p>The Hippocratic License 3.0 (HL3) aims <mark>to confront the potential harms and abuses technology can have</mark> on fundamental human rights. It empowers open source communities to establish a clear set of ethical standards that licensees must abide by in order to adopt their&nbsp;code.</p>
  100. <p><cite><em><a href="https://firstdonoharm.dev/">The Hippocratic License</a></em>&nbsp;(<a href="/david/cache/2023/e44bfaaecad989f67cb2032fac000276/">cache</a>)</cite></p>
  101. </blockquote>
  102. <blockquote lang="en">
  103. <p>😮 I am all for radical criticism, especially targeted at billion-dollar tech corporations and powerful project leaders who <a href="https://fediverse.zachleat.com/@zachleat/109830047951867907">try to silence critics</a>. We need <mark>to hold them accountable</mark> for tech that produces harmful, subpar web experiences. They deserve their decent share of “told you&nbsp;so”.</p>
  104. <p><cite><em><a href="https://molily.de/update-on-robust-javascript/">An update on Robust Client-Side JavaScript</a></em>&nbsp;(<a href="/david/cache/2023/9718ae2062146285e1c4f406240e04af/">cache</a>)</cite></p>
  105. </blockquote>
  106. <blockquote lang="en">
  107. <p>🤗 As we build stuff, we make trade-off decisions like this all the time. If I have a point, it’s that we should consider these tradeoffs <mark>with our most junior teammates in mind;</mark> how much complexity are we adding for them? Is it worth&nbsp;it?</p>
  108. <p><cite><em><a href="https://www.joshwcomeau.com/career/clever-code-considered-harmful/">Clever Code Considered Harmful</a></em>&nbsp;(<a href="/david/cache/2023/a09b5bf450d2cf86fb9e9d6f13b070e0/">cache</a>)</cite></p>
  109. </blockquote>
  110. <h2><a href="/david/2023/02/09/" title="Lien permanent vers cet article">Allumage</a> (2023-02-09)</h2>
  111. <p>Démarrer un nouveau projet avec une nouvelle équipe est un sentiment qui m’est incroyable. J’ai passé mon année 2022&nbsp;à faire —&nbsp;entre autres&nbsp;— des petits produits pour Scopyleft et je ne réalise que maintenant à quel point ça me permet de démarrer plus rapidement aujourd’hui pour un site que l’on fait avec <a href="https://www.maiwann.net/">Maïtané</a> pour la&nbsp;Croix-Rouge.</p>
  112. <p>La structure est toujours un peu la même&nbsp;: des contenus dans du markdown, du déploiement continu de fichiers HTML statiques en utilisant l’intégration continue et l’hébergement de GitLab. Une URL de démonstration dès le premier <em>commit</em>. À partir de là, on peut rajouter des traductions, des images, une navigation particulière mais la base est l’affaire d’un copier-coller de quelques fichiers et d’une centaine de lignes de&nbsp;Python.</p>
  113. <p>Soigner l’allumage technique, c’est avoir plus de temps pour réfléchir à l’accessibilité des données et à l’autonomie des personnes qui vont maintenir le site, c’est permettre de s’adapter aux besoins du public sans être contraint par un cadre, c’est prendre le temps de s’intéresser au problème <em>métier</em> à résoudre. C’est prendre confiance dans de petits outils résilients et&nbsp;frugaux.</p>
  114. <p>Que mon eXpérience de Développeur (DX) s’en trouve être améliorée car j’aspire à cultiver de petits bonsaïs numériques n’est qu’un effet de&nbsp;bord.</p>
  115. <hr />
  116. <blockquote lang="en">
  117. <p>🦕 I have been using it from day one of this blog (né Year II before <abbr title="Loïc Le Meur, coucou Loïc , long time no see!">LLM</abbr>).</p>
  118. <p><cite><em><a href="https://www.padawan.info/en/2023/02/the-content-management-system-of-my-dreams-part-1-a-little-bit-of-history.html">The Content Management System of my Dreams (part 1) - A little bit of history</a></em>&nbsp;(<a href="/david/cache/2023/65169d7164c8bf5790a224d45a95adb7/">cache</a>)</cite></p>
  119. </blockquote>
  120. <blockquote lang="en">
  121. <p>🧱 Think very hard about that word. What exactly is <em>dynamic</em> on your home page? Are you speaking about that Top News thingy? How often do they change? <mark>Are you doing this to satisfy yourself</mark> (some content editors have the same proclivity than developers to throw a tantrum because their new content does not appear instantaneously on the site)? Is this a business requirement or a real need of your&nbsp;users?</p>
  122. <p><cite><em><a href="https://www.padawan.info/en/2023/02/the-content-management-system-of-my-dreams-part-2-the-trouble-with-dynamic-publishing.html">The Content Management System of my Dreams (part 2) - The trouble with dynamic publishing</a></em>&nbsp;(<a href="/david/cache/2023/f8b7c3246cf1d4e06c735ee163be32a0/">cache</a>)</cite></p>
  123. </blockquote>
  124. <blockquote lang="en">
  125. <p>🧭 Since <mark>every direction is technically “North”</mark> from here, we use a grid overlay, to bring some semblance of order to our surroundings. The prevailing winds here come from “Grid&nbsp;North”.</p>
  126. <p><cite><em><a href="https://brr.fyi/posts/south-pole-topography">South Pole Topography</a></em>&nbsp;(<a href="/david/cache/2023/f9e282fb545b5c1f50dfa1c0d98c50e3/">cache</a>)</cite></p>
  127. </blockquote>
  128. <h2><a href="/david/2023/02/05/" title="Lien permanent vers cet article">Attente</a> (2023-02-05)</h2>
  129. <p>Il y a l’attente qui rime avec patience. Le corps est prêt, le mental jamais tout à fait mais la confiance s’est progressivement construite. L’équipement a été soigneusement évalué et testé. Le corps est stressé mais en demande de libération. Le retenir, encore un peu, c’est la mauvaise expérience qui&nbsp;parle.</p>
  130. <p>Il y a l’attente qui rime avec panique lorsqu’à une semaine près on se prenait un vortex polaire et les températures extrêmes qui vont avec. Lors de la réunion d’information ils nous ont bien précisé qu’iels s’étaient pris -37°C il y a trois ans… peut-on vraiment <a href="/david/2023/01/03/" title="Préparation">se préparer</a> à&nbsp;ça&#8239;?</p>
  131. <p>Il y a l’attente qui rime avec anxiété. La peur de la blessure du dernier moment ou de l’oubli d’une pièce critique de matériel, que la voiture lâche le jour J ou qu’une maladie vienne tout gâcher avant le départ. Tout peut encore arriver. La prudence ne suffit&nbsp;pas.</p>
  132. <p>Il y a l’attente qui rime avec apaisement. Avoir eu la possibilité de tester son système de lutte contre le froid dans des conditions extrêmes et d’avoir pu vérifier sa pertinence alors qu’il restait plusieurs inconnues. Avoir fini par acheter un duvet plus chaud pour ne pas être trop limite. Ça&nbsp;resservira.</p>
  133. <p>Il y a l’attente qui permet d’apprécier de pouvoir encore se permettre ce genre de truc, de l’envisager peut-être comme une répétition. Il y a tant d’espaces à&nbsp;découvrir.</p>
  134. <h2><a href="/david/2023/01/22/" title="Lien permanent vers cet article">Jour&nbsp;2</a> (2023-01-22)</h2>
  135. <details>
  136. <summary>Déplier pour lire le contenu de la publication</summary>
  137. <p>Deux objectifs au réveil&nbsp;: minuter le rangement du camp et ne pas faire de&nbsp;feu.</p>
  138. <p>J’ai rarement l’occasion de me presser lorsque je suis en forêt. À part peut-être si je sais qu’un orage s’en vient. Or, j’ai besoin de savoir en combien de temps est-ce que je peux avoir mon traîneau de prêt car <a href="/david/2023/01/03/" title="Préparation">qui dit groupe</a> dit&nbsp;synchronisation.</p>
  139. <p>Il m’a fallu environ une heure, sans compter le petit déjeuner que je peux envisager froid/en route. J’ai des pistes d’améliorations mais ça va beaucoup dépendre des conditions aussi, notamment du vent. Ce n’est pas la même chose de devoir plier bagage et préparer son eau de la journée dans une tente ou&nbsp;pas&#8239;!</p>
  140. <p>Je voulais aussi tester le réchaud à alcool dans des conditions froides mais le pré-chauffeur n’a pas été nécessaire vu la température. En tout cas, la fait de chronométrer tout ça m’a permis de vérifier qu’il était possible de se passer de feu pour se réchauffer, j’ai fini en&nbsp;sueur.</p>
  141. <p>L’effet de bord de cet empressement était aussi de pouvoir prendre le départ après le regel de la nuit et mettre toutes les chances de mon côté pour ne pas prendre un bain&nbsp;matinal.</p>
  142. <figure>
  143. <a href="#2023-01-22-ski-retour"
  144. title="Cliquer pour une version haute résolution">
  145. <img src="/static/david/2023/2023-01-22-ski-retour.jpg" alt="Un ski dans les traces de la veille, sur le chemin du retour."
  146. loading="lazy" width="2048" height="2731" />
  147. </a>
  148. <a href="#_" class="lightbox" id="2023-01-22-ski-retour">
  149. <img src="/static/david/2023/2023-01-22-ski-retour.jpg" alt="Un ski dans les traces de la veille, sur le chemin du retour."
  150. loading="lazy" width="2048" height="2731" />
  151. </a>
  152. <figcaption>Le retour dans ses traces demande tellement moins d’énergie&nbsp;!</figcaption>
  153. </figure>
  154. <p>Le plus fastidieux reste de rapatrier tout l’équipement jusqu’à la voiture. Il est encore tôt et je décide d’aller me promener sur l’autre rive du lac, cette fois-ci en raquettes et avec un sac bien plus léger. C’est toujours agréable de se sentir voler, comme libéré du poids induit par toute cette recherche de mise en&nbsp;confiance.</p>
  155. </details>
  156. </main>
  157. <hr>
  158. <footer>
  159. <p>
  160. <nobr>
  161. <a href="/david/" title="Aller à l’accueil"
  162. ><svg class="icon icon-home">
  163. <use
  164. xlink:href="/static/david/icons2/symbol-defs-2022-03.svg#icon-home"
  165. ></use>
  166. </svg>
  167. Accueil</a
  168. >
  169. </nobr>
  170. <nobr>
  171. <a href="/david/log/" title="Accès au flux RSS"
  172. ><svg class="icon icon-rss2">
  173. <use xlink:href="/static/david/icons2/symbol-defs-2022-03.svg#icon-rss2"></use>
  174. </svg>
  175. Suivre</a
  176. >
  177. </nobr>
  178. <nobr>
  179. <a href="http://larlet.com" title="Go to my English profile" data-instant
  180. ><svg class="icon icon-user-tie">
  181. <use xlink:href="/static/david/icons2/symbol-defs-2022-03.svg#icon-user-tie"></use>
  182. </svg>
  183. Pro</a
  184. >
  185. </nobr>
  186. <nobr>
  187. <a href="mailto:david%40larlet.fr" title="Envoyer un courriel"
  188. ><svg class="icon icon-mail">
  189. <use xlink:href="/static/david/icons2/symbol-defs-2022-03.svg#icon-mail"></use>
  190. </svg>
  191. Email</a
  192. >
  193. </nobr>
  194. <nobr>
  195. <abbr
  196. class="nowrap"
  197. title="Hébergeur : Alwaysdata, 62 rue Tiquetonne 75002 Paris, +33184162340"
  198. ><svg class="icon icon-hammer2">
  199. <use xlink:href="/static/david/icons2/symbol-defs-2022-03.svg#icon-hammer2"></use>
  200. </svg>
  201. Légal</abbr
  202. >
  203. </nobr>
  204. </p>
  205. <template id="theme-selector">
  206. <form>
  207. <fieldset>
  208. <legend><svg class="icon icon-brightness-contrast">
  209. <use xlink:href="/static/david/icons2/symbol-defs-2022-03.svg#icon-brightness-contrast"></use>
  210. </svg> Thème</legend>
  211. <label>
  212. <input type="radio" value="auto" name="chosen-color-scheme" checked> Auto
  213. </label>
  214. <label>
  215. <input type="radio" value="dark" name="chosen-color-scheme"> Foncé
  216. </label>
  217. <label>
  218. <input type="radio" value="light" name="chosen-color-scheme"> Clair
  219. </label>
  220. </fieldset>
  221. </form>
  222. </template>
  223. </footer>
  224. <script src="/static/david/js/instantpage-5.1.0.min.js" type="module"></script>
  225. <script>
  226. function loadThemeForm(templateName) {
  227. const themeSelectorTemplate = document.querySelector(templateName)
  228. const form = themeSelectorTemplate.content.firstElementChild
  229. themeSelectorTemplate.replaceWith(form)
  230. form.addEventListener('change', (e) => {
  231. const chosenColorScheme = e.target.value
  232. localStorage.setItem('theme', chosenColorScheme)
  233. toggleTheme(chosenColorScheme)
  234. })
  235. const selectedTheme = localStorage.getItem('theme')
  236. if (selectedTheme && selectedTheme !== 'undefined') {
  237. form.querySelector(`[value="${selectedTheme}"]`).checked = true
  238. }
  239. }
  240. const prefersColorSchemeDark = '(prefers-color-scheme: dark)'
  241. window.addEventListener('load', () => {
  242. let hasDarkRules = false
  243. for (const styleSheet of Array.from(document.styleSheets)) {
  244. let mediaRules = []
  245. for (const cssRule of styleSheet.cssRules) {
  246. if (cssRule.type !== CSSRule.MEDIA_RULE) {
  247. continue
  248. }
  249. // WARNING: Safari does not have/supports `conditionText`.
  250. if (cssRule.conditionText) {
  251. if (cssRule.conditionText !== prefersColorSchemeDark) {
  252. continue
  253. }
  254. } else {
  255. if (cssRule.cssText.startsWith(prefersColorSchemeDark)) {
  256. continue
  257. }
  258. }
  259. mediaRules = mediaRules.concat(Array.from(cssRule.cssRules))
  260. }
  261. // WARNING: do not try to insert a Rule to a styleSheet you are
  262. // currently iterating on, otherwise the browser will be stuck
  263. // in a infinite loop…
  264. for (const mediaRule of mediaRules) {
  265. styleSheet.insertRule(mediaRule.cssText)
  266. hasDarkRules = true
  267. }
  268. }
  269. if (hasDarkRules) {
  270. loadThemeForm('#theme-selector')
  271. }
  272. })
  273. </script>
  274. </body>
  275. </html>