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

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639
  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,minimum-scale=1,initial-scale=1,shrink-to-fit=no">
  11. <!-- Required to make a valid HTML5 document. -->
  12. <title>When I’m Gone (archive) — David Larlet</title>
  13. <!-- Generated from https://realfavicongenerator.net/ such a mess. -->
  14. <link rel="apple-touch-icon" sizes="180x180" href="/static/david/icons/apple-touch-icon.png">
  15. <link rel="icon" type="image/png" sizes="32x32" href="/static/david/icons/favicon-32x32.png">
  16. <link rel="icon" type="image/png" sizes="16x16" href="/static/david/icons/favicon-16x16.png">
  17. <link rel="manifest" href="/manifest.json">
  18. <link rel="mask-icon" href="/static/david/icons/safari-pinned-tab.svg" color="#5bbad5">
  19. <link rel="shortcut icon" href="/static/david/icons/favicon.ico">
  20. <meta name="apple-mobile-web-app-title" content="David Larlet">
  21. <meta name="application-name" content="David Larlet">
  22. <meta name="msapplication-TileColor" content="#da532c">
  23. <meta name="msapplication-config" content="/static/david/icons/browserconfig.xml">
  24. <meta name="theme-color" content="#f0f0ea">
  25. <!-- That good ol' feed, subscribe :p. -->
  26. <link rel=alternate type="application/atom+xml" title=Feed href="/david/log/">
  27. <meta name="robots" content="noindex, nofollow">
  28. <meta content="origin-when-cross-origin" name="referrer">
  29. <!-- Canonical URL for SEO purposes -->
  30. <link rel="canonical" href="https://medium.com/life-tips/when-i-m-gone-f1611ceb759f">
  31. <style>
  32. /* http://meyerweb.com/eric/tools/css/reset/ */
  33. html, body, div, span,
  34. h1, h2, h3, h4, h5, h6, p, blockquote, pre,
  35. a, abbr, address, big, cite, code,
  36. del, dfn, em, img, ins,
  37. small, strike, strong, tt, var,
  38. dl, dt, dd, ol, ul, li,
  39. fieldset, form, label, legend,
  40. table, caption, tbody, tfoot, thead, tr, th, td,
  41. article, aside, canvas, details, embed,
  42. figure, figcaption, footer, header, hgroup,
  43. menu, nav, output, ruby, section, summary,
  44. time, mark, audio, video {
  45. margin: 0;
  46. padding: 0;
  47. border: 0;
  48. font-size: 100%;
  49. font: inherit;
  50. vertical-align: baseline;
  51. }
  52. /* HTML5 display-role reset for older browsers */
  53. article, aside, details, figcaption, figure,
  54. footer, header, hgroup, menu, nav, section { display: block; }
  55. body { line-height: 1; }
  56. blockquote, q { quotes: none; }
  57. blockquote:before, blockquote:after,
  58. q:before, q:after {
  59. content: '';
  60. content: none;
  61. }
  62. table {
  63. border-collapse: collapse;
  64. border-spacing: 0;
  65. }
  66. /* http://practicaltypography.com/equity.html */
  67. /* https://calendar.perfplanet.com/2016/no-font-face-bulletproof-syntax/ */
  68. /* https://www.filamentgroup.com/lab/js-web-fonts.html */
  69. @font-face {
  70. font-family: 'EquityTextB';
  71. src: url('/static/david/css/fonts/Equity-Text-B-Regular-webfont.woff2') format('woff2'),
  72. url('/static/david/css/fonts/Equity-Text-B-Regular-webfont.woff') format('woff');
  73. font-weight: 300;
  74. font-style: normal;
  75. font-display: swap;
  76. }
  77. @font-face {
  78. font-family: 'EquityTextB';
  79. src: url('/static/david/css/fonts/Equity-Text-B-Italic-webfont.woff2') format('woff2'),
  80. url('/static/david/css/fonts/Equity-Text-B-Italic-webfont.woff') format('woff');
  81. font-weight: 300;
  82. font-style: italic;
  83. font-display: swap;
  84. }
  85. @font-face {
  86. font-family: 'EquityTextB';
  87. src: url('/static/david/css/fonts/Equity-Text-B-Bold-webfont.woff2') format('woff2'),
  88. url('/static/david/css/fonts/Equity-Text-B-Bold-webfont.woff') format('woff');
  89. font-weight: 700;
  90. font-style: normal;
  91. font-display: swap;
  92. }
  93. @font-face {
  94. font-family: 'ConcourseT3';
  95. src: url('/static/david/css/fonts/concourse_t3_regular-webfont-20190806.woff2') format('woff2'),
  96. url('/static/david/css/fonts/concourse_t3_regular-webfont-20190806.woff') format('woff');
  97. font-weight: 300;
  98. font-style: normal;
  99. font-display: swap;
  100. }
  101. /* http://practice.typekit.com/lesson/caring-about-opentype-features/ */
  102. body {
  103. /* http://www.cssfontstack.com/ Palatino 99% Win 86% Mac */
  104. font-family: "EquityTextB", Palatino, serif;
  105. background-color: #f0f0ea;
  106. color: #07486c;
  107. font-kerning: normal;
  108. -moz-osx-font-smoothing: grayscale;
  109. -webkit-font-smoothing: subpixel-antialiased;
  110. text-rendering: optimizeLegibility;
  111. font-variant-ligatures: common-ligatures contextual;
  112. font-feature-settings: "kern", "liga", "clig", "calt";
  113. }
  114. pre, code, kbd, samp, var, tt {
  115. font-family: 'TriplicateT4c', monospace;
  116. }
  117. em {
  118. font-style: italic;
  119. color: #323a45;
  120. }
  121. strong {
  122. font-weight: bold;
  123. color: black;
  124. }
  125. nav {
  126. background-color: #323a45;
  127. color: #f0f0ea;
  128. display: flex;
  129. justify-content: space-around;
  130. padding: 1rem .5rem;
  131. }
  132. nav:last-child {
  133. border-bottom: 1vh solid #2d7474;
  134. }
  135. nav a {
  136. color: #f0f0ea;
  137. }
  138. nav abbr {
  139. border-bottom: 1px dotted white;
  140. }
  141. h1 {
  142. border-top: 1vh solid #2d7474;
  143. border-bottom: .2vh dotted #2d7474;
  144. background-color: #e3e1e1;
  145. color: #323a45;
  146. text-align: center;
  147. padding: 5rem 0 4rem 0;
  148. width: 100%;
  149. font-family: 'ConcourseT3';
  150. display: flex;
  151. flex-direction: column;
  152. }
  153. h1.single {
  154. padding-bottom: 10rem;
  155. }
  156. h1 span {
  157. position: absolute;
  158. top: 1vh;
  159. left: 20%;
  160. line-height: 0;
  161. }
  162. h1 span a {
  163. line-height: 1.7;
  164. padding: 1rem 1.2rem .6rem 1.2rem;
  165. border-radius: 0 0 6% 6%;
  166. background: #2d7474;
  167. font-size: 1.3rem;
  168. color: white;
  169. text-decoration: none;
  170. }
  171. h2 {
  172. margin: 4rem 0 1rem;
  173. border-top: .2vh solid #2d7474;
  174. padding-top: 1vh;
  175. }
  176. h3 {
  177. text-align: center;
  178. margin: 3rem 0 .75em;
  179. }
  180. hr {
  181. height: .4rem;
  182. width: .4rem;
  183. border-radius: .4rem;
  184. background: #07486c;
  185. margin: 2.5rem auto;
  186. }
  187. time {
  188. display: bloc;
  189. margin-left: 0 !important;
  190. }
  191. ul, ol {
  192. margin: 2rem;
  193. }
  194. ul {
  195. list-style-type: square;
  196. }
  197. a {
  198. text-decoration-skip-ink: auto;
  199. text-decoration-thickness: 0.05em;
  200. text-underline-offset: 0.09em;
  201. }
  202. article {
  203. max-width: 50rem;
  204. display: flex;
  205. flex-direction: column;
  206. margin: 2rem auto;
  207. }
  208. article.single {
  209. border-top: .2vh dotted #2d7474;
  210. margin: -6rem auto 1rem auto;
  211. background: #f0f0ea;
  212. padding: 2rem;
  213. }
  214. article p:last-child {
  215. margin-bottom: 1rem;
  216. }
  217. p {
  218. padding: 0 .5rem;
  219. margin-left: 3rem;
  220. }
  221. p + p,
  222. figure + p {
  223. margin-top: 2rem;
  224. }
  225. blockquote {
  226. background-color: #e3e1e1;
  227. border-left: .5vw solid #2d7474;
  228. display: flex;
  229. flex-direction: column;
  230. align-items: center;
  231. padding: 1rem;
  232. margin: 1.5rem;
  233. }
  234. blockquote cite {
  235. font-style: italic;
  236. }
  237. blockquote p {
  238. margin-left: 0;
  239. }
  240. figure {
  241. border-top: .2vh solid #2d7474;
  242. background-color: #e3e1e1;
  243. text-align: center;
  244. padding: 1.5rem 0;
  245. margin: 1rem 0 0;
  246. font-size: 1.5rem;
  247. width: 100%;
  248. }
  249. figure img {
  250. max-width: 250px;
  251. max-height: 250px;
  252. border: .5vw solid #323a45;
  253. padding: 1px;
  254. }
  255. figcaption {
  256. padding: 1rem;
  257. line-height: 1.4;
  258. }
  259. aside {
  260. display: flex;
  261. flex-direction: column;
  262. background-color: #e3e1e1;
  263. padding: 1rem 0;
  264. border-bottom: .2vh solid #07486c;
  265. }
  266. aside p {
  267. max-width: 50rem;
  268. margin: 0 auto;
  269. }
  270. /* https://fvsch.com/code/css-locks/ */
  271. p, li, pre, code, kbd, samp, var, tt, time, details, figcaption {
  272. font-size: 1rem;
  273. line-height: calc( 1.5em + 0.2 * 1rem );
  274. }
  275. h1 {
  276. font-size: 1.9rem;
  277. line-height: calc( 1.2em + 0.2 * 1rem );
  278. }
  279. h2 {
  280. font-size: 1.6rem;
  281. line-height: calc( 1.3em + 0.2 * 1rem );
  282. }
  283. h3 {
  284. font-size: 1.35rem;
  285. line-height: calc( 1.4em + 0.2 * 1rem );
  286. }
  287. @media (min-width: 20em) {
  288. /* The (100vw - 20rem) / (50 - 20) part
  289. resolves to 0-1rem, depending on the
  290. viewport width (between 20em and 50em). */
  291. p, li, pre, code, kbd, samp, var, tt, time, details, figcaption {
  292. font-size: calc( 1rem + .6 * (100vw - 20rem) / (50 - 20) );
  293. line-height: calc( 1.5em + 0.2 * (100vw - 50rem) / (20 - 50) );
  294. margin-left: 0;
  295. }
  296. h1 {
  297. font-size: calc( 1.9rem + 1.5 * (100vw - 20rem) / (50 - 20) );
  298. line-height: calc( 1.2em + 0.2 * (100vw - 50rem) / (20 - 50) );
  299. }
  300. h2 {
  301. font-size: calc( 1.5rem + 1.5 * (100vw - 20rem) / (50 - 20) );
  302. line-height: calc( 1.3em + 0.2 * (100vw - 50rem) / (20 - 50) );
  303. }
  304. h3 {
  305. font-size: calc( 1.35rem + 1.5 * (100vw - 20rem) / (50 - 20) );
  306. line-height: calc( 1.4em + 0.2 * (100vw - 50rem) / (20 - 50) );
  307. }
  308. }
  309. @media (min-width: 50em) {
  310. /* The right part of the addition *must* be a
  311. rem value. In this example we *could* change
  312. the whole declaration to font-size:2.5rem,
  313. but if our baseline value was not expressed
  314. in rem we would have to use calc. */
  315. p, li, pre, code, kbd, samp, var, tt, time, details, figcaption {
  316. font-size: calc( 1rem + .6 * 1rem );
  317. line-height: 1.5em;
  318. }
  319. p, li, pre, details {
  320. margin-left: 3rem;
  321. }
  322. h1 {
  323. font-size: calc( 1.9rem + 1.5 * 1rem );
  324. line-height: 1.2em;
  325. }
  326. h2 {
  327. font-size: calc( 1.5rem + 1.5 * 1rem );
  328. line-height: 1.3em;
  329. }
  330. h3 {
  331. font-size: calc( 1.35rem + 1.5 * 1rem );
  332. line-height: 1.4em;
  333. }
  334. figure img {
  335. max-width: 500px;
  336. max-height: 500px;
  337. }
  338. }
  339. figure.unsquared {
  340. margin-bottom: 1.5rem;
  341. }
  342. figure.unsquared img {
  343. height: inherit;
  344. }
  345. @media print {
  346. body { font-size: 100%; }
  347. a:after { content: " (" attr(href) ")"; }
  348. a, a:link, a:visited, a:after {
  349. text-decoration: underline;
  350. text-shadow: none !important;
  351. background-image: none !important;
  352. background: white;
  353. color: black;
  354. }
  355. abbr[title] { border-bottom: 0; }
  356. abbr[title]:after { content: " (" attr(title) ")"; }
  357. img { page-break-inside: avoid; }
  358. @page { margin: 2cm .5cm; }
  359. h1, h2, h3 { page-break-after: avoid; }
  360. p3 { orphans: 3; widows: 3; }
  361. img {
  362. max-width: 250px !important;
  363. max-height: 250px !important;
  364. }
  365. nav, aside { display: none; }
  366. }
  367. ul.with_columns {
  368. column-count: 1;
  369. }
  370. @media (min-width: 20em) {
  371. ul.with_columns {
  372. column-count: 2;
  373. }
  374. }
  375. @media (min-width: 50em) {
  376. ul.with_columns {
  377. column-count: 3;
  378. }
  379. }
  380. ul.with_two_columns {
  381. column-count: 1;
  382. }
  383. @media (min-width: 20em) {
  384. ul.with_two_columns {
  385. column-count: 1;
  386. }
  387. }
  388. @media (min-width: 50em) {
  389. ul.with_two_columns {
  390. column-count: 2;
  391. }
  392. }
  393. .gallery {
  394. display: flex;
  395. flex-wrap: wrap;
  396. justify-content: space-around;
  397. }
  398. .gallery figure img {
  399. margin-left: 1rem;
  400. margin-right: 1rem;
  401. }
  402. .gallery figure figcaption {
  403. font-family: 'ConcourseT3'
  404. }
  405. footer {
  406. font-family: 'ConcourseT3';
  407. display: flex;
  408. flex-direction: column;
  409. border-top: 3px solid white;
  410. padding: 4rem 0;
  411. background-color: #07486c;
  412. color: white;
  413. }
  414. footer > * {
  415. max-width: 50rem;
  416. margin: 0 auto;
  417. }
  418. footer a {
  419. color: #f1c40f;
  420. }
  421. footer .avatar {
  422. width: 200px;
  423. height: 200px;
  424. border-radius: 50%;
  425. float: left;
  426. -webkit-shape-outside: circle();
  427. shape-outside: circle();
  428. margin-right: 2rem;
  429. padding: 2px 5px 5px 2px;
  430. background: white;
  431. border-left: 1px solid #f1c40f;
  432. border-top: 1px solid #f1c40f;
  433. border-right: 5px solid #f1c40f;
  434. border-bottom: 5px solid #f1c40f;
  435. }
  436. </style>
  437. <h1>
  438. <span><a id="jumper" href="#jumpto" title="Un peu perdu ?">?</a></span>
  439. When I’m Gone (archive)
  440. <time>Pour la pérennité des contenus liés. Non-indexé, retrait sur simple email.</time>
  441. </h1>
  442. <section>
  443. <article>
  444. <h3><a href="https://medium.com/life-tips/when-i-m-gone-f1611ceb759f">Source originale du contenu</a></h3>
  445. <p name="9260" id="9260" class="graf--p graf-after--h3">Death is always a surprise. No one expects it. Not even terminal patients think they are going to die in a day or two. In a week, maybe. But only when this particular week is the next week.</p>
  446. <p name="ebd7" id="ebd7" class="graf--p graf-after--p">We are never ready. It is never the right time. By the time it comes, you will not have done all the things that we wanted to. The end always comes as a surprise, and it’s a tearful moment for widows and a bore for the children who don’t really understand what a funeral is (thank God).</p>
  447. <p name="8d06" id="8d06" class="graf--p graf-after--p">It was no different with my father. In fact, his death was even more unexpected. He was gone at age 27. The same age that claimed the lives of several famous musicians. He was young. Way too young. My father was not a musician and neither a famous person. Cancer doesn’t pick its victims. He was gone when I was young, and I learned what a funeral was because of him. I was 8 and half, old enough to miss him for a lifetime. Had he died before, I wouldn’t have memories. I would feel no pain. But I wouldn’t have a father in my life. And I had a father.</p>
  448. <p name="7d76" id="7d76" class="graf--p graf-after--p">I had a father who was both firm and fun. Someone who would tell a joke before grounding me. That way, I wouldn’t feel so bad. Someone who kissed me on the forehead before I went to sleep. A habit which I passed on to my children. Someone who forced me to support the same football team he supported, and who explained things better than my mother. Do you know what I mean? A father like that is someone to be missed.</p>
  449. <p name="5381" id="5381" class="graf--p graf-after--p">He never told me he was going to die. Even when he was lying on a hospital bed with tubes all over him, he didn’t say a word. My father made plans for the next year even though he knew he wouldn’t be around in the next month. Next year, we would go fishing, we would travel, we would visit places we’ve never been. Next year would be an amazing year. We lived the same dream.</p>
  450. <p name="0384" id="0384" class="graf--p graf-after--p">I believe — actually I’m sure — he thought this should bring luck. He was a superstitious man. Thinking about the future was the way he found to keep hope alive. The bastard made me laugh until the very end. He knew about it. He didn’t tell me. He didn’t see me crying.</p>
  451. <p name="b1b1" id="b1b1" class="graf--p graf-after--p">And suddenly, the next year was over before it even started.</p>
  452. <p name="c104" id="c104" class="graf--p graf-after--p">My mother picked me up at school and we went to the hospital. The doctor told the news with all the sensitivity that doctors lose over the years. My mother cried. She did have a tiny bit of hope. As I said before, everyone does. I felt the blow. What does it mean? Wasn’t it just a regular disease, the kind of disease doctors heal with a shot? I hated you, dad. I felt betrayed. I screamed with anger in the hospital, until I realized my father was not around to ground me. I cried.</p>
  453. <p name="7f08" id="7f08" class="graf--p graf-after--p">Then, my father was once again a father to me. With a shoebox under her arm, a nurse came by to comfort me. The box was full of sealed envelopes, with sentences where the address should be. I couldn’t understand exactly what was going on. The nurse then handed me a letter. The only letter that was out of the box.</p>
  454. <p name="fa8a" id="fa8a" class="graf--p graf--startsWithDoubleQuote graf-after--p">“Your dad asked me to give you this letter. He spent the whole week writing these, and he wants you read it. Be strong.” the nurse said, holding me.</p>
  455. <p name="863e" id="863e" class="graf--p graf-after--p">The envelope read WHEN I’M GONE. I opened it.</p>
  456. <p name="e790" id="e790" class="graf--p graf-after--p"><strong class="markup--strong markup--p-strong">Son,</strong></p>
  457. <p name="4b3c" id="4b3c" class="graf--p graf-after--p"><strong class="markup--strong markup--p-strong">If you’re reading this, I’m dead. I’m sorry. I knew I was going to die.</strong></p>
  458. <p name="fb7c" id="fb7c" class="graf--p graf-after--p"><strong class="markup--strong markup--p-strong">I didn’t want to tell you what was going to happen, I didn’t want to see you crying. Well, it looks like I’ve made it. I think that a man who’s about to die has the right to act a little bit selfish.</strong></p>
  459. <p name="5268" id="5268" class="graf--p graf-after--p"><strong class="markup--strong markup--p-strong">Well, as you can see, I still have a lot to teach you. After all, you don’t know crap about anything. So I wrote these letters for you. You must not open them before the right moment, OK? This is our deal.</strong></p>
  460. <p name="1de0" id="1de0" class="graf--p graf-after--p"><strong class="markup--strong markup--p-strong">I love you. Take care of your mom. You’re the man of the house now.</strong></p>
  461. <p name="2cec" id="2cec" class="graf--p graf-after--p"><strong class="markup--strong markup--p-strong">Love, dad.</strong></p>
  462. <p name="dd9f" id="dd9f" class="graf--p graf-after--p"><strong class="markup--strong markup--p-strong">PS: I didn’t write letters to your mom. She’s got my car.</strong></p>
  463. <p name="071b" id="071b" class="graf--p graf-after--p">He made me stop crying with his bad handwriting. Printing was not easy back then. His ugly writing, which I barely understood, made me feel calm. It made me smile. That’s how my father did things. Like the joke before the grounding.</p>
  464. <p name="ac93" id="ac93" class="graf--p graf-after--p">That box became the most important thing in the world for me. I told my mother not to open it. Those letters were mine and no one else could read them. I knew all the life moments written on the envelopes by heart. But it took a while for these moments to happen. And I forgot about it.</p>
  465. <p name="5b1e" id="5b1e" class="graf--p graf-after--p">Seven years later, after we moved to a new place, I had no idea where I put the box. I couldn’t remember it. And when we don’t remember something, we usually don’t care about it. If something goes lost in your memory, It doesn’t mean you lost it. It simply doesn’t exist anymore. It’s like change in the pockets of your trousers.</p>
  466. <p name="8a5e" id="8a5e" class="graf--p graf-after--p">And so it happened. My teenage years and my mother’s new boyfriend triggered what my father had anticipated a long time before. My mother had several boyfriends, and I always understood it. She never married again. I don’t know why, but I like to believe that my father had been the love of her life. This boyfriend, however, was worthless. I thought she was humiliating herself by dating him. He had no respect for her. She deserved something a lot better than a guy she met at a bar.</p>
  467. <p name="4175" id="4175" class="graf--p graf-after--p">I still remember the slap she gave me after I pronounced the word “bar”. I’ll admit that I deserved it. I learned that over the years. At the time, when my skin was still burning from the slap, I remembered the box and the letters. I remembered a specific letter, which read “WHEN YOU HAVE THE WORST FIGHT EVER WITH YOUR MOM”.</p>
  468. <p name="4457" id="4457" class="graf--p graf-after--p">I ransacked my bedroom looking for it, which earned me another slap in the face. I found the box inside a suitcase lying on top of the wardrobe. The limbo. I looked through the letters, and realized that I had forgotten to open WHEN YOU HAVE YOUR FIRST KISS. I hated myself for doing that, and I decided that would be the next letter I’d open. WHEN YOU LOSE YOUR VIRGINITY came right next in the pack, a letter I was hoping to open really soon. Eventually I found what I was looking for.</p>
  469. <p name="3964" id="3964" class="graf--p graf-after--p"><strong class="markup--strong markup--p-strong">Now apologize to her.</strong></p>
  470. <p name="13c6" id="13c6" class="graf--p graf-after--p"><strong class="markup--strong markup--p-strong">I don’t know why you’re fighting and I don’t know who’s right. But I know your mother. So a humble apology is the best way to get over this. I’m talking about a down-on-your-knees apology.</strong></p>
  471. <p name="6c70" id="6c70" class="graf--p graf-after--p"><strong class="markup--strong markup--p-strong">She’s your mother, kid. She loves you more than anything in this world. Do you know that she went through natural birth because someone told her that it would be the best for you? Have you ever seen a woman giving birth? Do you need a bigger proof of love than that?</strong></p>
  472. <p name="3d91" id="3d91" class="graf--p graf-after--p"><strong class="markup--strong markup--p-strong">Apologize. She’ll forgive you.</strong></p>
  473. <p name="f1b5" id="f1b5" class="graf--p graf-after--p"><strong class="markup--strong markup--p-strong">Love, dad.</strong></p>
  474. <p name="6ab5" id="6ab5" class="graf--p graf-after--p">My father was not a great writer, he was just a bank clerk. But his words had a great impact on me. They were words that carried more wisdom than all of my 15 years of age at the time. (That wasn’t very hard to achieve, though).</p>
  475. <p name="9a45" id="9a45" class="graf--p graf-after--p">I rushed to my mother’s room and opened the door. I was crying when she turned her head to look me in the eyes. She was also crying. I don’t remember what she yelled at me. Probably something like “What do you want?” What I do remember is that I walked towards her holding the letter my father wrote. I held her in my arms, while my hands crumpled the old paper. She hugged me, and we both stood in silence.</p>
  476. <p name="4501" id="4501" class="graf--p graf-after--p">My father’s letter made her laugh a few minutes later. We made peace and talked a little about him. She told me about some of his most eccentric habits, such as eating salami with strawberries. Somehow, I felt he was sitting right next to us. Me, my mother and a piece of my father, a piece he left for us, on a piece of paper. It felt good.</p>
  477. <p name="16e0" id="16e0" class="graf--p graf-after--p">It didn’t take long before I read WHEN YOU LOSE YOUR VIRGINITY</p>
  478. <p name="e0cd" id="e0cd" class="graf--p graf-after--p"><strong class="markup--strong markup--p-strong">Congratulations, son.</strong></p>
  479. <p name="f2cd" id="f2cd" class="graf--p graf-after--p"><strong class="markup--strong markup--p-strong">Don’t worry, it gets better with time. It always sucks the first time. Mine happened with an ugly woman…who was also a prostitute.</strong></p>
  480. <p name="e65c" id="e65c" class="graf--p graf-after--p"><strong class="markup--strong markup--p-strong">My biggest fear is that you’d ask your mother what virginity is after reading what’s on the letter. Or even worse, reading what I just wrote without knowing what jerking off is (you know what it is, right?). But that’s none of my business.</strong></p>
  481. <p name="6654" id="6654" class="graf--p graf-after--p"><strong class="markup--strong markup--p-strong">Love, dad.</strong></p>
  482. <p name="2f78" id="2f78" class="graf--p graf-after--p">My father followed me through my entire life. He was with me, even though he was not near me. His words did what no one else could: they gave me strength to overcome countless challenging moments in my life. He would always find a way to put a smile on my face when things looked grim, or clear my mind during those angry moments.</p>
  483. <p name="51b8" id="51b8" class="graf--p graf-after--p">WHEN YOU GET MARRIED made me feel very emotional. But not so much as WHEN YOU BECOME A FATHER.</p>
  484. <p name="33b2" id="33b2" class="graf--p graf-after--p"><strong class="markup--strong markup--p-strong">Now you’ll understand what real love is, son. You’ll realize how much you love her, but real love is something you’ll feel for this little thing over there. I don’t know if it’s a boy or a girl. I’m just a corpse, I’m not a fortune teller.</strong></p>
  485. <p name="b289" id="b289" class="graf--p graf-after--p"><strong class="markup--strong markup--p-strong">Have fun. It’s a great thing. Time is gonna fly now, so make sure you’ll be around. Never miss a moment, they never come back. Change diapers, bathe the baby, be a role model to this child. I think you have what it takes to be an amazing father, just like me.</strong></p>
  486. <p name="3b16" id="3b16" class="graf--p graf-after--p">The most painful letter I read in my entire life was also the shortest letter my father wrote. While he wrote those four words, I believe he suffered just as much as I did living through that moment. It took a while, but eventually I had to open WHEN YOUR MOTHER IS GONE.</p>
  487. <p name="9892" id="9892" class="graf--p graf-after--p"><strong class="markup--strong markup--p-strong">She is mine now.</strong></p>
  488. <p name="8afd" id="8afd" class="graf--p graf-after--p">A joke. A sad clown hiding his sadness with a smile on his makeup. It was the only letter that didn’t make me smile, but I could see the reason.</p>
  489. <p name="10b0" id="10b0" class="graf--p graf-after--p">I always kept the deal I had made with my father. I never read letters before their time. With the exception of WHEN YOU REALIZE YOU’RE GAY. Since I never thought I’d have to open this one, I decided to read it. It was one of the funniest letters, by the way.</p>
  490. <p name="2b6f" id="2b6f" class="graf--p graf-after--p"><strong class="markup--strong markup--p-strong">What can I say? I’m glad I’m dead.</strong></p>
  491. <p name="084a" id="084a" class="graf--p graf-after--p"><strong class="markup--strong markup--p-strong">Now, all joking aside, being half-dead made me realize that we care too much about things that don’t matter much. Do you think that changes anything, son?</strong></p>
  492. <p name="9151" id="9151" class="graf--p graf-after--p"><strong class="markup--strong markup--p-strong">Don’t be silly. Be happy.</strong></p>
  493. <p name="9915" id="9915" class="graf--p graf-after--p">I would always wait for the next moment, the next letter. The next lesson my father would teach me. It’s amazing what a 27 year old man can teach to an 85 year old senior like me.</p>
  494. <p name="ad00" id="ad00" class="graf--p graf-after--p">Now that I am lying on a hospital bed, with tubes in my nose and my throat thanks to this damn cancer, I run my fingers on the faded paper of the only letter I didn’t open. The sentence WHEN YOUR TIME COMES is barely visible on the envelope.</p>
  495. <p name="801d" id="801d" class="graf--p graf-after--p">I don’t want to open it. I’m scared. I don’t want to believe that my time is near. It’s a matter of hope, you know? No one believes they’re gonna die.</p>
  496. <p name="2a0f" id="2a0f" class="graf--p graf-after--p">I take a deep breath, opening the envelope.</p>
  497. <p name="0943" id="0943" class="graf--p graf-after--p"><strong class="markup--strong markup--p-strong">Hello, son. I hope you’re an old man now.</strong></p>
  498. <p name="585c" id="585c" class="graf--p graf-after--p"><strong class="markup--strong markup--p-strong">You know, this letter was the easiest to write, and the first I wrote. It was the letter that set me free from the pain of losing you. I think your mind becomes clearer when you’re this close to the end. It’s easier to talk about it.</strong></p>
  499. <p name="2214" id="2214" class="graf--p graf-after--p"><strong class="markup--strong markup--p-strong">In my last days here I thought about the life I had. I had a brief life, but a very happy one. I was your father and the husband of your mother. What else could I ask for? It gave me peace of mind. Now you do the same.</strong></p>
  500. <p name="34e7" id="34e7" class="graf--p graf-after--p"><strong class="markup--strong markup--p-strong">My advice for you: you don’t have to be afraid</strong></p>
  501. <p name="eea2" id="eea2" class="graf--p graf-after--p graf--last"><strong class="markup--strong markup--p-strong">PS: I miss you</strong></p>
  502. </article>
  503. </section>
  504. <nav id="jumpto">
  505. <p>
  506. <a href="/david/blog/">Accueil du blog</a> |
  507. <a href="https://medium.com/life-tips/when-i-m-gone-f1611ceb759f">Source originale</a> |
  508. <a href="/david/stream/2019/">Accueil du flux</a>
  509. </p>
  510. </nav>
  511. <footer>
  512. <div>
  513. <img src="/static/david/david-larlet-avatar.jpg" loading="lazy" class="avatar" width="200" height="200">
  514. <p>
  515. Bonjour/Hi!
  516. 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>
  517. 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>).
  518. </p>
  519. <p>
  520. 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>.
  521. </p>
  522. <p>
  523. Voici quelques articles choisis :
  524. <a href="/david/blog/2019/faire-equipe/" title="Accéder à l’article complet">Faire équipe</a>,
  525. <a href="/david/blog/2018/bivouac-automnal/" title="Accéder à l’article complet">Bivouac automnal</a>,
  526. <a href="/david/blog/2018/commodite-effondrement/" title="Accéder à l’article complet">Commodité et effondrement</a>,
  527. <a href="/david/blog/2017/donnees-communs/" title="Accéder à l’article complet">Des données aux communs</a>,
  528. <a href="/david/blog/2016/accompagner-enfant/" title="Accéder à l’article complet">Accompagner un enfant</a>,
  529. <a href="/david/blog/2016/senior-developer/" title="Accéder à l’article complet">Senior developer</a>,
  530. <a href="/david/blog/2016/illusion-sociale/" title="Accéder à l’article complet">L’illusion sociale</a>,
  531. <a href="/david/blog/2016/instantane-scopyleft/" title="Accéder à l’article complet">Instantané Scopyleft</a>,
  532. <a href="/david/blog/2016/enseigner-web/" title="Accéder à l’article complet">Enseigner le Web</a>,
  533. <a href="/david/blog/2016/simplicite-defaut/" title="Accéder à l’article complet">Simplicité par défaut</a>,
  534. <a href="/david/blog/2016/minimalisme-esthetique/" title="Accéder à l’article complet">Minimalisme et esthétique</a>,
  535. <a href="/david/blog/2014/un-web-omni-present/" title="Accéder à l’article complet">Un web omni-présent</a>,
  536. <a href="/david/blog/2014/manifeste-developpeur/" title="Accéder à l’article complet">Manifeste de développeur</a>,
  537. <a href="/david/blog/2013/confort-convivialite/" title="Accéder à l’article complet">Confort et convivialité</a>,
  538. <a href="/david/blog/2013/testament-numerique/" title="Accéder à l’article complet">Testament numérique</a>,
  539. et <a href="/david/blog/" title="Accéder aux archives">bien d’autres…</a>
  540. </p>
  541. <p>
  542. 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>.
  543. </p>
  544. <p>
  545. Je ne traque pas ta navigation mais mon
  546. <abbr title="Alwaysdata, 62 rue Tiquetonne 75002 Paris, +33.184162340">hébergeur</abbr>
  547. conserve des logs d’accès.
  548. </p>
  549. </div>
  550. </footer>
  551. <script type="text/javascript">
  552. ;(_ => {
  553. const jumper = document.getElementById('jumper')
  554. jumper.addEventListener('click', e => {
  555. e.preventDefault()
  556. const anchor = e.target.getAttribute('href')
  557. const targetEl = document.getElementById(anchor.substring(1))
  558. targetEl.scrollIntoView({behavior: 'smooth'})
  559. })
  560. })()
  561. </script>