A place to cache linked articles (think custom and personal wayback machine)
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 25KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219
  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>
  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>Covid-19 : comment Emmanuel Macron a tout raté (archive) — David Larlet</title>
  13. <meta name="description" content="Publication mise en cache pour en conserver une trace.">
  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="#f0f0ea">
  24. <meta name="msapplication-config" content="/static/david/icons2/browserconfig.xml">
  25. <meta name="theme-color" content="#f0f0ea">
  26. <!-- Documented, feel free to shoot an email. -->
  27. <link rel="stylesheet" href="/static/david/css/style_2021-01-20.css">
  28. <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. -->
  29. <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>
  30. <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>
  31. <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>
  32. <link rel="preload" href="/static/david/css/fonts/triplicate_t3_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin>
  33. <link rel="preload" href="/static/david/css/fonts/triplicate_t3_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin>
  34. <link rel="preload" href="/static/david/css/fonts/triplicate_t3_italic.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin>
  35. <script>
  36. function toggleTheme(themeName) {
  37. document.documentElement.classList.toggle(
  38. 'forced-dark',
  39. themeName === 'dark'
  40. )
  41. document.documentElement.classList.toggle(
  42. 'forced-light',
  43. themeName === 'light'
  44. )
  45. }
  46. const selectedTheme = localStorage.getItem('theme')
  47. if (selectedTheme !== 'undefined') {
  48. toggleTheme(selectedTheme)
  49. }
  50. </script>
  51. <meta name="robots" content="noindex, nofollow">
  52. <meta content="origin-when-cross-origin" name="referrer">
  53. <!-- Canonical URL for SEO purposes -->
  54. <link rel="canonical" href="http://www.regards.fr/idees-culture/article/covid-19-comment-emmanuel-macron-a-tout-rate">
  55. <body class="remarkdown h1-underline h2-underline h3-underline em-underscore hr-center ul-star pre-tick">
  56. <article>
  57. <header>
  58. <h1>Covid-19 : comment Emmanuel Macron a tout raté</h1>
  59. </header>
  60. <nav>
  61. <p class="center">
  62. <a href="/david/" title="Aller à l’accueil"><svg class="icon icon-home">
  63. <use xlink:href="/static/david/icons2/symbol-defs.svg#icon-home"></use>
  64. </svg> Accueil</a> •
  65. <a href="http://www.regards.fr/idees-culture/article/covid-19-comment-emmanuel-macron-a-tout-rate" title="Lien vers le contenu original">Source originale</a>
  66. </p>
  67. </nav>
  68. <hr>
  69. <p>Pouvait-on éviter une part significative des 100.000 morts – à la mi-avril 2021 – de la Covid-19 en France ? Oui.</p>
  70. <p>Cette réponse nette est glaçante. Elle entre en collision brutale avec la déclaration d’Emmanuel Macron, le 22 juin 2020 : <i>« Nous n’avons pas à rougir, mes chers compatriotes, de notre bilan. Des dizaines de milliers de vies ont été sauvées par nos choix, par nos actions »</i>. Et pourtant, elle ne fait aucun doute. Il suffit, pour l’établir, de comparer la situation française (voire européenne) avec trois des pays les plus à risque, lorsque la Covid-19 a émergé : la Chine, le Vietnam, la Corée. Au 19 avril 2021, le nombre de morts par million d’habitants dus au coronavirus Sars-Cov-2 était de 3,5 en Chine (4845 personnes), 0,4 au Vietnam (35 personnes) et 34,9 en Corée du Sud (1802 personnes). Le même jour, la France comptait 1510 morts par million d’habitants et plus de 101.000 personnes décédées.</p>
  71. <p>L’écart est donc abyssal. Alors même que ces trois pays – celui où la maladie à émergé et deux pays des plus proches géographiquement et par le flux incessant de personnes qui les lient – étaient les plus susceptibles d’afficher le bilan le plus désastreux.</p>
  72. <p> </p>
  73. <p>
  74. <strong>LIRE AUSSI SUR REGARDS.FR<br class="autobr">
  75. &gt;&gt;</strong> <i><a href="http://www.regards.fr/politique/societe/article/vaccin-contre-le-covid-une-nouvelle-lutte-des-classes">Vaccin contre le Covid : une nouvelle lutte des classes ?</a></i><br class="autobr">
  76. <strong>&gt;&gt;</strong> <i><a href="http://www.regards.fr/politique/societe/article/astrazeneca-c-est-quoi-le-probleme">AstraZeneca : c’est quoi le problème ?</a></i></p>
  77. <p> </p>
  78. <p>Aucune autre raison que les politiques sanitaires décidées par les gouvernements de ces trois pays et par le nôtre n’expliquent cet écart. Et la différence est assez aisée à décrire. Après un temps de mauvaise gestion locale, due à l’incapacité du pouvoir politique de la région de Hubeï à réagir correctement, le gouvernement central chinois a pris les bonnes décisions et su les appliquer avec une rigueur implacable et la mobilisation de moyens à la dimension de cet immense pays. Le gouvernement du Vietnam, l’un des pays encore parmi les plus pauvres du monde, a réagi avec une rapidité et une vigueur remarquables qui ont évité au pays de subir la proximité de la Chine d’où provient un flux fort et permanent de touristes. La société coréenne avait « prévu le coup ». En choisissant, par le vote d’une loi par le Parlement en 2015, de doter son <i>Korean Center for Disease Control</i> (KCDC) de pouvoirs étendus en cas de pandémie, elle a réussi à « confiner » le virus, la plupart des décès étant liés à la décision politique de ne pas couper tous les vols en provenance de l’étranger.</p>
  79. <p>Mais allons plus en détail dans le comparatif, et notamment sous l’angle du rapport des gouvernements à l’expertise scientifique.</p>
  80. <p>Quoique... dirait Devos. Avant de s’y plonger, réglons leurs comptes à trois âneries.</p>
  81. <p>Il y aurait eu à choisir entre l’économie et la santé du peuple. Sauver moins de personnes, pour sauver l’emploi (ou les dividendes) des autres. Pour que cette affirmation soit vraie, il faudrait au moins qu’elle soit vérifiée pour les quatre cas observés : France (Europe itou), Chine, Vietnam, Corée du Sud. Or, la réalité est strictement inverse : les économies chinoises, vietnamienne et coréenne ont beaucoup moins souffert que celles de la France et de l’Union européenne. Et il n’est pas nécessaire de faire le tour du monde pour le confirmer : non, il n’y avait pas à choisir, une politique sanitaire efficace était aussi celle qui permettait de limiter le plus la casse économique. En 2020, la Chine a augmenté son PIB (+2,3%) avec un dernier trimestre à +6,5%, le Vietnam a frôlé les +3%, la Corée du Sud n’a baissé le sien que de 1%. Celui de la France s’est écroulé avec -8,3%, du jamais vu depuis la Seconde guerre mondiale.</p>
  82. <p>Seules les dictatures pourraient lutter efficacement contre un tel virus, car il faut imposer des restrictions des libertés individuelles. La Corée du Sud, la Nouvelle Zélande (26 morts), l’Australie (910 morts), deux autres pays avec des résultats similaires, sont des démocraties – du moins pas pire que celles de la France ou d’autres pays de l’Union européenne. Cette affirmation a un problème avec la réalité.</p>
  83. <p>Les politiques sanitaires de gouvernements comme celui d’Emmanuel Macron seraient dictées par la volonté de « museler » le peuple. Avec des masques ajouteront certains, pas très futés. Bien sûr, Macron ne se réjouit pas lorsque la rue se remplit de manifestants contre sa politique économique et sociale. Mais il n’est pas nécessaire d’être télépathe pour savoir qu’il aurait préféré subir les manifestations si c’était le corollaire des millions de touristes dans des hôtels ouverts et les rentrées de TVA des spectacles vivants. Ensuite, que les discours du pouvoir aient tenté d’utiliser la situation et les mesures sanitaires pour légitimer son action dans l’opinion citoyenne est une évidence. Sa politique sanitaire a en permanence couru après la situation, toujours en retard, et c’est de là que vient le prix payé par la population.</p>
  84. <p>Revenons aux détails où gît la compréhension du réel.</p>
  85. <p>Pourquoi et comment le Vietnam a pratiquement évité la pandémie, malgré son exposition majeure au risque ? La réponse se lit dans des dates. L’alerte mondiale de l’Organisation mondiale de la santé (OMS) face au Sars-Cov-2 est lancé le 5 janvier 2020 par son premier bulletin épidémique. Puis le 10 janvier. Que fait Macron le lendemain ? Rien. Que fait le gouvernement vietnamien : il organise une surveillance rigoureuse de ses frontières. Tous les passagers des aéroports internationaux sont soumis à une recherche de suspicion de la Covid-19 et ceux provenant de régions à haut risque sont soumis à une quarantaine obligatoire et conduits directement en bus à la sortie de l’avion dans des centres isolés. Cette surveillance des frontières restera très stricte en février et mars, avec des fermetures de lignes aériennes en provenance des régions à risques et quarantaines pour toutes les arrivées. Que fait Macron le 15 janvier ? Rien. Le même jour, le gouvernement vietnamien publie son plan de lutte, concocté en quatre jours avec l’aide des experts de l’OMS. Un comité scientifique de prévention de l’épidémie est constitué. L’une des premières mesures sera la fermeture des écoles. Les mesures de confinement local sont décidées sur la base des tests : le premier confinement est décidé à la mi-février pour 20 jours et concerne une population rurale de 10.000 habitants après la détection de 7 cas. La stratégie est fondée sur des tests massifs, dès que le pays en a réuni les moyens. Dès la fin avril, le Vietnam peut tester 27.000 personnes par jour et environ 1000 personnes sont testées pour chaque cas détecté.</p>
  86. <p>En Chine, il était déjà trop tard, en raison du retard à l’allumage dans la région du Hubeï, pour éviter un confinement total. Mais il fut si bien réalisé pour les près de 60 millions d’habitants de la région, et la surveillance des flux sortants si bien faite que la stratégie détecter, tracer et isoler (tous les porteurs, sans exception) a pu être appliquée dans tout le reste de la Chine et que les épisodes de confinements locaux (local... à l’échelle de la Chine) sont toujours parvenus à juguler la propagation du virus.</p>
  87. <p>En Corée du Sud, l’autorité sanitaire mise en place par la loi votée en 2015 dispose de pouvoirs étendus. Elle peut tester, tracer et isoler tous les porteurs identifiés. Exiger la géolocalisation par leur téléphone de tous les porteurs durant leur période contagieuse et ainsi enquêter partout où ils sont passés afin de retrouver toutes les personnes à tester. Fermer tout espace recevant du public (transports, entreprises, administrations, lieux d’enseignement) dès lors que le virus y a été détecté. L’application stricte de tous ces dispositifs a permis d’éviter des confinements massifs et limité la casse sanitaire... et socio-économique.</p>
  88. <p>Que signifient ces faits dans le rapport à l’expertise scientifique de ces gouvernements ? Qu’ils ont su la mettre en place, ou utiliser celle de l’OMS, la respecter et prendre sans hésiter les décisions recommandées. Emmanuel Macron a fait courir le bruit par ses conseillers et ministres qu’il lisait la littérature scientifique sur le coronavirus et l’épidémie et qu’il était capable d’une réflexion personnelle à opposer à celle des médecins, virologues et épidémiologistes. Par exemple pour repousser la date d’un confinement. Les dirigeants chinois, vietnamiens, coréens, néo-zélandais ou australiens n’ont jamais prétendu à cette expertise personnelle. Modestement, ils se sont contentés d’écouter leurs experts. On peut juger au résultat.</p>
  89. <p>La date même de la mise en place du Conseil scientifique Covid-19, présidé par Jean-François Delfraissy, sonnait déjà comme une condamnation de la procrastination gouvernementale : le 10 mars 2020. Deux mois moins un jour après la décision du Vietnam de surveiller toute entrée à ses frontières, voire de les fermer si besoin. Deux mois moins six jours après la publication par le Vietnam de son plan de lutte anti-coronavirus. Fin janvier, la ministre de la Santé, Agnès Buzyn déclarait encore que le virus n’arriverait probablement pas en France... alors qu’il avait déjà tué en Italie. Et surtout que l’OMS, le 30 janvier 2020, estimait le risque de pandémie <i>« élevé »</i> au niveau mondial. Durant deux mois, Emmanuel Macron et le gouvernement ont donc considéré qu’ils n’avaient pas besoin d’organiser une expertise scientifique spécifique pour les conseiller alors que le nombre de morts grimpait déjà en Italie, avec 827 décès le 11 mars 2020 pour plus de 12.000 cas confirmés, un chiffre très en dessous de la réalité. La mise en place tardive de ce conseil s’est faite dans la précipitation, au point que son premier avis, publié le 12 mars, deux jours après sa nomination, doit constater qu’il est trop tard pour la stratégie détecter, tracer, isoler. Il doit avertir que laisser se propager le virus dans 50% de la population causerait <i>« des centaines de milliers de morts »</i> (un chiffre confirmé par la suite : un peu moins de 20% des Français ont contracté le virus, 100.000 en sont morts). Il n’y a donc plus d’autre solution qu’un premier confinement, dont le Conseil scientifique prévient que son relâchement se traduira par une deuxième vague épidémique.</p>
  90. <p>Cet avis sur le rapport à l’expertise scientifique est-il exagéré, guidé par une opposition politique au gouvernement en place ? Reportons-nous à l’opinion du britannique Samuel Horton, le rédacteur en chef du <i>Lancet</i>, une revue scientifique médicale internationale. Voici ce qu’il disait dans <i>Le Monde</i> du 26 juin 2020 : <i>« Nous avons publié à la fin du mois de janvier dans le </i>Lancet<i> cinq articles qui décrivaient parfaitement cette nouvelle maladie pour laquelle il n’y avait ni traitement ni vaccin, qui présentait une assez forte mortalité, et qui se transmettait entre humains. Pour reprendre les mots de Gabriel Leung (université de Hongkong), "ce mode de transmission indiquait une forte probabilité de pandémie mondiale". On savait tout cela le 31 janvier. La veille, l’OMS avait déclaré une urgence de santé publique de portée internationale. Et, pendant les six semaines qui ont suivi, la plupart des pays occidentaux n’ont absolument rien fait. C’est une erreur impardonnable. La question est : pourquoi le président [français Emmanuel] Macron, le président [du Conseil italien Giuseppe] Conte, pourquoi le premier ministre [britannique Boris] Johnson, pourquoi le président [américain Donald] Trump n’ont-ils rien fait ? Ne comprenaient-ils pas ce qui se passait en Chine ? Ne croyaient-ils pas les Chinois ? N’ont-ils pas demandé à leurs représentations diplomatiques à Pékin d’enquêter ? Je ne comprends pas. Les preuves étaient très claires, dès fin janvier. Donc je pense que les politiciens vont devoir s’expliquer. »</i></p>
  91. <p>Le retard à organiser une expertise scientifique sur le Sars-Cov-2, directement lié au retard à agir, met en cause le pouvoir politique et les directions des Institutions scientifiques où travaillent les experts disponibles. Le pouvoir politique parce que c’est à lui de prendre conscience de son déficit de savoirs et donc de la nécessité d’organiser un collectif susceptible de le combler. Soit un tel collectif existe de manière permanente – par exemple l’ANSES (agence nationale de sécurité sanitaire de l’alimentation de l’environnement et du travail) ou le duo IRSN/ ASN pour la sûreté nucléaire et la radioprotection. Soit il faut le constituer ad-hoc pour un sujet émergent ou temporaire. Mais il ne semble pas que les directions de l’INSERM ou de l’Institut des sciences de la vie au CNRS, l’Institut Pasteur, la direction de l’APHP, aient pris l’initiative, en janvier et février 2020, de s’adresser au gouvernement pour souligner la nécessité d’une mobilisation en urgence d’une telle expertise. Cette défaillance pose le problème de la nomination de ces directions. À trop choisir des personnalités pour leur proximité politique avec le pouvoir, les gouvernements affaiblissent l’autonomie relative vis à vis d’eux mêmes dont ces institutions et l’activité scientifique ont besoin pour se déployer. Nommer des dirigeants capables de rudoyer le pouvoir politique, parce qu’ils en ont la légitimité scientifique personnelle et le caractère, se révèle plutôt une précaution qu’un risque, lorsque l’on considère ce retard à réagir face à l’urgence.</p>
  92. <p>Ce retard à mettre en place une expertise fiable et les errements du gouvernement lors du début de la crise sanitaire (les masques ne servent à rien...) ont pesé sur la capacité de la société, des citoyens, à utiliser cette expertise. Le Conseil scientifique, malgré les incertitudes, une composition faite à la hâte, a dans l’ensemble correctement fait son travail. Et c’est en refusant de l’écouter qu’Emmanuel Macron a pris des décisions qui ont élevé le niveau de la troisième vague épidémique. Pourtant, des médias, des citoyens, des responsables politiques de tous partis, se sont trop souvent tournés vers d’autres sources. Avec un résultat désastreux, lorsque ces sources se sont révélées totalement pourries, à l’image des Didier Raoult, Christian Peronne et consorts. En synergie avec les chaînes d’info continue et des centaines de milliers de citoyens sur les réseaux sociaux numériques, les propagateurs de fausses nouvelles ont fait une œuvre dévastatrice. Encore aujourd’hui, des millions de Français font confiance à celui qui avait prédit <i>« moins de morts que par accident de trottinettes »</i>, <i>« ce sera l’infection respiratoire la plus facile à traiter avec la chloroquine »</i>, <i>« la deuxième vague c’est une fantaisie »</i>, <i>« l’épidémie va s’arrêter avec l’été »</i> et autres raoulteries. Mais qui est allé faire le beau devant les caméras de télévision au côté de la star marseillaise de BFM ? Le Président Emmanuel Macron. Difficile de faire plus efficace si l’on veut miner la confiance envers le Conseil scientifique que l’on a mis en place. Or, en légitimant et en favorisant des comportements à risque, ces fausses nouvelles ont augmenté le nombre de morts.</p>
  93. <p>Les sociologues s’interrogent déjà sur les évolutions que cette crise va provoquer dans les relations que les citoyens entretiennent avec science et technologies. Positives, négatives ? Il est trop tôt pour le savoir. Mais le paradoxe est éclatant. Jamais, dans l’histoire de la médecine et de la santé publique, la science n’avait été aussi rapide, efficace, décisive. Le séquençage du génome du virus était disponible dès le 11 janvier 2020, découvert et publié par les biologistes chinois. Dès février, les épidémiologistes, pour la première fois dans l’histoire des pandémies virales, pouvaient en modéliser l’impact avec une précision suffisante pour calibrer les réponses sanitaires. Dès ce moment, la recherche vaccinale se mettait en mouvement, avec plusieurs vaccins, notamment ceux utilisant pour la première fois la technologie de l’ARN, disponibles en un temps record. Pour l’instant, seule la recherche de traitements efficaces a échoué. Cet épisode restera dans l’histoire de la médecine comme celui d’un succès phénoménal, sans précédent par sa rapidité. Il faudra un gros coup de chance du virus pour que ses variants échappent aux vaccins existants ou en développement.</p>
  94. <p>Cet épisode aurait donc pu être une démonstration de bonne utilisation de la science et de son expertise par les pouvoirs publics de tous pays. Un moment de grande explication de la méthode scientifique en direction du grand public. Un moment d’humilité des gouvernants, reconnaissant qu’ils ne peuvent utiliser la science en s’appuyant sur leur seule réflexion personnelle. Nous en sommes vraiment très loin.</p>
  95. <p>
  96. <strong>Sylvestre Huet</strong></p>
  97. </article>
  98. <hr>
  99. <footer>
  100. <p>
  101. <a href="/david/" title="Aller à l’accueil"><svg class="icon icon-home">
  102. <use xlink:href="/static/david/icons2/symbol-defs.svg#icon-home"></use>
  103. </svg> Accueil</a> •
  104. <a href="/david/log/" title="Accès au flux RSS"><svg class="icon icon-rss2">
  105. <use xlink:href="/static/david/icons2/symbol-defs.svg#icon-rss2"></use>
  106. </svg> RSS</a> •
  107. <a href="http://larlet.com" title="Go to my English profile" data-instant><svg class="icon icon-user-tie">
  108. <use xlink:href="/static/david/icons2/symbol-defs.svg#icon-user-tie"></use>
  109. </svg> Pro</a> •
  110. <a href="mailto:david%40larlet.fr" title="Envoyer un courriel"><svg class="icon icon-mail">
  111. <use xlink:href="/static/david/icons2/symbol-defs.svg#icon-mail"></use>
  112. </svg> Email</a> •
  113. <abbr class="nowrap" title="Hébergeur : Alwaysdata, 62 rue Tiquetonne 75002 Paris, +33184162340"><svg class="icon icon-hammer2">
  114. <use xlink:href="/static/david/icons2/symbol-defs.svg#icon-hammer2"></use>
  115. </svg> Légal</abbr>
  116. </p>
  117. <template id="theme-selector">
  118. <form>
  119. <fieldset>
  120. <legend><svg class="icon icon-brightness-contrast">
  121. <use xlink:href="/static/david/icons2/symbol-defs.svg#icon-brightness-contrast"></use>
  122. </svg> Thème</legend>
  123. <label>
  124. <input type="radio" value="auto" name="chosen-color-scheme" checked> Auto
  125. </label>
  126. <label>
  127. <input type="radio" value="dark" name="chosen-color-scheme"> Foncé
  128. </label>
  129. <label>
  130. <input type="radio" value="light" name="chosen-color-scheme"> Clair
  131. </label>
  132. </fieldset>
  133. </form>
  134. </template>
  135. </footer>
  136. <script>
  137. function loadThemeForm(templateName) {
  138. const themeSelectorTemplate = document.querySelector(templateName)
  139. const form = themeSelectorTemplate.content.firstElementChild
  140. themeSelectorTemplate.replaceWith(form)
  141. form.addEventListener('change', (e) => {
  142. const chosenColorScheme = e.target.value
  143. localStorage.setItem('theme', chosenColorScheme)
  144. toggleTheme(chosenColorScheme)
  145. })
  146. const selectedTheme = localStorage.getItem('theme')
  147. if (selectedTheme && selectedTheme !== 'undefined') {
  148. form.querySelector(`[value="${selectedTheme}"]`).checked = true
  149. }
  150. }
  151. const prefersColorSchemeDark = '(prefers-color-scheme: dark)'
  152. window.addEventListener('load', () => {
  153. let hasDarkRules = false
  154. for (const styleSheet of Array.from(document.styleSheets)) {
  155. let mediaRules = []
  156. for (const cssRule of styleSheet.cssRules) {
  157. if (cssRule.type !== CSSRule.MEDIA_RULE) {
  158. continue
  159. }
  160. // WARNING: Safari does not have/supports `conditionText`.
  161. if (cssRule.conditionText) {
  162. if (cssRule.conditionText !== prefersColorSchemeDark) {
  163. continue
  164. }
  165. } else {
  166. if (cssRule.cssText.startsWith(prefersColorSchemeDark)) {
  167. continue
  168. }
  169. }
  170. mediaRules = mediaRules.concat(Array.from(cssRule.cssRules))
  171. }
  172. // WARNING: do not try to insert a Rule to a styleSheet you are
  173. // currently iterating on, otherwise the browser will be stuck
  174. // in a infinite loop…
  175. for (const mediaRule of mediaRules) {
  176. styleSheet.insertRule(mediaRule.cssText)
  177. hasDarkRules = true
  178. }
  179. }
  180. if (hasDarkRules) {
  181. loadThemeForm('#theme-selector')
  182. }
  183. })
  184. </script>
  185. </body>
  186. </html>