davidbgk
/
larlet-fr-david-cache

<!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>
  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,minimum-scale=1,initial-scale=1,shrink-to-fit=no">
<!-- Required to make a valid HTML5 document. -->
<title>Remplir le vide (archive) — David Larlet</title>
<!-- Generated from https://realfavicongenerator.net/ such a mess. -->
<link rel="apple-touch-icon" sizes="180x180" href="/static/david/icons/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="/static/david/icons/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="/static/david/icons/favicon-16x16.png">
<link rel="manifest" href="/manifest.json">
<link rel="mask-icon" href="/static/david/icons/safari-pinned-tab.svg" color="#5bbad5">
<link rel="shortcut icon" href="/static/david/icons/favicon.ico">
<meta name="apple-mobile-web-app-title" content="David Larlet">
<meta name="application-name" content="David Larlet">
<meta name="msapplication-TileColor" content="#da532c">
<meta name="msapplication-config" content="/static/david/icons/browserconfig.xml">
<meta name="theme-color" content="#f0f0ea">
<!-- That good ol' feed, subscribe :p. -->
<link rel=alternate type="application/atom+xml" title=Feed href="/david/log/">

  <meta name="robots" content="noindex, nofollow">
  <meta content="origin-when-cross-origin" name="referrer">
  <!-- Canonical URL for SEO purposes -->
  <link rel="canonical" href="https://www.hypothermia.fr/2019/07/remplir-le-vide/">

<style>
/* http://meyerweb.com/eric/tools/css/reset/ */
html, body, div, span,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, address, big, cite, code,
del, dfn, em, img, ins,
small, strike, strong, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section { display: block; }
body { line-height: 1; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after,
q:before, q:after {
  content: '';
  content: none;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}

/* http://practicaltypography.com/equity.html */
/* https://calendar.perfplanet.com/2016/no-font-face-bulletproof-syntax/ */
/* https://www.filamentgroup.com/lab/js-web-fonts.html */
@font-face {
  font-family: 'EquityTextB';
  src: url('/static/david/css/fonts/Equity-Text-B-Regular-webfont.woff2') format('woff2'),
       url('/static/david/css/fonts/Equity-Text-B-Regular-webfont.woff') format('woff');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'EquityTextB';
  src: url('/static/david/css/fonts/Equity-Text-B-Italic-webfont.woff2') format('woff2'),
       url('/static/david/css/fonts/Equity-Text-B-Italic-webfont.woff') format('woff');
  font-weight: 300;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'EquityTextB';
  src: url('/static/david/css/fonts/Equity-Text-B-Bold-webfont.woff2') format('woff2'),
       url('/static/david/css/fonts/Equity-Text-B-Bold-webfont.woff') format('woff');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'ConcourseT3';
  src: url('/static/david/css/fonts/concourse_t3_regular-webfont-20190806.woff2') format('woff2'),
       url('/static/david/css/fonts/concourse_t3_regular-webfont-20190806.woff') format('woff');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}


/* http://practice.typekit.com/lesson/caring-about-opentype-features/ */
body {
  /* http://www.cssfontstack.com/ Palatino 99% Win 86% Mac */
  font-family: "EquityTextB", Palatino, serif;
  background-color: #f0f0ea;
  color: #07486c;
  font-kerning: normal;
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: subpixel-antialiased;
  text-rendering: optimizeLegibility;
  font-variant-ligatures: common-ligatures contextual;
  font-feature-settings: "kern", "liga", "clig", "calt";
}
pre, code, kbd, samp, var, tt {
  font-family: 'TriplicateT4c', monospace;
}
em {
  font-style: italic;
  color: #323a45;
}
strong {
  font-weight: bold;
  color: black;
}
nav {
  background-color: #323a45;
  color: #f0f0ea;
  display: flex;
  justify-content: space-around;
  padding: 1rem .5rem;
}
  nav:last-child {
    border-bottom: 1vh solid #2d7474;
  }
  nav a {
    color: #f0f0ea;
  }
  nav abbr {
    border-bottom: 1px dotted white;
  }

h1 {
  border-top: 1vh solid #2d7474;
  border-bottom: .2vh dotted #2d7474;
  background-color: #e3e1e1;
  color: #323a45;
  text-align: center;
  padding: 5rem 0 4rem 0;
  width: 100%;
  font-family: 'ConcourseT3';
  display: flex;
  flex-direction: column;
}
  h1.single {
    padding-bottom: 10rem;
  }
  h1 span {
    position: absolute;
    top: 1vh;
    left: 20%;
    line-height: 0;
  }
    h1 span a {
      line-height: 1.7;
      padding: 1rem 1.2rem .6rem 1.2rem;
      border-radius: 0 0 6% 6%;
      background: #2d7474;
      font-size: 1.3rem;
      color: white;
      text-decoration: none;
    }
h2 {
  margin: 4rem 0 1rem;
  border-top: .2vh solid #2d7474;
  padding-top: 1vh;
}
h3 {
  text-align: center;
  margin: 3rem 0 .75em;
}
hr {
  height: .4rem;
  width: .4rem;
  border-radius: .4rem;
  background: #07486c;
  margin: 2.5rem auto;
}
time {
  display: bloc;
  margin-left: 0 !important;
}
ul, ol {
  margin: 2rem;
}
ul {
  list-style-type: square;
}
a {
  text-decoration-skip-ink: auto;
  text-decoration-thickness: 0.05em;
  text-underline-offset: 0.09em;
}
article {
  max-width: 50rem;
  display: flex;
  flex-direction: column;
  margin: 2rem auto;
}
  article.single {
    border-top: .2vh dotted #2d7474;
    margin: -6rem auto 1rem auto;
    background: #f0f0ea;
    padding: 2rem;
  }
  article p:last-child {
    margin-bottom: 1rem;
  }
p {
  padding: 0 .5rem;
  margin-left: 3rem;
}
  p + p,
  figure + p {
    margin-top: 2rem;
  }

blockquote {
  background-color: #e3e1e1;
  border-left: .5vw solid #2d7474;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 1rem;
  margin: 1.5rem;
}
  blockquote cite {
    font-style: italic;
  }
  blockquote p {
    margin-left: 0;
  }

figure {
  border-top: .2vh solid #2d7474;
  background-color: #e3e1e1;
  text-align: center;
  padding: 1.5rem 0;
  margin: 1rem 0 0;
  font-size: 1.5rem;
  width: 100%;
}
  figure img {
    max-width: 250px;
    max-height: 250px;
    border: .5vw solid #323a45;
    padding: 1px;
  }
figcaption {
  padding: 1rem;
  line-height: 1.4;
}
aside {
  display: flex;
  flex-direction: column;
  background-color: #e3e1e1;
  padding: 1rem 0;
  border-bottom: .2vh solid #07486c;
}
  aside p {
    max-width: 50rem;
    margin: 0 auto;
  }

/* https://fvsch.com/code/css-locks/ */
p, li, pre, code, kbd, samp, var, tt, time, details, figcaption {
  font-size: 1rem;
  line-height: calc( 1.5em + 0.2 * 1rem );
}
h1 {
  font-size: 1.9rem;
  line-height: calc( 1.2em + 0.2 * 1rem );
}
h2 {
  font-size: 1.6rem;
  line-height: calc( 1.3em + 0.2 * 1rem );
}
h3 {
  font-size: 1.35rem;
  line-height: calc( 1.4em + 0.2 * 1rem );
}
@media (min-width: 20em) {
  /* The (100vw - 20rem) / (50 - 20) part
     resolves to 0-1rem, depending on the
     viewport width (between 20em and 50em). */
  p, li, pre, code, kbd, samp, var, tt, time, details, figcaption {
    font-size: calc( 1rem + .6 * (100vw - 20rem) / (50 - 20) );
    line-height: calc( 1.5em + 0.2 * (100vw - 50rem) / (20 - 50) );
    margin-left: 0;
  }
  h1 {
    font-size: calc( 1.9rem + 1.5 * (100vw - 20rem) / (50 - 20) );
    line-height: calc( 1.2em + 0.2 * (100vw - 50rem) / (20 - 50) );
  }
  h2 {
    font-size: calc( 1.5rem + 1.5 * (100vw - 20rem) / (50 - 20) );
    line-height: calc( 1.3em + 0.2 * (100vw - 50rem) / (20 - 50) );
  }
  h3 {
    font-size: calc( 1.35rem + 1.5 * (100vw - 20rem) / (50 - 20) );
    line-height: calc( 1.4em + 0.2 * (100vw - 50rem) / (20 - 50) );
  }
}
@media (min-width: 50em) {
  /* The right part of the addition *must* be a
     rem value. In this example we *could* change
     the whole declaration to font-size:2.5rem,
     but if our baseline value was not expressed
     in rem we would have to use calc. */
  p, li, pre, code, kbd, samp, var, tt, time, details, figcaption {
    font-size: calc( 1rem + .6 * 1rem );
    line-height: 1.5em;
  }
  p, li, pre, details {
    margin-left: 3rem;
  }
  h1 {
    font-size: calc( 1.9rem + 1.5 * 1rem );
    line-height: 1.2em;
  }
  h2 {
    font-size: calc( 1.5rem + 1.5 * 1rem );
    line-height: 1.3em;
  }
  h3 {
    font-size: calc( 1.35rem + 1.5 * 1rem );
    line-height: 1.4em;
  }
  figure img {
    max-width: 500px;
    max-height: 500px;
  }
}

figure.unsquared {
  margin-bottom: 1.5rem;
}
  figure.unsquared img {
    height: inherit;
  }


@media print {
  body { font-size: 100%; }
  a:after { content: " (" attr(href) ")"; }
  a, a:link, a:visited, a:after {
    text-decoration: underline;
    text-shadow: none !important;
    background-image: none !important;
    background: white;
    color: black;
  }
  abbr[title] { border-bottom: 0; }
  abbr[title]:after { content: " (" attr(title) ")"; }
  img { page-break-inside: avoid; }
  @page { margin: 2cm .5cm; }
  h1, h2, h3 { page-break-after: avoid; }
  p3 { orphans: 3; widows: 3; }
  img {
    max-width: 250px !important;
    max-height: 250px !important;
  }
  nav, aside { display: none; }
}

ul.with_columns {
  column-count: 1;
}
@media (min-width: 20em) {
  ul.with_columns {
    column-count: 2;
  }
}
@media (min-width: 50em) {
  ul.with_columns {
    column-count: 3;
  }
}
ul.with_two_columns {
  column-count: 1;
}
@media (min-width: 20em) {
  ul.with_two_columns {
    column-count: 1;
  }
}
@media (min-width: 50em) {
  ul.with_two_columns {
    column-count: 2;
  }
}

.gallery {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-around;
}
  .gallery figure img {
    margin-left: 1rem;
    margin-right: 1rem;
  }
  .gallery figure figcaption {
    font-family: 'ConcourseT3'
  }

footer {
  font-family: 'ConcourseT3';
  display: flex;
  flex-direction: column;
  border-top: 3px solid white;
  padding: 4rem 0;
  background-color: #07486c;
  color: white;
}
  footer > * {
    max-width: 50rem;
    margin: 0 auto;
  }
  footer a {
    color: #f1c40f;
  }
  footer .avatar {
    width: 200px;
    height: 200px;
    border-radius: 50%;
    float: left;
    -webkit-shape-outside: circle();
    shape-outside: circle();
    margin-right: 2rem;
    padding: 2px 5px 5px 2px;
    background: white;
    border-left: 1px solid #f1c40f;
    border-top: 1px solid #f1c40f;
    border-right: 5px solid #f1c40f;
    border-bottom: 5px solid #f1c40f;
  }
</style>

<h1>
  <span><a id="jumper" href="#jumpto" title="Un peu perdu ?">?</a></span>
  Remplir le vide (archive)
  <time>Pour la pérennité des contenus liés. Non-indexé, retrait sur simple email.</time>
</h1>
<section>
  <article>
    <h3><a href="https://www.hypothermia.fr/2019/07/remplir-le-vide/">Source originale du contenu</a></h3>
    <p>Lorsque j’ai levé les yeux vers l’horloge du four, elle indiquait 3h du matin. J’étais assise sur le carrelage de la cuisine entourée de pots à thé, boîtes à céréales, sachets de noix et autres bocaux en verre, transvasant le contenu des uns dans les autres, les étiquetant soigneusement au passage. <a href="https://www.youtube.com/watch?v=2O6duDDkhis">Matt s’épanchait à mes oreilles</a>, <a href="https://www.hypothermia.fr/2018/07/olaf/">Olaf</a> slalomait entre les épices qu’il reniflait consciencieusement et à ce moment précis du beau milieu de la nuit, je me sentais merveilleusement comblée.</p>

<figure><img class="aligncenter size-full wp-image-13676" src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" data-src="https://www.hypothermia.fr/media/2019/06/noix.jpg" alt="Bocaux remplis de noix" data-srcset="https://www.hypothermia.fr/media/2019/06/noix.jpg 1200w, https://www.hypothermia.fr/media/2019/06/noix-768x512.jpg 768w, https://www.hypothermia.fr/media/2019/06/noix-1024x683.jpg 1024w, https://www.hypothermia.fr/media/2019/06/noix-480x320.jpg 480w" sizes="(max-width: 1200px) 100vw, 1200px"/><noscript><img class="aligncenter size-full wp-image-13676" src="https://www.hypothermia.fr/media/2019/06/noix.jpg" alt="Bocaux remplis de noix" srcset="https://www.hypothermia.fr/media/2019/06/noix.jpg 1200w, https://www.hypothermia.fr/media/2019/06/noix-768x512.jpg 768w, https://www.hypothermia.fr/media/2019/06/noix-1024x683.jpg 1024w, https://www.hypothermia.fr/media/2019/06/noix-480x320.jpg 480w" sizes="(max-width: 1200px) 100vw, 1200px"/></noscript></figure>

<figure><img class="aligncenter size-full wp-image-13675" src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" data-src="https://www.hypothermia.fr/media/2019/06/chocolat.jpg" alt="Bouteilles étiquetées et tablettes de chocolat" data-srcset="https://www.hypothermia.fr/media/2019/06/chocolat.jpg 1200w, https://www.hypothermia.fr/media/2019/06/chocolat-768x512.jpg 768w, https://www.hypothermia.fr/media/2019/06/chocolat-1024x683.jpg 1024w, https://www.hypothermia.fr/media/2019/06/chocolat-480x320.jpg 480w" sizes="(max-width: 1200px) 100vw, 1200px"/><noscript><img class="aligncenter size-full wp-image-13675" src="https://www.hypothermia.fr/media/2019/06/chocolat.jpg" alt="Bouteilles étiquetées et tablettes de chocolat" srcset="https://www.hypothermia.fr/media/2019/06/chocolat.jpg 1200w, https://www.hypothermia.fr/media/2019/06/chocolat-768x512.jpg 768w, https://www.hypothermia.fr/media/2019/06/chocolat-1024x683.jpg 1024w, https://www.hypothermia.fr/media/2019/06/chocolat-480x320.jpg 480w" sizes="(max-width: 1200px) 100vw, 1200px"/></noscript></figure>

<figure><img class="aligncenter size-full wp-image-13677" src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" data-src="https://www.hypothermia.fr/media/2019/06/pantry.jpg" alt="Alignement de bocaux étiquetés sur une étagère" data-srcset="https://www.hypothermia.fr/media/2019/06/pantry.jpg 1200w, https://www.hypothermia.fr/media/2019/06/pantry-768x512.jpg 768w, https://www.hypothermia.fr/media/2019/06/pantry-1024x683.jpg 1024w, https://www.hypothermia.fr/media/2019/06/pantry-480x320.jpg 480w" sizes="(max-width: 1200px) 100vw, 1200px"/><noscript><img class="aligncenter size-full wp-image-13677" src="https://www.hypothermia.fr/media/2019/06/pantry.jpg" alt="Alignement de bocaux étiquetés sur une étagère" srcset="https://www.hypothermia.fr/media/2019/06/pantry.jpg 1200w, https://www.hypothermia.fr/media/2019/06/pantry-768x512.jpg 768w, https://www.hypothermia.fr/media/2019/06/pantry-1024x683.jpg 1024w, https://www.hypothermia.fr/media/2019/06/pantry-480x320.jpg 480w" sizes="(max-width: 1200px) 100vw, 1200px"/></noscript></figure>

<p>Cela faisait quelques jours que j’envisageais de réorganiser mon garde-manger, lasse d’y farfouiller entre les sachets ouverts depuis Mathusalem à la recherche de denrées oubliées. Internet a été une merveilleuse escalade de ce projet, me permettant de plonger à cœur perdu dans les placards idéaux que me faisait miroiter Pinterest. D’une simple idée de rangement on est passé à l’échelle supérieure : pendant une semaine, ma préoccupation principale a été de mesurer des étagères, de calculer le volume de bocaux, de chercher une police de caractères adaptée et où me procurer des étiquettes transparentes. Un projet totalement superficiel et poussé bien trop à l’extrême façon Bree Van De Kamp. Je ne peux répondre à ce ridicule qu’en paraphrasant cette exclamation de Maddie : <em>« Écoute, c’est ça ou penser à la vacuité de l’existence. »</em></p>

<figure><img class="aligncenter size-full wp-image-13672" src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" data-src="https://www.hypothermia.fr/media/2019/06/pinterest.jpg" alt="Résultat de recherche Pinterest : pantry organization" data-srcset="https://www.hypothermia.fr/media/2019/06/pinterest.jpg 1200w, https://www.hypothermia.fr/media/2019/06/pinterest-768x409.jpg 768w, https://www.hypothermia.fr/media/2019/06/pinterest-1024x545.jpg 1024w" sizes="(max-width: 1200px) 100vw, 1200px"/><noscript><img class="aligncenter size-full wp-image-13672" src="https://www.hypothermia.fr/media/2019/06/pinterest.jpg" alt="Résultat de recherche Pinterest : pantry organization" srcset="https://www.hypothermia.fr/media/2019/06/pinterest.jpg 1200w, https://www.hypothermia.fr/media/2019/06/pinterest-768x409.jpg 768w, https://www.hypothermia.fr/media/2019/06/pinterest-1024x545.jpg 1024w" sizes="(max-width: 1200px) 100vw, 1200px"/></noscript></figure>

<p class="legend">Recherche Pinterest : « Pantry organization »</p>

<p>Lorsque j’ouvre les placards de ma cuisine désormais, je ressens la même jubilation que Manu : <em>« J’ai limite envie d’appeler tous mes potes et faire : Viens chez moi, regarde, regarde, c’est beau, regarde mon gros phallus bien rangé ! »</em> qu’elle suit bien rapidement d’un si juste <em>« Mais une fois que le petit trip de rangement sera passé, qu’est-ce que je vais faire dans ma vie quoi… Faire des DIY, mettre des photos dans des cadres, enfin non mais ça va pas… J’vais pas faire ça quand même… »</em></p>

<p class="legend">(Est-ce que je cesserai un jour de faire référence à cette vidéo ? Jamais.)</p>

<p>Alors oui, au passage j’ai relu <a href="https://www.youtube.com/watch?v=WkPOMezkHsk">la bible Kondoïque</a> qu’il n’est plus nécessaire de présenter – j’aimerais tellement pouvoir critiquer son effet de mode et mon premier réflexe est souvent de m’en moquer, il n’empêche. Il y a quelque chose dans sa description du rapport à l’objet qui me parle énormément. L’exemple le plus évident cité à tout bout de champ est la garde-robe, bien sûr : entre les vêtements qu’on garde par simple utilité et les vêtements qu’on garde par culpabilité, il est bien difficile de dégager les vêtements qu’on garde par identité. Ma penderie a subi le même brainwashing que mes placards de cuisine : je me suis débarrassée de plusieurs sacs poubelle de vêtements qui ne répondaient pas à la question suivante : <em>« Est-ce que j’ai déjà porté cette pièce avec plaisir depuis que je vis en Suisse ? »</em></p>

<p>J’étais toute contente d’avoir gagné quelques points bonus de karma en donnant mes vêtements non portés à une œuvre caritative et en écoloresponsabilisant ma cuisine par de nombreux contenants en verre. Et puis je suis tombée coup sur coup sur plusieurs articles qui m’ont prouvé à quel point je faisais l’autruche sur mon consumérisme. <a href="https://uninvincibleete.com/2019/03/critique-ecologie-privileges/">Le premier article</a> partagé par <a href="https://larlet.fr/david/stream/2019/06/14/">David</a> m’a fait comprendre à quel point mes réflexions matérialistes étaient avant tout un privilège. <a href="https://www.slate.fr/story/177864/marie-kondo-art-rangement-afflux-dons-vetements-recyclage-decharge">Le second article</a> relayé par <a href="https://lalunemauve.fr/revue-de-web-mai-juin-2019" class="broken_link">kReEsTal</a> m’a révélé que la plupart des vêtements que j’ai donnés avec bonne conscience sont probablement partis à la poubelle. <a href="https://www.suspended-objects.org/">La dernière découverte</a> est un site mentionné dans une des <a href="https://tinyletter.com/notoriousbigre">infolettres de notoriousbigre</a> : une collection des objets dont on se déleste, à regret ou par nécessité, et dont l’histoire y est capturée avant qu’ils ne sombrent dans l’oubli.</p>

<figure><img class="aligncenter size-full wp-image-13673" src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" data-src="https://www.hypothermia.fr/media/2019/06/tasse.jpg" alt="Tasse et cafetière" data-srcset="https://www.hypothermia.fr/media/2019/06/tasse.jpg 1200w, https://www.hypothermia.fr/media/2019/06/tasse-768x512.jpg 768w, https://www.hypothermia.fr/media/2019/06/tasse-1024x683.jpg 1024w, https://www.hypothermia.fr/media/2019/06/tasse-480x320.jpg 480w" sizes="(max-width: 1200px) 100vw, 1200px"/><noscript><img class="aligncenter size-full wp-image-13673" src="https://www.hypothermia.fr/media/2019/06/tasse.jpg" alt="Tasse et cafetière" srcset="https://www.hypothermia.fr/media/2019/06/tasse.jpg 1200w, https://www.hypothermia.fr/media/2019/06/tasse-768x512.jpg 768w, https://www.hypothermia.fr/media/2019/06/tasse-1024x683.jpg 1024w, https://www.hypothermia.fr/media/2019/06/tasse-480x320.jpg 480w" sizes="(max-width: 1200px) 100vw, 1200px"/></noscript></figure>

<figure><img class="aligncenter size-full wp-image-13680" src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" data-src="https://www.hypothermia.fr/media/2019/06/brocard.jpg" alt="Trophée de brocard et boîtes à épices" data-srcset="https://www.hypothermia.fr/media/2019/06/brocard.jpg 1200w, https://www.hypothermia.fr/media/2019/06/brocard-768x512.jpg 768w, https://www.hypothermia.fr/media/2019/06/brocard-1024x683.jpg 1024w, https://www.hypothermia.fr/media/2019/06/brocard-480x320.jpg 480w" sizes="(max-width: 1200px) 100vw, 1200px"/><noscript><img class="aligncenter size-full wp-image-13680" src="https://www.hypothermia.fr/media/2019/06/brocard.jpg" alt="Trophée de brocard et boîtes à épices" srcset="https://www.hypothermia.fr/media/2019/06/brocard.jpg 1200w, https://www.hypothermia.fr/media/2019/06/brocard-768x512.jpg 768w, https://www.hypothermia.fr/media/2019/06/brocard-1024x683.jpg 1024w, https://www.hypothermia.fr/media/2019/06/brocard-480x320.jpg 480w" sizes="(max-width: 1200px) 100vw, 1200px"/></noscript></figure>

<figure><img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" data-src="https://www.hypothermia.fr/media/2019/07/epices.jpg" alt="Alignement de boîtes à épices" class="aligncenter size-full wp-image-13718" data-srcset="https://www.hypothermia.fr/media/2019/07/epices.jpg 1200w, https://www.hypothermia.fr/media/2019/07/epices-768x512.jpg 768w, https://www.hypothermia.fr/media/2019/07/epices-1024x683.jpg 1024w, https://www.hypothermia.fr/media/2019/07/epices-480x320.jpg 480w" sizes="(max-width: 1200px) 100vw, 1200px"/><noscript><img src="https://www.hypothermia.fr/media/2019/07/epices.jpg" alt="Alignement de boîtes à épices" class="aligncenter size-full wp-image-13718" srcset="https://www.hypothermia.fr/media/2019/07/epices.jpg 1200w, https://www.hypothermia.fr/media/2019/07/epices-768x512.jpg 768w, https://www.hypothermia.fr/media/2019/07/epices-1024x683.jpg 1024w, https://www.hypothermia.fr/media/2019/07/epices-480x320.jpg 480w" sizes="(max-width: 1200px) 100vw, 1200px"/></noscript></figure>

<figure><img class="aligncenter size-full wp-image-13679" src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" data-src="https://www.hypothermia.fr/media/2019/06/verre.jpg" alt="Tubes à essais, cadre végétal et memento mori" data-srcset="https://www.hypothermia.fr/media/2019/06/verre.jpg 1200w, https://www.hypothermia.fr/media/2019/06/verre-768x512.jpg 768w, https://www.hypothermia.fr/media/2019/06/verre-1024x683.jpg 1024w, https://www.hypothermia.fr/media/2019/06/verre-480x320.jpg 480w" sizes="(max-width: 1200px) 100vw, 1200px"/><noscript><img class="aligncenter size-full wp-image-13679" src="https://www.hypothermia.fr/media/2019/06/verre.jpg" alt="Tubes à essais, cadre végétal et memento mori" srcset="https://www.hypothermia.fr/media/2019/06/verre.jpg 1200w, https://www.hypothermia.fr/media/2019/06/verre-768x512.jpg 768w, https://www.hypothermia.fr/media/2019/06/verre-1024x683.jpg 1024w, https://www.hypothermia.fr/media/2019/06/verre-480x320.jpg 480w" sizes="(max-width: 1200px) 100vw, 1200px"/></noscript></figure>

<p>Ces dernières semaines, j’ai dépensé beaucoup d’argent dans des objets. J’ai importé une veste en cuir de l’autre bout du monde, j’ai fait une razzia de bocaux en verre et autres boîtes en métal chez le monstre suédois, j’ai commandé à une artisane lituanienne des tasses à café qui me plaisent mieux que celles que j’ai déjà, et j’ai utilisé le chat comme prétexte à acheter un panier dont il n’a nullement besoin mais que je trouvais si joli. Je suis une consommatrice d’objets, remplaçant régulièrement certains que je possède déjà par d’autres qui me plaisent mieux, profitant de la mondialisation pour acheter à l’étranger ce que je pourrais très bien trouver chez moi (mais en moins bien), et ce sans aucune seconde pensée sur l’impact écologique de mon comportement. Vive le capitalisme !</p>

<p>À l’encontre de ces automatismes, je me suis rendue au Festival de la Terre au milieu du mois. Un événement <em>« pionnier, singulier et engagé »</em> de deux jours au cœur de Lausanne, dont le pitch et le programme m’ont fortement intriguée. Il était question de consommation responsable, de respect de la nature, d’anticonsumérisme, et de rassemblements mystiques :</p>

<blockquote><p>Qu’elle soit utilisée au niveau individuel, social, environnemental ou encore économique, la notion d’équilibre se situe au cœur des enjeux de nos sociétés en transition. A l’heure où celui de notre planète est menacé, comment peut-on, en tant qu’être humain mais aussi en tant que société, tenter de rétablir la balance pour que toutes les formes de vie retrouvent leur juste place et leur harmonie naturelle ? Et si l’équilibre résidait déjà dans le simple fait de se poser cette question et d’explorer différentes réponses ?</p></blockquote>

<p>J’ai du rester dans ce festival une vingtaine de minutes au grand maximum avant de fuir sans aucun regard en arrière. En parcourant ses allées, j’y ai ressenti une ironie immense entre les messages véhiculés et leur prétexte à consommation à chaque stand successif. Je ne m’en sortais pas entre les badges à dix balles pour la protection de l’environnement, les portions de nourriture hors de prix (oui mais c’est bio !), les boutiques de bijoux bohos produits à la chaîne industrielle et qui attiraient foule, les tentes de méditation à côté des spots de concert à côté des enceintes qui hurlaient des messages pour sauver la planète… J’avais cette impression que le festival en entier n’était qu’un prétexte à la consommation bonne conscience.</p>

<p>Parce qu’il est de bon ton désormais de dégainer sa paille métallique, son tote bag à légumes, sa brosse à dent en bambou et son bout de charbon dans sa gourde (disclaimer : j’en possède également). J’achète trois fois plus cher des œufs de poules élevées en plein air qui ont à peine moins souffert que les autres, je constate que les magasins bio du coin vendent des fruits exotiques importés du Pérou, et j’ai l’impression que la responsabilisation écologique à l’échelle individuelle n’est qu’une vaste blague. J’aime clamer que les quelques comportements écoresponsables que j’entretiens sont avant tout pour laver ma conscience, tout en sachant qu’au fond je me réfugie dans le défaitisme qui m’ôte toute notion de culpabilisation. Alors je jette des objets encore fonctionnels et j’en consomme d’autres parce que ça me rassure, parce que ça me remplit, et j’essaie fort de me dire que je ne suis pas une si mauvaise personne.</p>

<blockquote><p> Instruments and policy packages designed to achieve behaviour change vary greatly, but most can be categorised either as “carrots, sticks, or sermons”. They can be economic incentives (such as grants for “green” products, energy taxes, soft loans), standards and regulations (such as building codes or vehicle emission standards), or the provisioning of information (more detailed energy bills, smart meters, awareness campaigns).</p><p>All these policy instruments are focused on what are thought to be the determinants of individual behaviours. They assume that either individuals take rational decisions based on product price and information (the homo economicus model), or that behaviours are the outcomes of beliefs, attitudes and values (various value-belief models). According to these dominant social theories, people engage in pro-environmental behaviour for self-interested reasons (because it is enjoyable or saves money), or for normative reasons (because they think it’s the right thing to do).</p><p>However, many pro-environmental actions involve a conflict between self-interested and normative reasons. Pro-environmental behaviour is often considered to be less profitable, less pleasurable, and/or more time-consuming. Consequently, people need to make an effort to benefit the environment, and this is why, according to behavioural change researchers, pro-environmental values and attitudes are not necessarily matched by individuals’ behaviours.</p><p>[…]</p><p>In sum, individuals can make pro-environmental choices based on attitudes and values, and they may inspire others to do the same, but there are so many other things involved that focusing on changing individual “behaviour” seems to miss the point. Trying to persuade people to live sustainably through individual behaviour change programmes will not address the larger and more significant structures and ideas that facilitate and limit their options.</p><p>In fact, by placing responsibility – and guilt – squarely on the individuals, attention is deflected away from the many institutions involved in structuring possible courses of action, and in making some very much more likely than others. The discourse of sustainable “behaviour” holds consumers collectively responsible for political and economic decisions, rather than politicians and economic actors themselves.</p><p class="small">Kris De Decker, <a href="https://www.lowtechmagazine.com/2018/07/we-cant-do-it-ourselves.html">We can’t do it ourselves</a></p></blockquote>

<p>En croisant toutes ces sources et expériences, j’ai compris que mon lien aux objets était un lien à l’idéal. Chaque nouvel objet acquis me rapproche un peu plus de celle que j’aimerais être. Chaque objet que je remplace me permet de corriger une dissonance dans l’espoir d’une meilleure harmonie, unité, cohérence. Un nouveau vêtement m’apportera une meilleure confiance dans ce que je projette, une nouvelle plante confortera mon obsession horticole (décompte actuel : 24 pieds dans l’appartement), un nouveau service d’assiettes apaisera mon besoin de contrôle esthétique à chaque repas. Les objets dont je m’entoure sont des talismans qui renforcent mon identité.</p>

<p>Beaucoup de mes conflits intérieurs tournent autour de cet idéal indéfinissable. Les objets me permettent de l’appréhender en le matérialisant, et ainsi d’y avoir une prise. Je ne sais si c’est parce que mon rapport au monde est avant tout kinesthésique, il y doit y avoir une part de cela sans doute. L’objet me permet immédiatement de reconnaître une direction, un indice que mon instinct identifie en me disant <em>« Touche, c’est par là »</em>. D’où le besoin d’appropriation de ces points amarrage, on y revient toujours.</p>

<p>Alors que je flânais en ville hier, je suis entrée dans une boutique de design luxueuse et je me suis extasiée sur un mur entier rempli de vases et de boîtes. L’une d’entre elles en particulier était d’un métal dont la texture a aussitôt attrapé mon regard. Je savais parfaitement que je n’en avais pas l’utilité et que l’objet était bien trop cher pour ce qu’il était. Je savais aussi que je repartirai avec sans aucun doute possible. <a href="https://www.hypothermia.fr/2016/03/la-juste-valeur-des-choses/">La juste valeur des choses</a>, écrivais-je.</p>

<figure><img class="aligncenter size-full wp-image-13678" src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" data-src="https://www.hypothermia.fr/media/2019/06/lausanne.jpg" alt="Boîte en métal" data-srcset="https://www.hypothermia.fr/media/2019/06/lausanne.jpg 1200w, https://www.hypothermia.fr/media/2019/06/lausanne-768x512.jpg 768w, https://www.hypothermia.fr/media/2019/06/lausanne-1024x683.jpg 1024w, https://www.hypothermia.fr/media/2019/06/lausanne-480x320.jpg 480w" sizes="(max-width: 1200px) 100vw, 1200px"/><noscript><img class="aligncenter size-full wp-image-13678" src="https://www.hypothermia.fr/media/2019/06/lausanne.jpg" alt="Boîte en métal" srcset="https://www.hypothermia.fr/media/2019/06/lausanne.jpg 1200w, https://www.hypothermia.fr/media/2019/06/lausanne-768x512.jpg 768w, https://www.hypothermia.fr/media/2019/06/lausanne-1024x683.jpg 1024w, https://www.hypothermia.fr/media/2019/06/lausanne-480x320.jpg 480w" sizes="(max-width: 1200px) 100vw, 1200px"/></noscript></figure>

<p class="legend">La boite en métal en question, qui trône désormais sur ma table de nuit.</p>

<figure><img class="aligncenter size-full wp-image-13681" src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" data-src="https://www.hypothermia.fr/media/2019/06/nider.jpg" alt="Pot en faïence" data-srcset="https://www.hypothermia.fr/media/2019/06/nider.jpg 1200w, https://www.hypothermia.fr/media/2019/06/nider-768x512.jpg 768w, https://www.hypothermia.fr/media/2019/06/nider-1024x683.jpg 1024w, https://www.hypothermia.fr/media/2019/06/nider-480x320.jpg 480w" sizes="(max-width: 1200px) 100vw, 1200px"/><noscript><img class="aligncenter size-full wp-image-13681" src="https://www.hypothermia.fr/media/2019/06/nider.jpg" alt="Pot en faïence" srcset="https://www.hypothermia.fr/media/2019/06/nider.jpg 1200w, https://www.hypothermia.fr/media/2019/06/nider-768x512.jpg 768w, https://www.hypothermia.fr/media/2019/06/nider-1024x683.jpg 1024w, https://www.hypothermia.fr/media/2019/06/nider-480x320.jpg 480w" sizes="(max-width: 1200px) 100vw, 1200px"/></noscript></figure>

<p class="legend">Pot en faïence originaire de mes racines, signé en dessous par le potier qui l’a créé.</p>

<figure><img class="aligncenter size-full wp-image-13674" src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" data-src="https://www.hypothermia.fr/media/2019/06/bruxelles.jpg" alt="Bol en céramique" data-srcset="https://www.hypothermia.fr/media/2019/06/bruxelles.jpg 1200w, https://www.hypothermia.fr/media/2019/06/bruxelles-768x512.jpg 768w, https://www.hypothermia.fr/media/2019/06/bruxelles-1024x683.jpg 1024w, https://www.hypothermia.fr/media/2019/06/bruxelles-480x320.jpg 480w" sizes="(max-width: 1200px) 100vw, 1200px"/><noscript><img class="aligncenter size-full wp-image-13674" src="https://www.hypothermia.fr/media/2019/06/bruxelles.jpg" alt="Bol en céramique" srcset="https://www.hypothermia.fr/media/2019/06/bruxelles.jpg 1200w, https://www.hypothermia.fr/media/2019/06/bruxelles-768x512.jpg 768w, https://www.hypothermia.fr/media/2019/06/bruxelles-1024x683.jpg 1024w, https://www.hypothermia.fr/media/2019/06/bruxelles-480x320.jpg 480w" sizes="(max-width: 1200px) 100vw, 1200px"/></noscript></figure>

<p class="legend">Bol en céramique offert par une amie qui m’a vue le tenir beaucoup trop longtemps en main dans le magasin où elle m’a emmenée.</p>

<figure><img class="aligncenter size-full wp-image-13689" src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" data-src="https://www.hypothermia.fr/media/2019/06/bijoux.jpg" alt="Plat en métal" data-srcset="https://www.hypothermia.fr/media/2019/06/bijoux.jpg 1200w, https://www.hypothermia.fr/media/2019/06/bijoux-768x512.jpg 768w, https://www.hypothermia.fr/media/2019/06/bijoux-1024x683.jpg 1024w, https://www.hypothermia.fr/media/2019/06/bijoux-480x320.jpg 480w" sizes="(max-width: 1200px) 100vw, 1200px"/><noscript><img class="aligncenter size-full wp-image-13689" src="https://www.hypothermia.fr/media/2019/06/bijoux.jpg" alt="Plat en métal" srcset="https://www.hypothermia.fr/media/2019/06/bijoux.jpg 1200w, https://www.hypothermia.fr/media/2019/06/bijoux-768x512.jpg 768w, https://www.hypothermia.fr/media/2019/06/bijoux-1024x683.jpg 1024w, https://www.hypothermia.fr/media/2019/06/bijoux-480x320.jpg 480w" sizes="(max-width: 1200px) 100vw, 1200px"/></noscript></figure>

<p class="legend">Plat en métal fait à la main par le mari de la propriétaire d’<a href="https://www.hypothermia.fr/2016/12/x16-kyoto#QuAn">une petite boutique de Kyoto</a>, où je dépose rituellement mes bijoux chaque soir sur mon bureau.</p>

<p>Si je devais sélectionner une catégorie d’objets préférés, il s’agit bien des <a href="https://openload.pw/embed/EnJL0dfLni0/%5BWwW.VoirFilms.co%5D-Kaamelott.S01E18.En_forme_de_Graal.mkv.mp4"><span>bocaux à anchois</span></a> récipients. Le tout se joue dans la texture : une fois saisi en main, si le contact passe, c’est foutu. Je dois me l’approprier. Je suis irrémédiablement attirée par les bols, les pots, les coffres. Un objet aux contours délimités qui peut être rempli. Un contrôle sur le vide.</p>

<p>Un des plus beaux compliments qu’on m’a jamais adressés était : <em>« Tu es tellement contenante ! »</em> La contenance est cette capacité à remplir. En l’occurrence, le vide identifié chez l’autre. Même si on ne pourra jamais le combler tout à fait, tout comme je ne trouverai jamais les objets qui me correspondront parfaitement. Je continue d’espérer.</p>

<p>C’est sans aucun doute pour cela que cette nuit-là, assise sur le carrelage de ma cuisine en train de remplir des bocaux et de soigneusement les empiler, j’étais en pleine félicité. J’avais un contrôle absolu sur les contenants, je pouvais les agencer à loisir, je pouvais surtout les garnir de textures et de couleurs jusqu’à ce qu’ils remplissent entièrement mes étagères. Cette activité en apparence si vaine était en réalité parfaitement accordée avec le trou noir autour duquel semble graviter mon idéal : un vide que je ne cesserai jamais de chercher à combler.</p>

<figure><img class="aligncenter size-full wp-image-13682" src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" data-src="https://www.hypothermia.fr/media/2019/06/hole.jpg" alt="BD d'Aaron Diaz : Every person in the world is born with a large gaping hole in the center of their chest" data-srcset="https://www.hypothermia.fr/media/2019/06/hole.jpg 1200w, https://www.hypothermia.fr/media/2019/06/hole-768x402.jpg 768w, https://www.hypothermia.fr/media/2019/06/hole-1024x536.jpg 1024w" sizes="(max-width: 1200px) 100vw, 1200px"/><noscript><img class="aligncenter size-full wp-image-13682" src="https://www.hypothermia.fr/media/2019/06/hole.jpg" alt="BD d'Aaron Diaz : Every person in the world is born with a large gaping hole in the center of their chest" srcset="https://www.hypothermia.fr/media/2019/06/hole.jpg 1200w, https://www.hypothermia.fr/media/2019/06/hole-768x402.jpg 768w, https://www.hypothermia.fr/media/2019/06/hole-1024x536.jpg 1024w" sizes="(max-width: 1200px) 100vw, 1200px"/></noscript></figure>

<p class="legend">Aaron Diaz</p>
  </article>
</section>


<nav id="jumpto">
  <p>
    <a href="/david/blog/">Accueil du blog</a> |
    <a href="https://www.hypothermia.fr/2019/07/remplir-le-vide/">Source originale</a> |
    <a href="/david/stream/2019/">Accueil du flux</a>
  </p>
</nav>

<footer>
  <div>
    <img src="/static/david/david-larlet-avatar.jpg" loading="lazy" class="avatar" width="200" height="200">
    <p>
      Bonjour/Hi!
      Je suis <a href="/david/" title="Profil public">David&nbsp;Larlet</a>, je vis actuellement à Montréal et j’alimente cet espace depuis 15 ans. <br>
      Si tu as apprécié cette lecture, n’hésite pas à poursuivre ton exploration. Par exemple via les <a href="/david/blog/" title="Expériences bienveillantes">réflexions bimestrielles</a>, la <a href="/david/stream/2019/" title="Pensées (dés)articulées">veille hebdomadaire</a> ou en t’abonnant au <a href="/david/log/" title="S’abonner aux publications via RSS">flux RSS</a> (<a href="/david/blog/2019/flux-rss/" title="Tiens c’est quoi un flux RSS ?">so 2005</a>).
    </p>
    <p>
      Je m’intéresse à la place que je peux avoir dans ce monde. En tant qu’humain, en tant que membre d’une famille et en tant qu’associé d’une coopérative. De temps en temps, je fais aussi des <a href="https://github.com/davidbgk" title="Principalement sur Github mais aussi ailleurs">trucs techniques</a>. Et encore plus rarement, <a href="/david/talks/" title="En ce moment je laisse plutôt la place aux autres">j’en parle</a>.
    </p>
    
    <p>
      Voici quelques articles choisis :
      <a href="/david/blog/2019/faire-equipe/" title="Accéder à l’article complet">Faire équipe</a>,
      <a href="/david/blog/2018/bivouac-automnal/" title="Accéder à l’article complet">Bivouac automnal</a>,
      <a href="/david/blog/2018/commodite-effondrement/" title="Accéder à l’article complet">Commodité et effondrement</a>,
      <a href="/david/blog/2017/donnees-communs/" title="Accéder à l’article complet">Des données aux communs</a>,
      <a href="/david/blog/2016/accompagner-enfant/" title="Accéder à l’article complet">Accompagner un enfant</a>,
      <a href="/david/blog/2016/senior-developer/" title="Accéder à l’article complet">Senior developer</a>,
      <a href="/david/blog/2016/illusion-sociale/" title="Accéder à l’article complet">L’illusion sociale</a>,
      <a href="/david/blog/2016/instantane-scopyleft/" title="Accéder à l’article complet">Instantané Scopyleft</a>,
      <a href="/david/blog/2016/enseigner-web/" title="Accéder à l’article complet">Enseigner le Web</a>,
      <a href="/david/blog/2016/simplicite-defaut/" title="Accéder à l’article complet">Simplicité par défaut</a>,
      <a href="/david/blog/2016/minimalisme-esthetique/" title="Accéder à l’article complet">Minimalisme et esthétique</a>,
      <a href="/david/blog/2014/un-web-omni-present/" title="Accéder à l’article complet">Un web omni-présent</a>,
      <a href="/david/blog/2014/manifeste-developpeur/" title="Accéder à l’article complet">Manifeste de développeur</a>,
      <a href="/david/blog/2013/confort-convivialite/" title="Accéder à l’article complet">Confort et convivialité</a>,
      <a href="/david/blog/2013/testament-numerique/" title="Accéder à l’article complet">Testament numérique</a>,
      et <a href="/david/blog/" title="Accéder aux archives">bien d’autres…</a>
    </p>
    <p>
      On peut <a href="mailto:david%40larlet.fr" title="Envoyer un courriel">échanger par courriel</a>. Si éventuellement tu souhaites que l’on travaille ensemble, tu devrais commencer par consulter le <a href="http://larlet.com">profil dédié à mon activité professionnelle</a> et/ou contacter directement <a href="http://scopyleft.fr/">scopyleft</a>, la <abbr title="Société coopérative et participative">SCOP</abbr> dont je fais partie depuis six ans. Je recommande au préalable de lire <a href="/david/blog/2018/cout-site/" title="Attention ce qui va suivre peut vous choquer">combien coûte un site</a> et pourquoi je suis plutôt favorable à une <a href="/david/pro/devis/" title="Discutons-en !">non-demande de devis</a>.
    </p>
    <p>
      Je ne traque pas ta navigation mais mon
      <abbr title="Alwaysdata, 62 rue Tiquetonne 75002 Paris, +33.184162340">hébergeur</abbr>
      conserve des logs d’accès.
    </p>
  </div>
</footer>
<script type="text/javascript">
  ;(_ => {
    const jumper = document.getElementById('jumper')
    jumper.addEventListener('click', e => {
      e.preventDefault()
      const anchor = e.target.getAttribute('href')
      const targetEl = document.getElementById(anchor.substring(1))
      targetEl.scrollIntoView({behavior: 'smooth'})
    })
  })()
</script>