Repository with sources and generator of https://larlet.fr/david/ https://larlet.fr/david/
您最多选择25个主题 主题必须以字母或数字开头,可以包含连字符 (-),并且长度不得超过35个字符

index.html 11KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183
  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>Questionnements — David Larlet</title>
  13. <meta name="description" content="Parfois, l’individu ne trouve jamais sa place dans le monde, il se sent différent et peu concerné par les mouvements autour de lui. Immergé dans l’exil intérieur, retranché de la sociabilité même s’il accepte d’y participer sous une forme minimale, il est séparé de l’univers des autres et existe dans son propre monde. Le poids de l’individualisation, la nécessité de toujours fournir l’effort d’être soi et de produire les apparences d’une présence au sein de la sociabilité sont toujours menacés par la dépression mais également par une forme plus discrète, celle de l’impersonnalisation qui consiste à ne plus se prêter à la comédie de la disponibilité aux autres en occupant un angle mort au sein de la sociabilité. L’individu est détaché, indifférent, mais il est toujours là sans se sentir tenu de participer. Face aux mouvements du monde qu’il n’arrive plus à suivre, il revendique un droit à l’abstention, au silence, à l’effacement, au retrait.">
  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. <body class="remarkdown h1-underline h2-underline h3-underline em-underscore hr-center ul-star pre-tick" data-instant-intensity="viewport-all">
  52. <article>
  53. <header>
  54. <h1>Questionnements</h1>
  55. </header>
  56. <nav>
  57. <p class="center">
  58. <a rel="prev" href="/david/2021/01/20/" title="Publication précédente : Adaptation">← Précédent</a> •
  59. <a href="/david/" title="Aller à l’accueil"><svg class="icon icon-home">
  60. <use xlink:href="/static/david/icons2/symbol-defs.svg#icon-home"></use>
  61. </svg> Accueil</a>
  62. • <a rel="next" href="/david/2021/01/22/" title="Publication suivante : Tentation">Suivant →</a>
  63. </p>
  64. </nav>
  65. <hr>
  66. <blockquote>
  67. <p>Parfois, l’individu ne trouve jamais sa place dans le monde, il se sent différent et peu concerné par les mouvements autour de lui. Immergé dans l’exil intérieur, retranché de la sociabilité même s’il accepte d’y participer sous une forme minimale, il est séparé de l’univers des autres et existe dans son propre monde. Le poids de l’individualisation, la nécessité de toujours fournir l’effort d’être soi et de produire les apparences d’une présence au sein de la sociabilité sont toujours menacés par la dépression mais également par une forme plus discrète, celle de l’impersonnalisation qui consiste à ne plus se prêter à la comédie de la disponibilité aux autres en occupant un angle mort au sein de la sociabilité. L’individu est détaché, indifférent, mais il est toujours là sans se sentir tenu de participer. <mark>Face aux mouvements du monde qu’il n’arrive plus à suivre</mark>, il revendique un droit à l’abstention, au silence, à l’effacement, au retrait.</p>
  68. <p><cite><em>Disparaître de soi</em>, David Le Breton</cite></p>
  69. </blockquote>
  70. <p>Je me rappelle à la même période il y a un an, je faisais déjà le hamster en ski de fond sur l’île d’à côté. Je tournais en me posant des questions sur mon implication dans la visibilité/popularité de l’État français et de son gouvernement actuel. À l’époque, il s’agissait de savoir s’il était vraiment <a href="/david/2020/04/18/">pertinent</a> de le rendre en capacité d’encaisser un <abbr title="Distributed Denial of Service attack">DDoS</abbr> d’amendements de la part de <em>La France Insoumise</em> (pour rappel, 42&#8239;000&nbsp;amendements à traiter en une même séance pour le Projet de loi sur les retraites, 49.3, etc.).</p>
  71. <p>Aujourd’hui, tout a changé et rien n’a changé. La situation est <a href="/david/2020/05/26/">bien différente</a> mais je me pose pourtant les mêmes questions de fond (sans skis, enfin si, bref). Dans quelle mesure est-ce que je cautionne une doctrine en essayant de la rendre intelligible par le plus grand nombre&#8239;? À qui profite <em>vraiment</em> la réactivité dont mon <a href="/david/blog/2019/faire-equipe/">équipe</a> peut faire preuve&#8239;?</p>
  72. <p><strong>De plus en plus tenté de passer du coq à l’arbre…</strong></p>
  73. <nav>
  74. <p class="center">
  75. <a rel="prev" href="/david/2021/01/20/" title="Publication précédente : Adaptation">← Précédent</a> •
  76. <a href="/david/2021/" title="Liste des publications récentes">↑ En 2021</a>
  77. • <a rel="next" href="/david/2021/01/22/" title="Publication suivante : Tentation">Suivant →</a>
  78. </p>
  79. </nav>
  80. </article>
  81. <hr>
  82. <footer>
  83. <p>
  84. <a href="/david/" title="Aller à l’accueil"><svg class="icon icon-home">
  85. <use xlink:href="/static/david/icons2/symbol-defs.svg#icon-home"></use>
  86. </svg> Accueil</a> •
  87. <a href="/david/log/" title="Accès au flux RSS"><svg class="icon icon-rss2">
  88. <use xlink:href="/static/david/icons2/symbol-defs.svg#icon-rss2"></use>
  89. </svg> RSS</a> •
  90. <a href="http://larlet.com" title="Go to my English profile" data-instant><svg class="icon icon-user-tie">
  91. <use xlink:href="/static/david/icons2/symbol-defs.svg#icon-user-tie"></use>
  92. </svg> Pro</a> •
  93. <a href="mailto:david%40larlet.fr" title="Envoyer un courriel"><svg class="icon icon-mail">
  94. <use xlink:href="/static/david/icons2/symbol-defs.svg#icon-mail"></use>
  95. </svg> Email</a> •
  96. <abbr class="nowrap" title="Hébergeur : Alwaysdata, 62 rue Tiquetonne 75002 Paris, +33184162340"><svg class="icon icon-hammer2">
  97. <use xlink:href="/static/david/icons2/symbol-defs.svg#icon-hammer2"></use>
  98. </svg> Légal</abbr>
  99. </p>
  100. <template id="theme-selector">
  101. <form>
  102. <fieldset>
  103. <legend><svg class="icon icon-brightness-contrast">
  104. <use xlink:href="/static/david/icons2/symbol-defs.svg#icon-brightness-contrast"></use>
  105. </svg> Thème</legend>
  106. <label>
  107. <input type="radio" value="auto" name="chosen-color-scheme" checked> Auto
  108. </label>
  109. <label>
  110. <input type="radio" value="dark" name="chosen-color-scheme"> Foncé
  111. </label>
  112. <label>
  113. <input type="radio" value="light" name="chosen-color-scheme"> Clair
  114. </label>
  115. </fieldset>
  116. </form>
  117. </template>
  118. </footer>
  119. <script src="/static/david/js/instantpage-5.1.0.min.js" type="module"></script>
  120. <script>
  121. function loadThemeForm(templateName) {
  122. const themeSelectorTemplate = document.querySelector(templateName)
  123. const form = themeSelectorTemplate.content.firstElementChild
  124. themeSelectorTemplate.replaceWith(form)
  125. form.addEventListener('change', (e) => {
  126. const chosenColorScheme = e.target.value
  127. localStorage.setItem('theme', chosenColorScheme)
  128. toggleTheme(chosenColorScheme)
  129. })
  130. const selectedTheme = localStorage.getItem('theme')
  131. if (selectedTheme && selectedTheme !== 'undefined') {
  132. form.querySelector(`[value="${selectedTheme}"]`).checked = true
  133. }
  134. }
  135. const prefersColorSchemeDark = '(prefers-color-scheme: dark)'
  136. window.addEventListener('load', () => {
  137. let hasDarkRules = false
  138. for (const styleSheet of Array.from(document.styleSheets)) {
  139. let mediaRules = []
  140. for (const cssRule of styleSheet.cssRules) {
  141. if (cssRule.type !== CSSRule.MEDIA_RULE) {
  142. continue
  143. }
  144. // WARNING: Safari does not have/supports `conditionText`.
  145. if (cssRule.conditionText) {
  146. if (cssRule.conditionText !== prefersColorSchemeDark) {
  147. continue
  148. }
  149. } else {
  150. if (cssRule.cssText.startsWith(prefersColorSchemeDark)) {
  151. continue
  152. }
  153. }
  154. mediaRules = mediaRules.concat(Array.from(cssRule.cssRules))
  155. }
  156. // WARNING: do not try to insert a Rule to a styleSheet you are
  157. // currently iterating on, otherwise the browser will be stuck
  158. // in a infinite loop…
  159. for (const mediaRule of mediaRules) {
  160. styleSheet.insertRule(mediaRule.cssText)
  161. hasDarkRules = true
  162. }
  163. }
  164. if (hasDarkRules) {
  165. loadThemeForm('#theme-selector')
  166. }
  167. })
  168. </script>
  169. </body>
  170. </html>