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 12KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207
  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>Vengeance — David Larlet</title>
  13. <meta name="description" content="The greatest regret of my life is my reflexive, unquestioning support for that decision. I was outraged, yes, but that was only the beginning of a process in which my heart completely defeated my rational judgment. I accepted all the claims retailed by the media as facts, and I repeated them as if I were being paid for it. I wanted to be a liberator. I wanted to free the oppressed. I embraced the truth constructed for the good of the state, which in my passion I confused with the good of the country. It was as if whatever individual politics I’d developed had crashed—the anti-institutional hacker ethos instilled in me online, and the apolitical patriotism I’d inherited from my parents, both wiped from my system—and I’d been rebooted as a willing vehicle of vengeance. The sharpest part of the humiliation comes from acknowledging how easy this transformation was, and how readily I welcomed it.">
  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. <body class="remarkdown h1-underline h2-underline h3-underline em-underscore hr-center ul-star pre-tick" data-instant-intensity="viewport-all">
  53. <article>
  54. <header>
  55. <h1>Vengeance</h1>
  56. </header>
  57. <nav>
  58. <p class="center">
  59. <a rel="prev" href="/david/2021/09/10/" title="Publication précédente : Injustice">← Précédent</a> •
  60. <a href="/david/" title="Aller à l’accueil"><svg class="icon icon-home">
  61. <use xlink:href="/static/david/icons2/symbol-defs.svg#icon-home"></use>
  62. </svg> Accueil</a>
  63. • <a rel="next" href="/david/2021/09/13/" title="Publication suivante : Démission">Suivant →</a>
  64. </p>
  65. </nav>
  66. <hr>
  67. <blockquote lang="en">
  68. <p>The greatest regret of my life is my reflexive, unquestioning support for that decision. I was outraged, yes, but that was only the beginning of a process in which my heart completely defeated my rational judgment. I accepted all the claims retailed by the media as facts, and I repeated them as if I were being paid for it. I wanted to be a liberator. I wanted to free the oppressed. I embraced the truth constructed for the good of the state, which in my passion I confused with the good of the country. It was as if whatever individual politics I’d developed had crashed—the anti-institutional hacker ethos instilled in me online, and the apolitical patriotism I’d inherited from my parents, both wiped from my system—and <mark>I’d been rebooted as a willing vehicle of vengeance.</mark> The sharpest part of the humiliation comes from acknowledging how easy this transformation was, and how readily I welcomed it.</p>
  69. <p><cite><em><a href="https://edwardsnowden.substack.com/p/9-12">9/12 - by Edward Snowden</a></em> (<a href="/david/cache/2021/6201ca5ee00ceafd79ab4a889a20419e/">cache</a>)</cite></p>
  70. </blockquote>
  71. <p>Lire Edward Snowden, 20&nbsp;ans après. Essayer de comprendre avec son recul, ses mots. Ce qui a pu se passer dans des millions de têtes, pas si loin d’ici. Et les conséquences que cela a pu avoir, les abus, les lanceurs d’alertes.</p>
  72. <p>La polarisation du monde, sa guerre immonde. Des dommages collatéraux, loin. Le souvenir, entretenu, ravivé. Restons terrorisé·es et dociles, canalisés.</p>
  73. <p>Les <em>traders</em> se défenestrent, Ben Laden fait un plongeon, on réserve le même sort aux afghans nous ayant aidé. Pas de parachutes pour notre culpabilité, la vengeance doit montrer la brutalité de cet écrasement. Chutes silencieuses, sur-commentées.</p>
  74. <p>Les victimes sont tombées 99&nbsp;fois, je me relève sans foi.</p>
  75. <hr />
  76. <p>Après ceci, je suis à peu près assuré de ne pas pouvoir entrer chez les voisins.</p>
  77. <blockquote lang="en">
  78. <p>It’s not a bug, it’s a feature. (Developer edition)</p>
  79. </blockquote>
  80. <blockquote lang="en">
  81. <p>It’s not a blunder, it’s a gambit. (Chess edition)</p>
  82. </blockquote>
  83. <hr />
  84. <p>Note&nbsp;: Substack propose un <a href="https://edwardsnowden.substack.com/feed/">flux RSS</a> pour les publications si vous préférez ce moyen. C’est suffisamment rare pour le remarquer (coucou tinyletter). Heureusement, des <a href="https://kill-the-newsletter.com/">outils</a> permettent de palier ce manque.</p>
  85. <hr />
  86. <blockquote>
  87. <p>C’est cool<br />
  88. Ma jeunesse s’écoule<br />
  89. Entre un mur qui tombe et deux tours qui s’écroulent<br />
  90. Eh ouais c’est cool<br />
  91. Ma jeunesse s’écoule</p>
  92. <p><cite><em>C’est cool 🎶</em>, Gaël Faye</cite></p>
  93. </blockquote>
  94. <nav>
  95. <p class="center">
  96. <a rel="prev" href="/david/2021/09/10/" title="Publication précédente : Injustice">← Précédent</a> •
  97. <a href="/david/2021/" title="Liste des publications récentes">↑ En 2021</a>
  98. • <a rel="next" href="/david/2021/09/13/" title="Publication suivante : Démission">Suivant →</a>
  99. </p>
  100. </nav>
  101. </article>
  102. <hr>
  103. <footer>
  104. <p>
  105. <a href="/david/" title="Aller à l’accueil"><svg class="icon icon-home">
  106. <use xlink:href="/static/david/icons2/symbol-defs.svg#icon-home"></use>
  107. </svg> Accueil</a> •
  108. <a href="/david/log/" title="Accès au flux RSS"><svg class="icon icon-rss2">
  109. <use xlink:href="/static/david/icons2/symbol-defs.svg#icon-rss2"></use>
  110. </svg> Suivre</a> •
  111. <a href="http://larlet.com" title="Go to my English profile" data-instant><svg class="icon icon-user-tie">
  112. <use xlink:href="/static/david/icons2/symbol-defs.svg#icon-user-tie"></use>
  113. </svg> Pro</a> •
  114. <a href="mailto:david%40larlet.fr" title="Envoyer un courriel"><svg class="icon icon-mail">
  115. <use xlink:href="/static/david/icons2/symbol-defs.svg#icon-mail"></use>
  116. </svg> Email</a> •
  117. <abbr class="nowrap" title="Hébergeur : Alwaysdata, 62 rue Tiquetonne 75002 Paris, +33184162340"><svg class="icon icon-hammer2">
  118. <use xlink:href="/static/david/icons2/symbol-defs.svg#icon-hammer2"></use>
  119. </svg> Légal</abbr>
  120. </p>
  121. <template id="theme-selector">
  122. <form>
  123. <fieldset>
  124. <legend><svg class="icon icon-brightness-contrast">
  125. <use xlink:href="/static/david/icons2/symbol-defs.svg#icon-brightness-contrast"></use>
  126. </svg> Thème</legend>
  127. <label>
  128. <input type="radio" value="auto" name="chosen-color-scheme" checked> Auto
  129. </label>
  130. <label>
  131. <input type="radio" value="dark" name="chosen-color-scheme"> Foncé
  132. </label>
  133. <label>
  134. <input type="radio" value="light" name="chosen-color-scheme"> Clair
  135. </label>
  136. </fieldset>
  137. </form>
  138. </template>
  139. </footer>
  140. <script src="/static/david/js/instantpage-5.1.0.min.js" type="module"></script>
  141. <script>
  142. function loadThemeForm(templateName) {
  143. const themeSelectorTemplate = document.querySelector(templateName)
  144. const form = themeSelectorTemplate.content.firstElementChild
  145. themeSelectorTemplate.replaceWith(form)
  146. form.addEventListener('change', (e) => {
  147. const chosenColorScheme = e.target.value
  148. localStorage.setItem('theme', chosenColorScheme)
  149. toggleTheme(chosenColorScheme)
  150. })
  151. const selectedTheme = localStorage.getItem('theme')
  152. if (selectedTheme && selectedTheme !== 'undefined') {
  153. form.querySelector(`[value="${selectedTheme}"]`).checked = true
  154. }
  155. }
  156. const prefersColorSchemeDark = '(prefers-color-scheme: dark)'
  157. window.addEventListener('load', () => {
  158. let hasDarkRules = false
  159. for (const styleSheet of Array.from(document.styleSheets)) {
  160. let mediaRules = []
  161. for (const cssRule of styleSheet.cssRules) {
  162. if (cssRule.type !== CSSRule.MEDIA_RULE) {
  163. continue
  164. }
  165. // WARNING: Safari does not have/supports `conditionText`.
  166. if (cssRule.conditionText) {
  167. if (cssRule.conditionText !== prefersColorSchemeDark) {
  168. continue
  169. }
  170. } else {
  171. if (cssRule.cssText.startsWith(prefersColorSchemeDark)) {
  172. continue
  173. }
  174. }
  175. mediaRules = mediaRules.concat(Array.from(cssRule.cssRules))
  176. }
  177. // WARNING: do not try to insert a Rule to a styleSheet you are
  178. // currently iterating on, otherwise the browser will be stuck
  179. // in a infinite loop…
  180. for (const mediaRule of mediaRules) {
  181. styleSheet.insertRule(mediaRule.cssText)
  182. hasDarkRules = true
  183. }
  184. }
  185. if (hasDarkRules) {
  186. loadThemeForm('#theme-selector')
  187. }
  188. })
  189. </script>
  190. </body>
  191. </html>