} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | ||||
type="font/woff2" | type="font/woff2" | ||||
media="(prefers-color-scheme: dark)" | media="(prefers-color-scheme: dark)" | ||||
crossorigin> | crossorigin> | ||||
<meta name="description" content="Le flow) n’est pas seulement un état où j’ai besoin de calme, il s’agit d’un contexte à part entière. Il me faut une problématique connue, qui est définie avec des contours relativement flous, davantage une intention qu’une direction. Si j’ai déjà eu l’occasion d’être précédemment frustré par l’implémentation en cours, cela me donne beaucoup de motivation pour plonger. Parfois la zone est atteinte en n’étant pas devant un écran (en courant, sous la douche, etc), une forme d’Eurêka ! qui annonce la libération du flow à venir."> | |||||
<meta name="description" content="Le flow n’est pas seulement un état où j’ai besoin de calme, il s’agit d’un contexte à part entière. Il me faut une problématique connue, qui est définie avec des contours relativement flous, davantage une intention qu’une direction. Si j’ai déjà eu l’occasion d’être précédemment frustré par l’implémentation en cours, cela me donne beaucoup de motivation pour plonger. Parfois la zone est atteinte en n’étant pas devant un écran (en courant, sous la douche, etc), une forme d’Eurêka ! qui annonce la libération du flow à venir."> | |||||
<!-- That good ol' feed, subscribe :). --> | <!-- That good ol' feed, subscribe :). --> | ||||
<link rel="alternate" | <link rel="alternate" | ||||
type="application/atom+xml" | type="application/atom+xml" | ||||
title="Aller à la page de recherche" | title="Aller à la page de recherche" | ||||
rel="search" data-no-instant>Recherche</a> | rel="search" data-no-instant>Recherche</a> | ||||
• <a rel="next" | |||||
href="/david/2024/03/09/" | |||||
title="Publication suivante : Marque">Suivant →</a> | |||||
</p> | </p> | ||||
</nav> | </nav> | ||||
<p>Le <a data-link-domain="fr.wikipedia.org" href="https://fr.wikipedia.org/wiki/Flow_(psychologie">flow</a>) n’est pas seulement un état où j’ai besoin de calme, il s’agit d’un contexte à part entière. Il me faut une problématique connue, qui est définie avec des contours relativement flous, davantage une intention qu’une direction. Si j’ai déjà eu l’occasion d’être précédemment frustré par l’implémentation en cours, cela me donne beaucoup de motivation pour plonger. Parfois la zone est atteinte en n’étant pas devant un écran (en courant, sous la douche, etc), une forme d’<em>Eurêka !</em> qui annonce la libération du <em>flow</em> à venir.</p> | |||||
<p>Le <a data-link-domain="fr.wikipedia.org" href="https://fr.wikipedia.org/wiki/Flow_(psychologie)">flow</a> n’est pas seulement un état où j’ai besoin de calme, il s’agit d’un contexte à part entière. Il me faut une problématique connue, qui est définie avec des contours relativement flous, davantage une intention qu’une direction. Si j’ai déjà eu l’occasion d’être précédemment frustré par l’implémentation en cours, cela me donne beaucoup de motivation pour plonger. Parfois la zone est atteinte en n’étant pas devant un écran (en courant, sous la douche, etc), une forme d’<em>Eurêka !</em> qui annonce la libération du <em>flow</em> à venir.</p> | |||||
<p>La crue monte et butte contre des digues techniques, plusieurs fois, avant de créer la brèche qui va tout libérer d’un coup et se répandre dans l’ensemble du code. Reste la tâche de <em>ressuyage</em> : <q lang="fr">l’évacuation des eaux qui se sont déversées dans les terres après une inondation et ainsi de diminuer le temps de submersion</q> nous dit le <a data-link-domain="symadrem.fr" href="https://www.symadrem.fr/anticiper-intervenir/evacuation-des-eaux-post-crue/quest-ce-que-le-ressuyage/">Symadrem</a>. Ce n’est pas une tâche ingrate car c’est celle qui rend le code pérenne et compréhensible, l’objet du <em>flow</em> accessible au plus grand nombre. Le temps de la décrue permet d’identifier les cas aux limites également.</p> | <p>La crue monte et butte contre des digues techniques, plusieurs fois, avant de créer la brèche qui va tout libérer d’un coup et se répandre dans l’ensemble du code. Reste la tâche de <em>ressuyage</em> : <q lang="fr">l’évacuation des eaux qui se sont déversées dans les terres après une inondation et ainsi de diminuer le temps de submersion</q> nous dit le <a data-link-domain="symadrem.fr" href="https://www.symadrem.fr/anticiper-intervenir/evacuation-des-eaux-post-crue/quest-ce-que-le-ressuyage/">Symadrem</a>. Ce n’est pas une tâche ingrate car c’est celle qui rend le code pérenne et compréhensible, l’objet du <em>flow</em> accessible au plus grand nombre. Le temps de la décrue permet d’identifier les cas aux limites également.</p> | ||||
<p>Ce contexte ne m’est atteignable que 3 ou 4 fois par an en moyenne. Et heureusement, car il est vraiment peu soutenable (mais tellement satisfaisant !).</p> | <p>Ce contexte ne m’est atteignable que 3 ou 4 fois par an en moyenne. Et heureusement, car il est vraiment peu soutenable (mais tellement satisfaisant !).</p> | ||||
<a href="#hr-104" title="Lien vers cette section de la page"><hr id="hr-104" /></a> | <a href="#hr-104" title="Lien vers cette section de la page"><hr id="hr-104" /></a> | ||||
<a href="/david/2024/" title="Liste des publications récentes">↑ En 2024</a> | <a href="/david/2024/" title="Liste des publications récentes">↑ En 2024</a> | ||||
• <a rel="next" | |||||
href="/david/2024/03/09/" | |||||
title="Publication suivante : Marque">Suivant →</a> | |||||
</p> | </p> | ||||
</nav> | </nav> | ||||
<!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` element | |||||
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,initial-scale=1"> | |||||
<!-- Required to make a valid HTML5 document. --> | |||||
<title> | |||||
Marque | |||||
— David Larlet</title> | |||||
<script> | |||||
function toggleTheme(themeName) { | |||||
document.documentElement.classList.toggle( | |||||
'forced-dark', | |||||
themeName === 'dark' | |||||
) | |||||
document.documentElement.classList.toggle( | |||||
'forced-light', | |||||
themeName === 'light' | |||||
) | |||||
} | |||||
const selectedTheme = localStorage.getItem('theme') | |||||
if (selectedTheme !== 'undefined') { | |||||
toggleTheme(selectedTheme) | |||||
} | |||||
</script> | |||||
<!-- Documented, feel free to shoot an email. --> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | |||||
<link rel="preload" | |||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | |||||
as="font" | |||||
type="font/woff2" | |||||
media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" | |||||
crossorigin> | |||||
<link rel="preload" | |||||
href="/static/david/css/fonts/century_supra_ot_a_bold.woff2" | |||||
as="font" | |||||
type="font/woff2" | |||||
media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" | |||||
crossorigin> | |||||
<link rel="preload" | |||||
href="/static/david/css/fonts/century_supra_ot_a_italic.woff2" | |||||
as="font" | |||||
type="font/woff2" | |||||
media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" | |||||
crossorigin> | |||||
<link rel="preload" | |||||
href="/static/david/css/fonts/century_supra_ot_b_regular.woff2" | |||||
as="font" | |||||
type="font/woff2" | |||||
media="(prefers-color-scheme: dark)" | |||||
crossorigin> | |||||
<link rel="preload" | |||||
href="/static/david/css/fonts/century_supra_ot_b_bold.woff2" | |||||
as="font" | |||||
type="font/woff2" | |||||
media="(prefers-color-scheme: dark)" | |||||
crossorigin> | |||||
<link rel="preload" | |||||
href="/static/david/css/fonts/century_supra_ot_b_italic.woff2" | |||||
as="font" | |||||
type="font/woff2" | |||||
media="(prefers-color-scheme: dark)" | |||||
crossorigin> | |||||
<meta name="description" content="Removing the brand from the person is all but straightforward. I now start my about page with a quick way to introduce myself by putting forward some of my values. […] Beside saying people instead of users, stop considering who’s reading my stuff as audience, and quit referring to what I do as content, I want to modify a few more behaviours:"> | |||||
<!-- That good ol' feed, subscribe :). --> | |||||
<link rel="alternate" | |||||
type="application/atom+xml" | |||||
title="Feed" | |||||
href="/david/log/"> | |||||
<!-- Generated from https://realfavicongenerator.net/ such a mess. --> | |||||
<link rel="apple-touch-icon" | |||||
sizes="180x180" | |||||
href="/static/david/icons2/apple-touch-icon.png"> | |||||
<link rel="icon" | |||||
type="image/png" | |||||
sizes="32x32" | |||||
href="/static/david/icons2/favicon-32x32.png"> | |||||
<link rel="icon" | |||||
type="image/png" | |||||
sizes="16x16" | |||||
href="/static/david/icons2/favicon-16x16.png"> | |||||
<link rel="manifest" href="/static/david/icons2/site.webmanifest"> | |||||
<link rel="mask-icon" | |||||
href="/static/david/icons2/safari-pinned-tab.svg" | |||||
color="#07486c"> | |||||
<link rel="shortcut icon" href="/static/david/icons2/favicon.ico"> | |||||
<meta name="msapplication-TileColor" content="#f7f7f7"> | |||||
<meta name="msapplication-config" | |||||
content="/static/david/icons2/browserconfig.xml"> | |||||
<meta name="theme-color" | |||||
content="#f7f7f7" | |||||
media="(prefers-color-scheme: light)"> | |||||
<meta name="theme-color" | |||||
content="#272727" | |||||
media="(prefers-color-scheme: dark)"> | |||||
<!-- Is that even respected? Retrospectively? What a shAItshow… | |||||
https://neil-clarke.com/block-the-bots-that-feed-ai-models-by-scraping-your-website/ --> | |||||
<meta name="robots" content="noai, noimageai"> | |||||
<style type="text/css"> | |||||
.tippy-content { | |||||
min-width: 280px; | |||||
padding: .5rem; | |||||
font-size: calc(var(--fluid-0) * 0.8); | |||||
font-family: var(--labor-font); | |||||
letter-spacing: initial; | |||||
text-align: left; | |||||
} | |||||
.tippy-content h3 { | |||||
margin-top: 0; | |||||
} | |||||
.tippy-content h3 img { | |||||
max-width: 2rem; | |||||
max-height: 2rem; | |||||
display: inline-block; | |||||
} | |||||
.tippy-content .tippy-links { | |||||
display: flex; | |||||
justify-content: space-around; | |||||
} | |||||
.tippy-content a { | |||||
padding: .4rem; | |||||
color: #F06048; | |||||
} | |||||
</style> | |||||
<body data-instant-intensity="viewport-all"> | |||||
<article> | |||||
<header> | |||||
<hgroup> | |||||
<h1>Marque</h1> | |||||
<p>Le <time datetime="2024-03-09">9 mars 2024</time></p> | |||||
</hgroup> | |||||
</header> | |||||
<nav> | |||||
<p> | |||||
<a rel="prev" | |||||
href="/david/2024/03/08/" | |||||
title="Publication précédente : Flow">← Précédent</a> • | |||||
<a href="/david/" title="Aller à l’accueil" rel="up">Accueil</a> | |||||
• | |||||
<a href="/david/recherche/" | |||||
title="Aller à la page de recherche" | |||||
rel="search" data-no-instant>Recherche</a> | |||||
</p> | |||||
</nav> | |||||
<blockquote lang="en"> | |||||
<p><mark>Removing the brand from the person</mark> is all but straightforward. I now start my about page with a quick way to introduce myself by putting forward some of my values. […] Beside saying <em>people</em> instead of <em>users</em>, stop considering who’s reading my stuff as <em>audience</em>, and quit referring to what I do as <em>content</em>, I want to modify a few more behaviours:</p> | |||||
<ul> | |||||
<li>Quit mentioning well-known bloggers on a first-name basis. […]</li> | |||||
<li>Keep writing about different things. […]</li> | |||||
<li>Don’t quote so-called thought leaders […]</li> | |||||
<li>Stop sugar-coating concepts […]</li> | |||||
</ul> | |||||
<p><cite><em><a data-link-domain="minutestomidnight.co.uk" href="https://minutestomidnight.co.uk/blog/kafkaesque-digital-relationship-with-ourselves/" hreflang="en" | |||||
title="Consultation de l’article (anglais)">A Kafkaesque digital relationship with ourselves</a> | |||||
<a href="/david/cache/2024/34590090e8c8ea82be14fcc3dd7b734c/" hreflang="en" | |||||
data-tippy data-description="Words are crucial to build a sense of online community, however many of us have been using them straight out of a soulless corporate lingo in order to sell ourselves as a product." | |||||
data-source="https://minutestomidnight.co.uk/blog/kafkaesque-digital-relationship-with-ourselves/" | |||||
data-date="2024-03-09" | |||||
data-favicon="https://minutestomidnight.co.uk/assets/images/favicons/favicon.svg" | |||||
data-domain="minutestomidnight.co.uk" | |||||
><svg xmlns="http://www.w3.org/2000/svg" | |||||
width="24" height="24" viewBox="0 0 24 24" fill="none" | |||||
stroke="currentColor" stroke-width="2" stroke-linecap="square" | |||||
stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle> | |||||
<path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path> | |||||
<line x1="12" y1="17" x2="12.01" y2="17"></line> | |||||
</svg> | |||||
<span class="sr-only">[archive]</span></a></em></cite></p> | |||||
</blockquote> | |||||
<p>Réflexion du jour sur le vocabulaire qui évolue pour se présenter sur le Web. Je suis souvent intrigué par les biographies et textes de présentation sur mastodon qui sont à la fois singuliers tout en respectant des codes (micro-)culturels. Peut-être que l’on a besoin de se sentir dans un cadre de représentation connu pour se sentir exister dans une communauté.</p> | |||||
<p>La même autrice, en 2002(!) :</p> | |||||
<blockquote lang="en"> | |||||
<p>Five years ago there was all this buzz about <em>virtual communities</em>. How did that go? I have no idea, all I know is that everything revolves around who’s the hottest blogger right now. They talk about themselves, reference each other, all anxious about who has the most comments or the longest and most prestigious blogroll. Compared to that, <mark>my online journal is pure mental masturbation, but at least I have the occasional good photo and such nice typography.</mark></p> | |||||
<p><cite><em><a data-link-domain="minutestomidnight.co.uk" href="https://minutestomidnight.co.uk/blog/years-just-pass-by/" hreflang="en" | |||||
title="Consultation de l’article (anglais)">Years just pass by</a> | |||||
<a href="/david/cache/2024/4f003de8f8531a4aaf121ecf6c21ae66/" hreflang="en" | |||||
data-tippy data-description="The desire to be part of a community of bloggers hits the harsh reality of how humans want thought leaders who appear to be successful." | |||||
data-source="https://minutestomidnight.co.uk/blog/years-just-pass-by/" | |||||
data-date="2024-03-09" | |||||
data-favicon="https://minutestomidnight.co.uk/assets/images/favicons/favicon.svg" | |||||
data-domain="minutestomidnight.co.uk" | |||||
><svg xmlns="http://www.w3.org/2000/svg" | |||||
width="24" height="24" viewBox="0 0 24 24" fill="none" | |||||
stroke="currentColor" stroke-width="2" stroke-linecap="square" | |||||
stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle> | |||||
<path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path> | |||||
<line x1="12" y1="17" x2="12.01" y2="17"></line> | |||||
</svg> | |||||
<span class="sr-only">[archive]</span></a></em></cite></p> | |||||
</blockquote> | |||||
<a href="#hr-106" title="Lien vers cette section de la page"><hr id="hr-106" /></a> | |||||
<pre><code>body:has(time[datetime]) li { | |||||
list-style-type: "❧ "; | |||||
} | |||||
body:has( | |||||
time[datetime^="2024-01"], | |||||
time[datetime^="2024-02"], | |||||
time[datetime^="2024-03"] | |||||
) li { | |||||
list-style-type: "❆ "; | |||||
} | |||||
body:has( | |||||
time[datetime^="2024-04"], | |||||
time[datetime^="2024-05"], | |||||
time[datetime^="2024-06"] | |||||
) li { | |||||
list-style-type: "❁ "; | |||||
} | |||||
body:has( | |||||
time[datetime^="2024-07"], | |||||
time[datetime^="2024-08"], | |||||
time[datetime^="2024-09"] | |||||
) li { | |||||
list-style-type: "❂ "; | |||||
} | |||||
</code></pre> | |||||
<p>J’avais envie d’introduire une légère saisonnalité dans mes listes à puces. Surtout une <a href="/david/2024/03/07/#hr-102">autre excuse</a> pour jouer avec <code>:has()</code>. Je lis un peu trop de blogs qui manquent de fantaisie. Et puis il pleut…</p> | |||||
<a href="#hr-107" title="Lien vers cette section de la page"><hr id="hr-107" /></a> | |||||
<p>Chant du cardinal<br /> | |||||
Le matin s’éveille sans toi<br /> | |||||
Lovée dans mes bras</p> | |||||
<nav> | |||||
<p> | |||||
<a href="/david/2024/evolution/" | |||||
title="Liste de tous les articles 2024 associés à cette étiquette" | |||||
rel="tag">#évolution</a> | |||||
<a href="/david/2024/identite/" | |||||
title="Liste de tous les articles 2024 associés à cette étiquette" | |||||
rel="tag">#identité</a> | |||||
<a href="/david/2024/poesie/" | |||||
title="Liste de tous les articles 2024 associés à cette étiquette" | |||||
rel="tag">#poésie</a> | |||||
<a href="/david/2024/#tags" title="Liste de toutes les étiquettes 2024">tous ?</a> | |||||
</p> | |||||
</nav> | |||||
<nav> | |||||
<p> | |||||
<a rel="prev" | |||||
href="/david/2024/03/08/" | |||||
title="Publication précédente : Flow">← Précédent</a> • | |||||
<a href="/david/2024/" title="Liste des publications récentes">↑ En 2024</a> | |||||
</p> | |||||
</nav> | |||||
<form action="/david/recherche/" method="get"> | |||||
<fieldset> | |||||
<legend>Recherche</legend> | |||||
<label for="input-search">Termes de votre recherche :</label> | |||||
<input id="input-search" type="search" name="s" aria-describedby="indexation-infos" required> | |||||
<input type="submit" value="Chercher"> | |||||
<p id="indexation-infos"> | |||||
<small> | |||||
Seuls les contenus de ces 8 dernières années sont indexés. | |||||
</small> | |||||
</p> | |||||
</fieldset> | |||||
</form> | |||||
<aside> | |||||
<theme-toggle></theme-toggle> | |||||
</aside> | |||||
</article> | |||||
<hr> | |||||
<footer> | |||||
<p> | |||||
<a href="/david/" title="Aller à l’accueil">Accueil</a> | |||||
• | |||||
<a href="/david/log/" title="Accès au flux RSS">Suivre</a> | |||||
• | |||||
<a href="http://larlet.com" | |||||
title="Go to my English profile" | |||||
data-instant>Pro</a> | |||||
• | |||||
<a href="mailto:david%40larlet.fr" title="Envoyer un courriel">Email</a> | |||||
• | |||||
<abbr title="Hébergeur : Alwaysdata, 62 rue Tiquetonne 75002 Paris, +33184162340">Légal</abbr> | |||||
</p> | |||||
<template id="theme-selector"> | |||||
<form> | |||||
<style type="text/css"> | |||||
fieldset div { | |||||
text-align: center; | |||||
} | |||||
</style> | |||||
<fieldset> | |||||
<legend>Thème</legend> | |||||
<div> | |||||
<label> | |||||
<input type="radio" value="auto" name="chosen-color-scheme" checked> | |||||
Auto | |||||
</label> | |||||
<label> | |||||
<input type="radio" value="dark" name="chosen-color-scheme"> | |||||
Foncé | |||||
</label> | |||||
<label> | |||||
<input type="radio" value="light" name="chosen-color-scheme"> | |||||
Clair | |||||
</label> | |||||
</div> | |||||
</fieldset> | |||||
</form> | |||||
</template> | |||||
</footer> | |||||
<script src="/static/david/js/instantpage-5.1.0.min.js" type="module"></script> | |||||
<script> | |||||
class ThemeToggle extends HTMLElement { | |||||
constructor() { | |||||
super() | |||||
const themeSelectorTemplate = document.querySelector('#theme-selector') | |||||
const form = themeSelectorTemplate.content.firstElementChild | |||||
this.attachShadow({ mode: 'open' }) | |||||
this.shadowRoot.appendChild(form.cloneNode(true)) | |||||
} | |||||
connectedCallback() { | |||||
const form = this.shadowRoot.querySelector('form') | |||||
form.addEventListener('change', (e) => { | |||||
const chosenColorScheme = e.target.value | |||||
localStorage.setItem('theme', chosenColorScheme) | |||||
toggleTheme(chosenColorScheme) | |||||
}) | |||||
const selectedTheme = localStorage.getItem('theme') | |||||
if (selectedTheme && selectedTheme !== 'undefined') { | |||||
form.querySelector(`[value="${selectedTheme}"]`).checked = true | |||||
} | |||||
} | |||||
} | |||||
const prefersColorSchemeDark = '(prefers-color-scheme: dark)' | |||||
window.addEventListener('load', () => { | |||||
let colorsLayer = undefined | |||||
let hasDarkRules = false | |||||
for (const styleSheet of Array.from(document.styleSheets)) { | |||||
let mediaRules = [] | |||||
for (const layerRule of styleSheet.cssRules) { | |||||
if (!(layerRule instanceof CSSLayerBlockRule)) { | |||||
continue | |||||
} | |||||
if (layerRule.name === 'colors') { | |||||
colorsLayer = layerRule | |||||
} | |||||
for (const cssRule of layerRule.cssRules) { | |||||
if (cssRule.type !== CSSRule.MEDIA_RULE) { | |||||
continue | |||||
} | |||||
// WARNING: Safari does not have/supports `conditionText`. | |||||
if (cssRule.conditionText) { | |||||
if (cssRule.conditionText !== prefersColorSchemeDark) { | |||||
continue | |||||
} | |||||
} else { | |||||
if (cssRule.cssText.startsWith(prefersColorSchemeDark)) { | |||||
continue | |||||
} | |||||
} | |||||
mediaRules = mediaRules.concat(Array.from(cssRule.cssRules)) | |||||
} | |||||
} | |||||
// WARNING: do not try to insert a Rule to a styleSheet you are | |||||
// currently iterating on, otherwise the browser will be stuck | |||||
// in a infinite loop… | |||||
for (const mediaRule of mediaRules) { | |||||
// Safari requires the `0` second parameter (even if default). | |||||
colorsLayer.insertRule(mediaRule.cssText, 0) | |||||
hasDarkRules = true | |||||
} | |||||
} | |||||
if (hasDarkRules) { | |||||
if ('customElements' in window && !customElements.get('theme-toggle')) { | |||||
customElements.define('theme-toggle', ThemeToggle) | |||||
} | |||||
} | |||||
}) | |||||
</script> | |||||
<script src="/static/david/js/popper-2.11.8.min.js"></script> | |||||
<script src="/static/david/js/tippy-bundle-6.3.7.umd.min.js"></script> | |||||
<script> | |||||
tippy('[data-tippy]', { | |||||
content(reference) { | |||||
reference.addEventListener('click', (e) => e.preventDefault()) | |||||
return ` | |||||
<h3 lang="fr"> | |||||
<img src="${reference.dataset.favicon}" loading="lazy"> | |||||
<a href="${reference.dataset.source}" | |||||
>Article sur ${reference.dataset.domain}</a></h3> | |||||
<p lang="${reference.hreflang}"><em>${reference.dataset.description}</em></p> | |||||
<div class="tippy-links" lang="fr"> | |||||
<a href="${reference.href}">Archive au ${reference.dataset.date}</a> | |||||
</div> | |||||
` | |||||
}, | |||||
allowHTML: true, | |||||
interactive: true, | |||||
delay: [150, 700], | |||||
hideOnClick: false | |||||
}) | |||||
</script> | |||||
</body> | |||||
</html> |
# Flow | # Flow | ||||
Le [flow](https://fr.wikipedia.org/wiki/Flow_(psychologie)) n’est pas seulement un état où j’ai besoin de calme, il s’agit d’un contexte à part entière. Il me faut une problématique connue, qui est définie avec des contours relativement flous, davantage une intention qu’une direction. Si j’ai déjà eu l’occasion d’être précédemment frustré par l’implémentation en cours, cela me donne beaucoup de motivation pour plonger. Parfois la zone est atteinte en n’étant pas devant un écran (en courant, sous la douche, etc), une forme d’*Eurêka !* qui annonce la libération du *flow* à venir. | |||||
Le [flow](<https://fr.wikipedia.org/wiki/Flow_(psychologie)>) n’est pas seulement un état où j’ai besoin de calme, il s’agit d’un contexte à part entière. Il me faut une problématique connue, qui est définie avec des contours relativement flous, davantage une intention qu’une direction. Si j’ai déjà eu l’occasion d’être précédemment frustré par l’implémentation en cours, cela me donne beaucoup de motivation pour plonger. Parfois la zone est atteinte en n’étant pas devant un écran (en courant, sous la douche, etc), une forme d’*Eurêka !* qui annonce la libération du *flow* à venir. | |||||
La crue monte et butte contre des digues techniques, plusieurs fois, avant de créer la brèche qui va tout libérer d’un coup et se répandre dans l’ensemble du code. Reste la tâche de *ressuyage* : <q lang="fr">l’évacuation des eaux qui se sont déversées dans les terres après une inondation et ainsi de diminuer le temps de submersion</q> nous dit le [Symadrem](https://www.symadrem.fr/anticiper-intervenir/evacuation-des-eaux-post-crue/quest-ce-que-le-ressuyage/). Ce n’est pas une tâche ingrate car c’est celle qui rend le code pérenne et compréhensible, l’objet du *flow* accessible au plus grand nombre. Le temps de la décrue permet d’identifier les cas aux limites également. | La crue monte et butte contre des digues techniques, plusieurs fois, avant de créer la brèche qui va tout libérer d’un coup et se répandre dans l’ensemble du code. Reste la tâche de *ressuyage* : <q lang="fr">l’évacuation des eaux qui se sont déversées dans les terres après une inondation et ainsi de diminuer le temps de submersion</q> nous dit le [Symadrem](https://www.symadrem.fr/anticiper-intervenir/evacuation-des-eaux-post-crue/quest-ce-que-le-ressuyage/). Ce n’est pas une tâche ingrate car c’est celle qui rend le code pérenne et compréhensible, l’objet du *flow* accessible au plus grand nombre. Le temps de la décrue permet d’identifier les cas aux limites également. | ||||
# Marque | |||||
> [en] ==Removing the brand from the person== is all but straightforward. I now start my about page with a quick way to introduce myself by putting forward some of my values. […] Beside saying *people* instead of *users*, stop considering who’s reading my stuff as *audience*, and quit referring to what I do as *content*, I want to modify a few more behaviours: | |||||
> | |||||
> * Quit mentioning well-known bloggers on a first-name basis. […] | |||||
> * Keep writing about different things. […] | |||||
> * Don’t quote so-called thought leaders […] | |||||
> * Stop sugar-coating concepts […] | |||||
> | |||||
> <cite>*[A Kafkaesque digital relationship with ourselves](https://minutestomidnight.co.uk/blog/kafkaesque-digital-relationship-with-ourselves/)*</cite> | |||||
Réflexion du jour sur le vocabulaire qui évolue pour se présenter sur le Web. Je suis souvent intrigué par les biographies et textes de présentation sur mastodon qui sont à la fois singuliers tout en respectant des codes (micro-)culturels. Peut-être que l’on a besoin de se sentir dans un cadre de représentation connu pour se sentir exister dans une communauté. | |||||
La même autrice, en 2002(!) : | |||||
> [en] Five years ago there was all this buzz about *virtual communities*. How did that go? I have no idea, all I know is that everything revolves around who’s the hottest blogger right now. They talk about themselves, reference each other, all anxious about who has the most comments or the longest and most prestigious blogroll. Compared to that, ==my online journal is pure mental masturbation, but at least I have the occasional good photo and such nice typography.== | |||||
> | |||||
> <cite>*[Years just pass by](https://minutestomidnight.co.uk/blog/years-just-pass-by/)*</cite> | |||||
--- | |||||
``` | |||||
body:has(time[datetime]) li { | |||||
list-style-type: "❧ "; | |||||
} | |||||
body:has( | |||||
time[datetime^="2024-01"], | |||||
time[datetime^="2024-02"], | |||||
time[datetime^="2024-03"] | |||||
) li { | |||||
list-style-type: "❆ "; | |||||
} | |||||
body:has( | |||||
time[datetime^="2024-04"], | |||||
time[datetime^="2024-05"], | |||||
time[datetime^="2024-06"] | |||||
) li { | |||||
list-style-type: "❁ "; | |||||
} | |||||
body:has( | |||||
time[datetime^="2024-07"], | |||||
time[datetime^="2024-08"], | |||||
time[datetime^="2024-09"] | |||||
) li { | |||||
list-style-type: "❂ "; | |||||
} | |||||
``` | |||||
J’avais envie d’introduire une légère saisonnalité dans mes listes à puces. Surtout une [autre excuse](/david/2024/03/07/#hr-102) pour jouer avec `:has()`. Je lis un peu trop de blogs qui manquent de fantaisie. Et puis il pleut… | |||||
--- | |||||
Chant du cardinal | |||||
Le matin s’éveille sans toi | |||||
Lovée dans mes bras | |||||
#évolution #identité #poésie |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | ||||
</p> | </p> | ||||
</nav> | </nav> | ||||
<h2> | |||||
<a href="/david/2024/03/09/" title="Lien permanent vers cet article">Marque</a> <time datetime="2024-03-09">9 mars 2024</time> | |||||
</h2> | |||||
<blockquote lang="en"> | |||||
<p><mark>Removing the brand from the person</mark> is all but straightforward. I now start my about page with a quick way to introduce myself by putting forward some of my values. […] Beside saying <em>people</em> instead of <em>users</em>, stop considering who’s reading my stuff as <em>audience</em>, and quit referring to what I do as <em>content</em>, I want to modify a few more behaviours:</p> | |||||
<ul> | |||||
<li>Quit mentioning well-known bloggers on a first-name basis. […]</li> | |||||
<li>Keep writing about different things. […]</li> | |||||
<li>Don’t quote so-called thought leaders […]</li> | |||||
<li>Stop sugar-coating concepts […]</li> | |||||
</ul> | |||||
<p><cite><em><a data-link-domain="minutestomidnight.co.uk" href="https://minutestomidnight.co.uk/blog/kafkaesque-digital-relationship-with-ourselves/" hreflang="en" | |||||
title="Consultation de l’article (anglais)">A Kafkaesque digital relationship with ourselves</a> | |||||
<a href="/david/cache/2024/34590090e8c8ea82be14fcc3dd7b734c/" hreflang="en" | |||||
data-tippy data-description="Words are crucial to build a sense of online community, however many of us have been using them straight out of a soulless corporate lingo in order to sell ourselves as a product." | |||||
data-source="https://minutestomidnight.co.uk/blog/kafkaesque-digital-relationship-with-ourselves/" | |||||
data-date="2024-03-09" | |||||
data-favicon="https://minutestomidnight.co.uk/assets/images/favicons/favicon.svg" | |||||
data-domain="minutestomidnight.co.uk" | |||||
><svg xmlns="http://www.w3.org/2000/svg" | |||||
width="24" height="24" viewBox="0 0 24 24" fill="none" | |||||
stroke="currentColor" stroke-width="2" stroke-linecap="square" | |||||
stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle> | |||||
<path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path> | |||||
<line x1="12" y1="17" x2="12.01" y2="17"></line> | |||||
</svg> | |||||
<span class="sr-only">[archive]</span></a></em></cite></p> | |||||
</blockquote> | |||||
<p>Réflexion du jour sur le vocabulaire qui évolue pour se présenter sur le Web. Je suis souvent intrigué par les biographies et textes de présentation sur mastodon qui sont à la fois singuliers tout en respectant des codes (micro-)culturels. Peut-être que l’on a besoin de se sentir dans un cadre de représentation connu pour se sentir exister dans une communauté.</p> | |||||
<p>La même autrice, en 2002(!) :</p> | |||||
<blockquote lang="en"> | |||||
<p>Five years ago there was all this buzz about <em>virtual communities</em>. How did that go? I have no idea, all I know is that everything revolves around who’s the hottest blogger right now. They talk about themselves, reference each other, all anxious about who has the most comments or the longest and most prestigious blogroll. Compared to that, <mark>my online journal is pure mental masturbation, but at least I have the occasional good photo and such nice typography.</mark></p> | |||||
<p><cite><em><a data-link-domain="minutestomidnight.co.uk" href="https://minutestomidnight.co.uk/blog/years-just-pass-by/" hreflang="en" | |||||
title="Consultation de l’article (anglais)">Years just pass by</a> | |||||
<a href="/david/cache/2024/4f003de8f8531a4aaf121ecf6c21ae66/" hreflang="en" | |||||
data-tippy data-description="The desire to be part of a community of bloggers hits the harsh reality of how humans want thought leaders who appear to be successful." | |||||
data-source="https://minutestomidnight.co.uk/blog/years-just-pass-by/" | |||||
data-date="2024-03-09" | |||||
data-favicon="https://minutestomidnight.co.uk/assets/images/favicons/favicon.svg" | |||||
data-domain="minutestomidnight.co.uk" | |||||
><svg xmlns="http://www.w3.org/2000/svg" | |||||
width="24" height="24" viewBox="0 0 24 24" fill="none" | |||||
stroke="currentColor" stroke-width="2" stroke-linecap="square" | |||||
stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle> | |||||
<path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path> | |||||
<line x1="12" y1="17" x2="12.01" y2="17"></line> | |||||
</svg> | |||||
<span class="sr-only">[archive]</span></a></em></cite></p> | |||||
</blockquote> | |||||
<a href="#hr-106" title="Lien vers cette section de la page"><hr id="hr-106" /></a> | |||||
<pre><code>body:has(time[datetime]) li { | |||||
list-style-type: "❧ "; | |||||
} | |||||
body:has( | |||||
time[datetime^="2024-01"], | |||||
time[datetime^="2024-02"], | |||||
time[datetime^="2024-03"] | |||||
) li { | |||||
list-style-type: "❆ "; | |||||
} | |||||
body:has( | |||||
time[datetime^="2024-04"], | |||||
time[datetime^="2024-05"], | |||||
time[datetime^="2024-06"] | |||||
) li { | |||||
list-style-type: "❁ "; | |||||
} | |||||
body:has( | |||||
time[datetime^="2024-07"], | |||||
time[datetime^="2024-08"], | |||||
time[datetime^="2024-09"] | |||||
) li { | |||||
list-style-type: "❂ "; | |||||
} | |||||
</code></pre> | |||||
<p>J’avais envie d’introduire une légère saisonnalité dans mes listes à puces. Surtout une <a href="/david/2024/03/07/#hr-102">autre excuse</a> pour jouer avec <code>:has()</code>. Je lis un peu trop de blogs qui manquent de fantaisie. Et puis il pleut…</p> | |||||
<a href="#hr-107" title="Lien vers cette section de la page"><hr id="hr-107" /></a> | |||||
<p>Chant du cardinal<br /> | |||||
Le matin s’éveille sans toi<br /> | |||||
Lovée dans mes bras</p> | |||||
<nav> | |||||
<p> | |||||
<a href="/david/2024/evolution/" | |||||
title="Liste de tous les articles 2024 associés à cette étiquette" | |||||
rel="tag">#évolution</a> | |||||
<a href="/david/2024/identite/" | |||||
title="Liste de tous les articles 2024 associés à cette étiquette" | |||||
rel="tag">#identité</a> | |||||
<a href="/david/2024/poesie/" | |||||
title="Liste de tous les articles 2024 associés à cette étiquette" | |||||
rel="tag">#poésie</a> | |||||
<a href="/david/2024/#tags" title="Liste de toutes les étiquettes 2024">tous ?</a> | |||||
</p> | |||||
</nav> | |||||
<h2> | <h2> | ||||
<a href="/david/2024/03/01/" title="Lien permanent vers cet article">Simple</a> <time datetime="2024-03-01">1 mars 2024</time> | <a href="/david/2024/03/01/" title="Lien permanent vers cet article">Simple</a> <time datetime="2024-03-01">1 mars 2024</time> | ||||
</h2> | </h2> |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | ||||
<a href="/david/2024/03/08/" title="Lien permanent vers cet article">Flow</a> <time datetime="2024-03-08">8 mars 2024</time> | <a href="/david/2024/03/08/" title="Lien permanent vers cet article">Flow</a> <time datetime="2024-03-08">8 mars 2024</time> | ||||
</h2> | </h2> | ||||
<p>Le <a data-link-domain="fr.wikipedia.org" href="https://fr.wikipedia.org/wiki/Flow_(psychologie">flow</a>) n’est pas seulement un état où j’ai besoin de calme, il s’agit d’un contexte à part entière. Il me faut une problématique connue, qui est définie avec des contours relativement flous, davantage une intention qu’une direction. Si j’ai déjà eu l’occasion d’être précédemment frustré par l’implémentation en cours, cela me donne beaucoup de motivation pour plonger. Parfois la zone est atteinte en n’étant pas devant un écran (en courant, sous la douche, etc), une forme d’<em>Eurêka !</em> qui annonce la libération du <em>flow</em> à venir.</p> | |||||
<p>Le <a data-link-domain="fr.wikipedia.org" href="https://fr.wikipedia.org/wiki/Flow_(psychologie)">flow</a> n’est pas seulement un état où j’ai besoin de calme, il s’agit d’un contexte à part entière. Il me faut une problématique connue, qui est définie avec des contours relativement flous, davantage une intention qu’une direction. Si j’ai déjà eu l’occasion d’être précédemment frustré par l’implémentation en cours, cela me donne beaucoup de motivation pour plonger. Parfois la zone est atteinte en n’étant pas devant un écran (en courant, sous la douche, etc), une forme d’<em>Eurêka !</em> qui annonce la libération du <em>flow</em> à venir.</p> | |||||
<p>La crue monte et butte contre des digues techniques, plusieurs fois, avant de créer la brèche qui va tout libérer d’un coup et se répandre dans l’ensemble du code. Reste la tâche de <em>ressuyage</em> : <q lang="fr">l’évacuation des eaux qui se sont déversées dans les terres après une inondation et ainsi de diminuer le temps de submersion</q> nous dit le <a data-link-domain="symadrem.fr" href="https://www.symadrem.fr/anticiper-intervenir/evacuation-des-eaux-post-crue/quest-ce-que-le-ressuyage/">Symadrem</a>. Ce n’est pas une tâche ingrate car c’est celle qui rend le code pérenne et compréhensible, l’objet du <em>flow</em> accessible au plus grand nombre. Le temps de la décrue permet d’identifier les cas aux limites également.</p> | <p>La crue monte et butte contre des digues techniques, plusieurs fois, avant de créer la brèche qui va tout libérer d’un coup et se répandre dans l’ensemble du code. Reste la tâche de <em>ressuyage</em> : <q lang="fr">l’évacuation des eaux qui se sont déversées dans les terres après une inondation et ainsi de diminuer le temps de submersion</q> nous dit le <a data-link-domain="symadrem.fr" href="https://www.symadrem.fr/anticiper-intervenir/evacuation-des-eaux-post-crue/quest-ce-que-le-ressuyage/">Symadrem</a>. Ce n’est pas une tâche ingrate car c’est celle qui rend le code pérenne et compréhensible, l’objet du <em>flow</em> accessible au plus grand nombre. Le temps de la décrue permet d’identifier les cas aux limites également.</p> | ||||
<p>Ce contexte ne m’est atteignable que 3 ou 4 fois par an en moyenne. Et heureusement, car il est vraiment peu soutenable (mais tellement satisfaisant !).</p> | <p>Ce contexte ne m’est atteignable que 3 ou 4 fois par an en moyenne. Et heureusement, car il est vraiment peu soutenable (mais tellement satisfaisant !).</p> | ||||
<a href="#hr-104" title="Lien vers cette section de la page"><hr id="hr-104" /></a> | <a href="#hr-104" title="Lien vers cette section de la page"><hr id="hr-104" /></a> |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
<!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` element | |||||
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,initial-scale=1"> | |||||
<!-- Required to make a valid HTML5 document. --> | |||||
<title> | |||||
Étiquette #identité | |||||
— David Larlet</title> | |||||
<script> | |||||
function toggleTheme(themeName) { | |||||
document.documentElement.classList.toggle( | |||||
'forced-dark', | |||||
themeName === 'dark' | |||||
) | |||||
document.documentElement.classList.toggle( | |||||
'forced-light', | |||||
themeName === 'light' | |||||
) | |||||
} | |||||
const selectedTheme = localStorage.getItem('theme') | |||||
if (selectedTheme !== 'undefined') { | |||||
toggleTheme(selectedTheme) | |||||
} | |||||
</script> | |||||
<!-- Documented, feel free to shoot an email. --> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | |||||
<link rel="preload" | |||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | |||||
as="font" | |||||
type="font/woff2" | |||||
media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" | |||||
crossorigin> | |||||
<link rel="preload" | |||||
href="/static/david/css/fonts/century_supra_ot_a_bold.woff2" | |||||
as="font" | |||||
type="font/woff2" | |||||
media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" | |||||
crossorigin> | |||||
<link rel="preload" | |||||
href="/static/david/css/fonts/century_supra_ot_a_italic.woff2" | |||||
as="font" | |||||
type="font/woff2" | |||||
media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" | |||||
crossorigin> | |||||
<link rel="preload" | |||||
href="/static/david/css/fonts/century_supra_ot_b_regular.woff2" | |||||
as="font" | |||||
type="font/woff2" | |||||
media="(prefers-color-scheme: dark)" | |||||
crossorigin> | |||||
<link rel="preload" | |||||
href="/static/david/css/fonts/century_supra_ot_b_bold.woff2" | |||||
as="font" | |||||
type="font/woff2" | |||||
media="(prefers-color-scheme: dark)" | |||||
crossorigin> | |||||
<link rel="preload" | |||||
href="/static/david/css/fonts/century_supra_ot_b_italic.woff2" | |||||
as="font" | |||||
type="font/woff2" | |||||
media="(prefers-color-scheme: dark)" | |||||
crossorigin> | |||||
<meta name="description" content="Publications relatives au tag #identité"> | |||||
<!-- That good ol' feed, subscribe :). --> | |||||
<link rel="alternate" | |||||
type="application/atom+xml" | |||||
title="Feed" | |||||
href="/david/log/"> | |||||
<!-- Generated from https://realfavicongenerator.net/ such a mess. --> | |||||
<link rel="apple-touch-icon" | |||||
sizes="180x180" | |||||
href="/static/david/icons2/apple-touch-icon.png"> | |||||
<link rel="icon" | |||||
type="image/png" | |||||
sizes="32x32" | |||||
href="/static/david/icons2/favicon-32x32.png"> | |||||
<link rel="icon" | |||||
type="image/png" | |||||
sizes="16x16" | |||||
href="/static/david/icons2/favicon-16x16.png"> | |||||
<link rel="manifest" href="/static/david/icons2/site.webmanifest"> | |||||
<link rel="mask-icon" | |||||
href="/static/david/icons2/safari-pinned-tab.svg" | |||||
color="#07486c"> | |||||
<link rel="shortcut icon" href="/static/david/icons2/favicon.ico"> | |||||
<meta name="msapplication-TileColor" content="#f7f7f7"> | |||||
<meta name="msapplication-config" | |||||
content="/static/david/icons2/browserconfig.xml"> | |||||
<meta name="theme-color" | |||||
content="#f7f7f7" | |||||
media="(prefers-color-scheme: light)"> | |||||
<meta name="theme-color" | |||||
content="#272727" | |||||
media="(prefers-color-scheme: dark)"> | |||||
<!-- Is that even respected? Retrospectively? What a shAItshow… | |||||
https://neil-clarke.com/block-the-bots-that-feed-ai-models-by-scraping-your-website/ --> | |||||
<meta name="robots" content="noai, noimageai"> | |||||
<style type="text/css"> | |||||
details[open] summary { | |||||
display: none; | |||||
} | |||||
</style> | |||||
<body data-instant-intensity="viewport-all"> | |||||
<article> | |||||
<header> | |||||
<hgroup> | |||||
<h1>#identité</h1> | |||||
<p>Publications relatives à cette étiquette</p> | |||||
</hgroup> | |||||
</header> | |||||
<nav> | |||||
<p> | |||||
<a href="/david/" title="Aller à l’accueil"> | |||||
Accueil</a> | |||||
• | |||||
<a rel="tags" | |||||
href="/david/2024/#tags" | |||||
title="Liste de toutes les étiquettes"> | |||||
Étiquettes</a> | |||||
• | |||||
<a href="/david/recherche/" title="Aller à la page de recherche" rel="search" data-no-instant>Recherche</a> | |||||
• | |||||
<a href="/david/log/" title="Accès au flux RSS">Suivre</a> | |||||
</p> | |||||
</nav> | |||||
<h2> | |||||
<a href="/david/2024/03/09/" title="Lien permanent vers cet article">Marque</a> <time datetime="2024-03-09">9 mars 2024</time> | |||||
</h2> | |||||
<blockquote lang="en"> | |||||
<p><mark>Removing the brand from the person</mark> is all but straightforward. I now start my about page with a quick way to introduce myself by putting forward some of my values. […] Beside saying <em>people</em> instead of <em>users</em>, stop considering who’s reading my stuff as <em>audience</em>, and quit referring to what I do as <em>content</em>, I want to modify a few more behaviours:</p> | |||||
<ul> | |||||
<li>Quit mentioning well-known bloggers on a first-name basis. […]</li> | |||||
<li>Keep writing about different things. […]</li> | |||||
<li>Don’t quote so-called thought leaders […]</li> | |||||
<li>Stop sugar-coating concepts […]</li> | |||||
</ul> | |||||
<p><cite><em><a data-link-domain="minutestomidnight.co.uk" href="https://minutestomidnight.co.uk/blog/kafkaesque-digital-relationship-with-ourselves/" hreflang="en" | |||||
title="Consultation de l’article (anglais)">A Kafkaesque digital relationship with ourselves</a> | |||||
<a href="/david/cache/2024/34590090e8c8ea82be14fcc3dd7b734c/" hreflang="en" | |||||
data-tippy data-description="Words are crucial to build a sense of online community, however many of us have been using them straight out of a soulless corporate lingo in order to sell ourselves as a product." | |||||
data-source="https://minutestomidnight.co.uk/blog/kafkaesque-digital-relationship-with-ourselves/" | |||||
data-date="2024-03-09" | |||||
data-favicon="https://minutestomidnight.co.uk/assets/images/favicons/favicon.svg" | |||||
data-domain="minutestomidnight.co.uk" | |||||
><svg xmlns="http://www.w3.org/2000/svg" | |||||
width="24" height="24" viewBox="0 0 24 24" fill="none" | |||||
stroke="currentColor" stroke-width="2" stroke-linecap="square" | |||||
stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle> | |||||
<path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path> | |||||
<line x1="12" y1="17" x2="12.01" y2="17"></line> | |||||
</svg> | |||||
<span class="sr-only">[archive]</span></a></em></cite></p> | |||||
</blockquote> | |||||
<p>Réflexion du jour sur le vocabulaire qui évolue pour se présenter sur le Web. Je suis souvent intrigué par les biographies et textes de présentation sur mastodon qui sont à la fois singuliers tout en respectant des codes (micro-)culturels. Peut-être que l’on a besoin de se sentir dans un cadre de représentation connu pour se sentir exister dans une communauté.</p> | |||||
<p>La même autrice, en 2002(!) :</p> | |||||
<blockquote lang="en"> | |||||
<p>Five years ago there was all this buzz about <em>virtual communities</em>. How did that go? I have no idea, all I know is that everything revolves around who’s the hottest blogger right now. They talk about themselves, reference each other, all anxious about who has the most comments or the longest and most prestigious blogroll. Compared to that, <mark>my online journal is pure mental masturbation, but at least I have the occasional good photo and such nice typography.</mark></p> | |||||
<p><cite><em><a data-link-domain="minutestomidnight.co.uk" href="https://minutestomidnight.co.uk/blog/years-just-pass-by/" hreflang="en" | |||||
title="Consultation de l’article (anglais)">Years just pass by</a> | |||||
<a href="/david/cache/2024/4f003de8f8531a4aaf121ecf6c21ae66/" hreflang="en" | |||||
data-tippy data-description="The desire to be part of a community of bloggers hits the harsh reality of how humans want thought leaders who appear to be successful." | |||||
data-source="https://minutestomidnight.co.uk/blog/years-just-pass-by/" | |||||
data-date="2024-03-09" | |||||
data-favicon="https://minutestomidnight.co.uk/assets/images/favicons/favicon.svg" | |||||
data-domain="minutestomidnight.co.uk" | |||||
><svg xmlns="http://www.w3.org/2000/svg" | |||||
width="24" height="24" viewBox="0 0 24 24" fill="none" | |||||
stroke="currentColor" stroke-width="2" stroke-linecap="square" | |||||
stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle> | |||||
<path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path> | |||||
<line x1="12" y1="17" x2="12.01" y2="17"></line> | |||||
</svg> | |||||
<span class="sr-only">[archive]</span></a></em></cite></p> | |||||
</blockquote> | |||||
<a href="#hr-106" title="Lien vers cette section de la page"><hr id="hr-106" /></a> | |||||
<pre><code>body:has(time[datetime]) li { | |||||
list-style-type: "❧ "; | |||||
} | |||||
body:has( | |||||
time[datetime^="2024-01"], | |||||
time[datetime^="2024-02"], | |||||
time[datetime^="2024-03"] | |||||
) li { | |||||
list-style-type: "❆ "; | |||||
} | |||||
body:has( | |||||
time[datetime^="2024-04"], | |||||
time[datetime^="2024-05"], | |||||
time[datetime^="2024-06"] | |||||
) li { | |||||
list-style-type: "❁ "; | |||||
} | |||||
body:has( | |||||
time[datetime^="2024-07"], | |||||
time[datetime^="2024-08"], | |||||
time[datetime^="2024-09"] | |||||
) li { | |||||
list-style-type: "❂ "; | |||||
} | |||||
</code></pre> | |||||
<p>J’avais envie d’introduire une légère saisonnalité dans mes listes à puces. Surtout une <a href="/david/2024/03/07/#hr-102">autre excuse</a> pour jouer avec <code>:has()</code>. Je lis un peu trop de blogs qui manquent de fantaisie. Et puis il pleut…</p> | |||||
<a href="#hr-107" title="Lien vers cette section de la page"><hr id="hr-107" /></a> | |||||
<p>Chant du cardinal<br /> | |||||
Le matin s’éveille sans toi<br /> | |||||
Lovée dans mes bras</p> | |||||
<nav> | |||||
<p> | |||||
<a href="/david/2024/evolution/" | |||||
title="Liste de tous les articles 2024 associés à cette étiquette" | |||||
rel="tag">#évolution</a> | |||||
<a href="/david/2024/identite/" | |||||
title="Liste de tous les articles 2024 associés à cette étiquette" | |||||
rel="tag">#identité</a> | |||||
<a href="/david/2024/poesie/" | |||||
title="Liste de tous les articles 2024 associés à cette étiquette" | |||||
rel="tag">#poésie</a> | |||||
<a href="/david/2024/#tags" title="Liste de toutes les étiquettes 2024">tous ?</a> | |||||
</p> | |||||
</nav> | |||||
<form action="/david/recherche/" method="get"> | |||||
<fieldset> | |||||
<legend>Recherche</legend> | |||||
<label for="input-search">Termes de votre recherche :</label> | |||||
<input id="input-search" type="search" name="s" aria-describedby="indexation-infos" required> | |||||
<input type="submit" value="Chercher"> | |||||
<p id="indexation-infos"> | |||||
<small> | |||||
Seuls les contenus de ces 8 dernières années sont indexés. | |||||
</small> | |||||
</p> | |||||
</fieldset> | |||||
</form> | |||||
<aside> | |||||
<theme-toggle></theme-toggle> | |||||
</aside> | |||||
</article> | |||||
<hr> | |||||
<footer> | |||||
<p> | |||||
<a href="/david/" title="Aller à l’accueil">Accueil</a> | |||||
• | |||||
<a href="/david/log/" title="Accès au flux RSS">Suivre</a> | |||||
• | |||||
<a href="http://larlet.com" | |||||
title="Go to my English profile" | |||||
data-instant>Pro</a> | |||||
• | |||||
<a href="mailto:david%40larlet.fr" title="Envoyer un courriel">Email</a> | |||||
• | |||||
<abbr title="Hébergeur : Alwaysdata, 62 rue Tiquetonne 75002 Paris, +33184162340">Légal</abbr> | |||||
</p> | |||||
<template id="theme-selector"> | |||||
<form> | |||||
<style type="text/css"> | |||||
fieldset div { | |||||
text-align: center; | |||||
} | |||||
</style> | |||||
<fieldset> | |||||
<legend>Thème</legend> | |||||
<div> | |||||
<label> | |||||
<input type="radio" value="auto" name="chosen-color-scheme" checked> | |||||
Auto | |||||
</label> | |||||
<label> | |||||
<input type="radio" value="dark" name="chosen-color-scheme"> | |||||
Foncé | |||||
</label> | |||||
<label> | |||||
<input type="radio" value="light" name="chosen-color-scheme"> | |||||
Clair | |||||
</label> | |||||
</div> | |||||
</fieldset> | |||||
</form> | |||||
</template> | |||||
</footer> | |||||
<script src="/static/david/js/instantpage-5.1.0.min.js" type="module"></script> | |||||
<script> | |||||
class ThemeToggle extends HTMLElement { | |||||
constructor() { | |||||
super() | |||||
const themeSelectorTemplate = document.querySelector('#theme-selector') | |||||
const form = themeSelectorTemplate.content.firstElementChild | |||||
this.attachShadow({ mode: 'open' }) | |||||
this.shadowRoot.appendChild(form.cloneNode(true)) | |||||
} | |||||
connectedCallback() { | |||||
const form = this.shadowRoot.querySelector('form') | |||||
form.addEventListener('change', (e) => { | |||||
const chosenColorScheme = e.target.value | |||||
localStorage.setItem('theme', chosenColorScheme) | |||||
toggleTheme(chosenColorScheme) | |||||
}) | |||||
const selectedTheme = localStorage.getItem('theme') | |||||
if (selectedTheme && selectedTheme !== 'undefined') { | |||||
form.querySelector(`[value="${selectedTheme}"]`).checked = true | |||||
} | |||||
} | |||||
} | |||||
const prefersColorSchemeDark = '(prefers-color-scheme: dark)' | |||||
window.addEventListener('load', () => { | |||||
let colorsLayer = undefined | |||||
let hasDarkRules = false | |||||
for (const styleSheet of Array.from(document.styleSheets)) { | |||||
let mediaRules = [] | |||||
for (const layerRule of styleSheet.cssRules) { | |||||
if (!(layerRule instanceof CSSLayerBlockRule)) { | |||||
continue | |||||
} | |||||
if (layerRule.name === 'colors') { | |||||
colorsLayer = layerRule | |||||
} | |||||
for (const cssRule of layerRule.cssRules) { | |||||
if (cssRule.type !== CSSRule.MEDIA_RULE) { | |||||
continue | |||||
} | |||||
// WARNING: Safari does not have/supports `conditionText`. | |||||
if (cssRule.conditionText) { | |||||
if (cssRule.conditionText !== prefersColorSchemeDark) { | |||||
continue | |||||
} | |||||
} else { | |||||
if (cssRule.cssText.startsWith(prefersColorSchemeDark)) { | |||||
continue | |||||
} | |||||
} | |||||
mediaRules = mediaRules.concat(Array.from(cssRule.cssRules)) | |||||
} | |||||
} | |||||
// WARNING: do not try to insert a Rule to a styleSheet you are | |||||
// currently iterating on, otherwise the browser will be stuck | |||||
// in a infinite loop… | |||||
for (const mediaRule of mediaRules) { | |||||
// Safari requires the `0` second parameter (even if default). | |||||
colorsLayer.insertRule(mediaRule.cssText, 0) | |||||
hasDarkRules = true | |||||
} | |||||
} | |||||
if (hasDarkRules) { | |||||
if ('customElements' in window && !customElements.get('theme-toggle')) { | |||||
customElements.define('theme-toggle', ThemeToggle) | |||||
} | |||||
} | |||||
}) | |||||
</script> | |||||
</body> | |||||
</html> |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | ||||
<a href="/david/2024/03/05/">Jour 2</a>, | <a href="/david/2024/03/05/">Jour 2</a>, | ||||
<a href="/david/2024/03/06/">Vannerie</a>, | <a href="/david/2024/03/06/">Vannerie</a>, | ||||
<a href="/david/2024/03/07/">Sondages</a>, | <a href="/david/2024/03/07/">Sondages</a>, | ||||
<a href="/david/2024/03/08/">Flow</a>. | |||||
<a href="/david/2024/03/08/">Flow</a>, | |||||
<a href="/david/2024/03/09/">Marque</a>. | |||||
</p> | </p> | ||||
<a href="/david/2024/echanges/" rel="tag">#échanges (5)</a>, | <a href="/david/2024/echanges/" rel="tag">#échanges (5)</a>, | ||||
<a href="/david/2024/ecriture/" rel="tag">#écriture (7)</a>, | <a href="/david/2024/ecriture/" rel="tag">#écriture (7)</a>, | ||||
<a href="/david/2024/equipe/" rel="tag">#équipe (7)</a>, | <a href="/david/2024/equipe/" rel="tag">#équipe (7)</a>, | ||||
<a href="/david/2024/evolution/" rel="tag">#évolution (7)</a>, | |||||
<a href="/david/2024/evolution/" rel="tag">#évolution (8)</a>, | |||||
<a href="/david/2024/experience/" rel="tag">#expérience (12)</a>, | <a href="/david/2024/experience/" rel="tag">#expérience (12)</a>, | ||||
<a href="/david/2024/fediverse/" rel="tag">#fédiverse (1)</a>, | <a href="/david/2024/fediverse/" rel="tag">#fédiverse (1)</a>, | ||||
<a href="/david/2024/foret/" rel="tag">#forêt (7)</a>, | <a href="/david/2024/foret/" rel="tag">#forêt (7)</a>, | ||||
<a href="/david/2024/gratitude/" rel="tag">#gratitude (3)</a>, | <a href="/david/2024/gratitude/" rel="tag">#gratitude (3)</a>, | ||||
<a href="/david/2024/ia/" rel="tag">#IA (3)</a>, | <a href="/david/2024/ia/" rel="tag">#IA (3)</a>, | ||||
<a href="/david/2024/identite/" rel="tag">#identité (1)</a>, | |||||
<a href="/david/2024/laboratoire/" rel="tag">#laboratoire (3)</a>, | <a href="/david/2024/laboratoire/" rel="tag">#laboratoire (3)</a>, | ||||
<a href="/david/2024/lecture/" rel="tag">#lecture (2)</a>, | <a href="/david/2024/lecture/" rel="tag">#lecture (2)</a>, | ||||
<a href="/david/2024/opendata/" rel="tag">#opendata (1)</a>, | <a href="/david/2024/opendata/" rel="tag">#opendata (1)</a>, | ||||
<a href="/david/2024/partage/" rel="tag">#partage (4)</a>, | <a href="/david/2024/partage/" rel="tag">#partage (4)</a>, | ||||
<a href="/david/2024/parvenir/" rel="tag">#parvenir (3)</a>, | <a href="/david/2024/parvenir/" rel="tag">#parvenir (3)</a>, | ||||
<a href="/david/2024/photographie/" rel="tag">#photographie (2)</a>, | <a href="/david/2024/photographie/" rel="tag">#photographie (2)</a>, | ||||
<a href="/david/2024/poesie/" rel="tag">#poésie (1)</a>, | |||||
<a href="/david/2024/poesie/" rel="tag">#poésie (2)</a>, | |||||
<a href="/david/2024/processus/" rel="tag">#processus (10)</a>, | <a href="/david/2024/processus/" rel="tag">#processus (10)</a>, | ||||
<a href="/david/2024/propriete/" rel="tag">#propriété (1)</a>, | <a href="/david/2024/propriete/" rel="tag">#propriété (1)</a>, | ||||
<a href="/david/2024/protopie/" rel="tag">#protopie (7)</a>, | <a href="/david/2024/protopie/" rel="tag">#protopie (7)</a>, |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |
} | } | ||||
</script> | </script> | ||||
<!-- Documented, feel free to shoot an email. --> | <!-- Documented, feel free to shoot an email. --> | ||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-07.css"> | |||||
<link rel="stylesheet" href="/static/david/css/style_2024-03-09.css"> | |||||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | <!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | ||||
<link rel="preload" | <link rel="preload" | ||||
href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" | href="/static/david/css/fonts/century_supra_ot_a_regular.woff2" |