“Flash Of Default Theme” See https://mxb.dev/blog/color-theme-switcher/ I had to move the theme definition to the html element (vs. body) with the side-effect to have a consistent scrollbar color.master
@@ -23,7 +23,7 @@ | |||
<meta name="msapplication-config" content="/static/david/icons2/browserconfig.xml"> | |||
<meta name="theme-color" content="#f0f0ea"> | |||
<!-- Documented, feel free to shoot an email. --> | |||
<link rel="stylesheet" href="/static/david/css/style_2020-04-25.css"> | |||
<link rel="stylesheet" href="/static/david/css/style_2020-06-19.css"> | |||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin> | |||
@@ -31,6 +31,22 @@ | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_italic.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<script type="text/javascript"> | |||
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> | |||
<body class="remarkdown h1-underline h2-underline h3-underline hr-center ul-star pre-tick"> | |||
@@ -110,28 +126,6 @@ | |||
</footer> | |||
<script src="/static/david/js/instantpage-3.0.0.min.js" type="module" defer></script> | |||
<script type="text/javascript"> | |||
/* This is a work in progress with Anthony https://ricaud.me */ | |||
// TODISCUSS: | |||
// 1. give a way for the user to close that chooser? | |||
// 2. store preferences? Done using localStorage | |||
// 3. create the template from scratch in JS? | |||
// 4. how to make it generic? (no need for forced-dark/light existing rules) | |||
// Results from a Poll: https://mastodon.social/@dav/104093540923157521 | |||
// Avoir un moyen de changer de thème d'un site à la main : | |||
// 49% => Utile | |||
// 23% => Pas utile | |||
// 9% => So 2000 | |||
// 19% => Je veux le même | |||
// After 24 hours and 43 votes | |||
// A bit hard to interpret, I guess people wanting it found it useful too! | |||
function toggleTheme(themeName) { | |||
document.body.classList.toggle('forced-dark', themeName === 'dark') | |||
document.body.classList.toggle('forced-light', themeName === 'light') | |||
} | |||
function loadThemeForm(templateName) { | |||
const themeSelectorTemplate = document.querySelector(templateName) | |||
const form = themeSelectorTemplate.content.firstElementChild |
@@ -23,7 +23,7 @@ | |||
<meta name="msapplication-config" content="/static/david/icons2/browserconfig.xml"> | |||
<meta name="theme-color" content="#f0f0ea"> | |||
<!-- Documented, feel free to shoot an email. --> | |||
<link rel="stylesheet" href="/static/david/css/style_2020-04-25.css"> | |||
<link rel="stylesheet" href="/static/david/css/style_2020-06-19.css"> | |||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin> | |||
@@ -31,6 +31,22 @@ | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_italic.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<script type="text/javascript"> | |||
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> | |||
<body class="remarkdown h1-underline h2-underline h3-underline hr-center ul-star pre-tick"> | |||
@@ -128,28 +144,6 @@ | |||
</footer> | |||
<script src="/static/david/js/instantpage-3.0.0.min.js" type="module" defer></script> | |||
<script type="text/javascript"> | |||
/* This is a work in progress with Anthony https://ricaud.me */ | |||
// TODISCUSS: | |||
// 1. give a way for the user to close that chooser? | |||
// 2. store preferences? Done using localStorage | |||
// 3. create the template from scratch in JS? | |||
// 4. how to make it generic? (no need for forced-dark/light existing rules) | |||
// Results from a Poll: https://mastodon.social/@dav/104093540923157521 | |||
// Avoir un moyen de changer de thème d'un site à la main : | |||
// 49% => Utile | |||
// 23% => Pas utile | |||
// 9% => So 2000 | |||
// 19% => Je veux le même | |||
// After 24 hours and 43 votes | |||
// A bit hard to interpret, I guess people wanting it found it useful too! | |||
function toggleTheme(themeName) { | |||
document.body.classList.toggle('forced-dark', themeName === 'dark') | |||
document.body.classList.toggle('forced-light', themeName === 'light') | |||
} | |||
function loadThemeForm(templateName) { | |||
const themeSelectorTemplate = document.querySelector(templateName) | |||
const form = themeSelectorTemplate.content.firstElementChild |
@@ -23,7 +23,7 @@ | |||
<meta name="msapplication-config" content="/static/david/icons2/browserconfig.xml"> | |||
<meta name="theme-color" content="#f0f0ea"> | |||
<!-- Documented, feel free to shoot an email. --> | |||
<link rel="stylesheet" href="/static/david/css/style_2020-04-25.css"> | |||
<link rel="stylesheet" href="/static/david/css/style_2020-06-19.css"> | |||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin> | |||
@@ -31,6 +31,22 @@ | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_italic.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<script type="text/javascript"> | |||
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> | |||
<body class="remarkdown h1-underline h2-underline h3-underline hr-center ul-star pre-tick"> | |||
@@ -126,28 +142,6 @@ | |||
</footer> | |||
<script src="/static/david/js/instantpage-3.0.0.min.js" type="module" defer></script> | |||
<script type="text/javascript"> | |||
/* This is a work in progress with Anthony https://ricaud.me */ | |||
// TODISCUSS: | |||
// 1. give a way for the user to close that chooser? | |||
// 2. store preferences? Done using localStorage | |||
// 3. create the template from scratch in JS? | |||
// 4. how to make it generic? (no need for forced-dark/light existing rules) | |||
// Results from a Poll: https://mastodon.social/@dav/104093540923157521 | |||
// Avoir un moyen de changer de thème d'un site à la main : | |||
// 49% => Utile | |||
// 23% => Pas utile | |||
// 9% => So 2000 | |||
// 19% => Je veux le même | |||
// After 24 hours and 43 votes | |||
// A bit hard to interpret, I guess people wanting it found it useful too! | |||
function toggleTheme(themeName) { | |||
document.body.classList.toggle('forced-dark', themeName === 'dark') | |||
document.body.classList.toggle('forced-light', themeName === 'light') | |||
} | |||
function loadThemeForm(templateName) { | |||
const themeSelectorTemplate = document.querySelector(templateName) | |||
const form = themeSelectorTemplate.content.firstElementChild |
@@ -23,7 +23,7 @@ | |||
<meta name="msapplication-config" content="/static/david/icons2/browserconfig.xml"> | |||
<meta name="theme-color" content="#f0f0ea"> | |||
<!-- Documented, feel free to shoot an email. --> | |||
<link rel="stylesheet" href="/static/david/css/style_2020-04-25.css"> | |||
<link rel="stylesheet" href="/static/david/css/style_2020-06-19.css"> | |||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin> | |||
@@ -31,6 +31,22 @@ | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_italic.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<script type="text/javascript"> | |||
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> | |||
<body class="remarkdown h1-underline h2-underline h3-underline hr-center ul-star pre-tick"> | |||
@@ -128,28 +144,6 @@ | |||
</footer> | |||
<script src="/static/david/js/instantpage-3.0.0.min.js" type="module" defer></script> | |||
<script type="text/javascript"> | |||
/* This is a work in progress with Anthony https://ricaud.me */ | |||
// TODISCUSS: | |||
// 1. give a way for the user to close that chooser? | |||
// 2. store preferences? Done using localStorage | |||
// 3. create the template from scratch in JS? | |||
// 4. how to make it generic? (no need for forced-dark/light existing rules) | |||
// Results from a Poll: https://mastodon.social/@dav/104093540923157521 | |||
// Avoir un moyen de changer de thème d'un site à la main : | |||
// 49% => Utile | |||
// 23% => Pas utile | |||
// 9% => So 2000 | |||
// 19% => Je veux le même | |||
// After 24 hours and 43 votes | |||
// A bit hard to interpret, I guess people wanting it found it useful too! | |||
function toggleTheme(themeName) { | |||
document.body.classList.toggle('forced-dark', themeName === 'dark') | |||
document.body.classList.toggle('forced-light', themeName === 'light') | |||
} | |||
function loadThemeForm(templateName) { | |||
const themeSelectorTemplate = document.querySelector(templateName) | |||
const form = themeSelectorTemplate.content.firstElementChild |
@@ -23,7 +23,7 @@ | |||
<meta name="msapplication-config" content="/static/david/icons2/browserconfig.xml"> | |||
<meta name="theme-color" content="#f0f0ea"> | |||
<!-- Documented, feel free to shoot an email. --> | |||
<link rel="stylesheet" href="/static/david/css/style_2020-04-25.css"> | |||
<link rel="stylesheet" href="/static/david/css/style_2020-06-19.css"> | |||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin> | |||
@@ -31,6 +31,22 @@ | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_italic.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<script type="text/javascript"> | |||
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> | |||
<body class="remarkdown h1-underline h2-underline h3-underline hr-center ul-star pre-tick"> | |||
@@ -122,28 +138,6 @@ | |||
</footer> | |||
<script src="/static/david/js/instantpage-3.0.0.min.js" type="module" defer></script> | |||
<script type="text/javascript"> | |||
/* This is a work in progress with Anthony https://ricaud.me */ | |||
// TODISCUSS: | |||
// 1. give a way for the user to close that chooser? | |||
// 2. store preferences? Done using localStorage | |||
// 3. create the template from scratch in JS? | |||
// 4. how to make it generic? (no need for forced-dark/light existing rules) | |||
// Results from a Poll: https://mastodon.social/@dav/104093540923157521 | |||
// Avoir un moyen de changer de thème d'un site à la main : | |||
// 49% => Utile | |||
// 23% => Pas utile | |||
// 9% => So 2000 | |||
// 19% => Je veux le même | |||
// After 24 hours and 43 votes | |||
// A bit hard to interpret, I guess people wanting it found it useful too! | |||
function toggleTheme(themeName) { | |||
document.body.classList.toggle('forced-dark', themeName === 'dark') | |||
document.body.classList.toggle('forced-light', themeName === 'light') | |||
} | |||
function loadThemeForm(templateName) { | |||
const themeSelectorTemplate = document.querySelector(templateName) | |||
const form = themeSelectorTemplate.content.firstElementChild |
@@ -23,7 +23,7 @@ | |||
<meta name="msapplication-config" content="/static/david/icons2/browserconfig.xml"> | |||
<meta name="theme-color" content="#f0f0ea"> | |||
<!-- Documented, feel free to shoot an email. --> | |||
<link rel="stylesheet" href="/static/david/css/style_2020-04-25.css"> | |||
<link rel="stylesheet" href="/static/david/css/style_2020-06-19.css"> | |||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin> | |||
@@ -31,6 +31,22 @@ | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_italic.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<script type="text/javascript"> | |||
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> | |||
<body class="remarkdown h1-underline h2-underline h3-underline hr-center ul-star pre-tick"> | |||
@@ -142,28 +158,6 @@ | |||
</footer> | |||
<script src="/static/david/js/instantpage-3.0.0.min.js" type="module" defer></script> | |||
<script type="text/javascript"> | |||
/* This is a work in progress with Anthony https://ricaud.me */ | |||
// TODISCUSS: | |||
// 1. give a way for the user to close that chooser? | |||
// 2. store preferences? Done using localStorage | |||
// 3. create the template from scratch in JS? | |||
// 4. how to make it generic? (no need for forced-dark/light existing rules) | |||
// Results from a Poll: https://mastodon.social/@dav/104093540923157521 | |||
// Avoir un moyen de changer de thème d'un site à la main : | |||
// 49% => Utile | |||
// 23% => Pas utile | |||
// 9% => So 2000 | |||
// 19% => Je veux le même | |||
// After 24 hours and 43 votes | |||
// A bit hard to interpret, I guess people wanting it found it useful too! | |||
function toggleTheme(themeName) { | |||
document.body.classList.toggle('forced-dark', themeName === 'dark') | |||
document.body.classList.toggle('forced-light', themeName === 'light') | |||
} | |||
function loadThemeForm(templateName) { | |||
const themeSelectorTemplate = document.querySelector(templateName) | |||
const form = themeSelectorTemplate.content.firstElementChild |
@@ -23,7 +23,7 @@ | |||
<meta name="msapplication-config" content="/static/david/icons2/browserconfig.xml"> | |||
<meta name="theme-color" content="#f0f0ea"> | |||
<!-- Documented, feel free to shoot an email. --> | |||
<link rel="stylesheet" href="/static/david/css/style_2020-04-25.css"> | |||
<link rel="stylesheet" href="/static/david/css/style_2020-06-19.css"> | |||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin> | |||
@@ -31,6 +31,22 @@ | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_italic.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<script type="text/javascript"> | |||
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> | |||
<body class="remarkdown h1-underline h2-underline h3-underline hr-center ul-star pre-tick"> | |||
@@ -166,28 +182,6 @@ Comme un hameau paisible au pied d’une montagne.</p> | |||
</footer> | |||
<script src="/static/david/js/instantpage-3.0.0.min.js" type="module" defer></script> | |||
<script type="text/javascript"> | |||
/* This is a work in progress with Anthony https://ricaud.me */ | |||
// TODISCUSS: | |||
// 1. give a way for the user to close that chooser? | |||
// 2. store preferences? Done using localStorage | |||
// 3. create the template from scratch in JS? | |||
// 4. how to make it generic? (no need for forced-dark/light existing rules) | |||
// Results from a Poll: https://mastodon.social/@dav/104093540923157521 | |||
// Avoir un moyen de changer de thème d'un site à la main : | |||
// 49% => Utile | |||
// 23% => Pas utile | |||
// 9% => So 2000 | |||
// 19% => Je veux le même | |||
// After 24 hours and 43 votes | |||
// A bit hard to interpret, I guess people wanting it found it useful too! | |||
function toggleTheme(themeName) { | |||
document.body.classList.toggle('forced-dark', themeName === 'dark') | |||
document.body.classList.toggle('forced-light', themeName === 'light') | |||
} | |||
function loadThemeForm(templateName) { | |||
const themeSelectorTemplate = document.querySelector(templateName) | |||
const form = themeSelectorTemplate.content.firstElementChild |
@@ -23,7 +23,7 @@ | |||
<meta name="msapplication-config" content="/static/david/icons2/browserconfig.xml"> | |||
<meta name="theme-color" content="#f0f0ea"> | |||
<!-- Documented, feel free to shoot an email. --> | |||
<link rel="stylesheet" href="/static/david/css/style_2020-04-25.css"> | |||
<link rel="stylesheet" href="/static/david/css/style_2020-06-19.css"> | |||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin> | |||
@@ -31,6 +31,22 @@ | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_italic.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<script type="text/javascript"> | |||
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> | |||
<body class="remarkdown h1-underline h2-underline h3-underline hr-center ul-star pre-tick"> | |||
@@ -130,28 +146,6 @@ | |||
</footer> | |||
<script src="/static/david/js/instantpage-3.0.0.min.js" type="module" defer></script> | |||
<script type="text/javascript"> | |||
/* This is a work in progress with Anthony https://ricaud.me */ | |||
// TODISCUSS: | |||
// 1. give a way for the user to close that chooser? | |||
// 2. store preferences? Done using localStorage | |||
// 3. create the template from scratch in JS? | |||
// 4. how to make it generic? (no need for forced-dark/light existing rules) | |||
// Results from a Poll: https://mastodon.social/@dav/104093540923157521 | |||
// Avoir un moyen de changer de thème d'un site à la main : | |||
// 49% => Utile | |||
// 23% => Pas utile | |||
// 9% => So 2000 | |||
// 19% => Je veux le même | |||
// After 24 hours and 43 votes | |||
// A bit hard to interpret, I guess people wanting it found it useful too! | |||
function toggleTheme(themeName) { | |||
document.body.classList.toggle('forced-dark', themeName === 'dark') | |||
document.body.classList.toggle('forced-light', themeName === 'light') | |||
} | |||
function loadThemeForm(templateName) { | |||
const themeSelectorTemplate = document.querySelector(templateName) | |||
const form = themeSelectorTemplate.content.firstElementChild |
@@ -23,7 +23,7 @@ | |||
<meta name="msapplication-config" content="/static/david/icons2/browserconfig.xml"> | |||
<meta name="theme-color" content="#f0f0ea"> | |||
<!-- Documented, feel free to shoot an email. --> | |||
<link rel="stylesheet" href="/static/david/css/style_2020-04-25.css"> | |||
<link rel="stylesheet" href="/static/david/css/style_2020-06-19.css"> | |||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin> | |||
@@ -31,6 +31,22 @@ | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_italic.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<script type="text/javascript"> | |||
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> | |||
<body class="remarkdown h1-underline h2-underline h3-underline hr-center ul-star pre-tick"> | |||
@@ -230,28 +246,6 @@ On croyait la main du marché invisible, c’est en fait une œillère bien opaq | |||
</footer> | |||
<script src="/static/david/js/instantpage-3.0.0.min.js" type="module" defer></script> | |||
<script type="text/javascript"> | |||
/* This is a work in progress with Anthony https://ricaud.me */ | |||
// TODISCUSS: | |||
// 1. give a way for the user to close that chooser? | |||
// 2. store preferences? Done using localStorage | |||
// 3. create the template from scratch in JS? | |||
// 4. how to make it generic? (no need for forced-dark/light existing rules) | |||
// Results from a Poll: https://mastodon.social/@dav/104093540923157521 | |||
// Avoir un moyen de changer de thème d'un site à la main : | |||
// 49% => Utile | |||
// 23% => Pas utile | |||
// 9% => So 2000 | |||
// 19% => Je veux le même | |||
// After 24 hours and 43 votes | |||
// A bit hard to interpret, I guess people wanting it found it useful too! | |||
function toggleTheme(themeName) { | |||
document.body.classList.toggle('forced-dark', themeName === 'dark') | |||
document.body.classList.toggle('forced-light', themeName === 'light') | |||
} | |||
function loadThemeForm(templateName) { | |||
const themeSelectorTemplate = document.querySelector(templateName) | |||
const form = themeSelectorTemplate.content.firstElementChild |
@@ -23,7 +23,7 @@ | |||
<meta name="msapplication-config" content="/static/david/icons2/browserconfig.xml"> | |||
<meta name="theme-color" content="#f0f0ea"> | |||
<!-- Documented, feel free to shoot an email. --> | |||
<link rel="stylesheet" href="/static/david/css/style_2020-04-25.css"> | |||
<link rel="stylesheet" href="/static/david/css/style_2020-06-19.css"> | |||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin> | |||
@@ -31,6 +31,22 @@ | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_italic.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<script type="text/javascript"> | |||
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> | |||
<body class="remarkdown h1-underline h2-underline h3-underline hr-center ul-star pre-tick"> | |||
@@ -193,28 +209,6 @@ Ensuite je survole régulièrement et je marque "comme lu" (sans les l | |||
</footer> | |||
<script src="/static/david/js/instantpage-3.0.0.min.js" type="module" defer></script> | |||
<script type="text/javascript"> | |||
/* This is a work in progress with Anthony https://ricaud.me */ | |||
// TODISCUSS: | |||
// 1. give a way for the user to close that chooser? | |||
// 2. store preferences? Done using localStorage | |||
// 3. create the template from scratch in JS? | |||
// 4. how to make it generic? (no need for forced-dark/light existing rules) | |||
// Results from a Poll: https://mastodon.social/@dav/104093540923157521 | |||
// Avoir un moyen de changer de thème d'un site à la main : | |||
// 49% => Utile | |||
// 23% => Pas utile | |||
// 9% => So 2000 | |||
// 19% => Je veux le même | |||
// After 24 hours and 43 votes | |||
// A bit hard to interpret, I guess people wanting it found it useful too! | |||
function toggleTheme(themeName) { | |||
document.body.classList.toggle('forced-dark', themeName === 'dark') | |||
document.body.classList.toggle('forced-light', themeName === 'light') | |||
} | |||
function loadThemeForm(templateName) { | |||
const themeSelectorTemplate = document.querySelector(templateName) | |||
const form = themeSelectorTemplate.content.firstElementChild |
@@ -23,7 +23,7 @@ | |||
<meta name="msapplication-config" content="/static/david/icons2/browserconfig.xml"> | |||
<meta name="theme-color" content="#f0f0ea"> | |||
<!-- Documented, feel free to shoot an email. --> | |||
<link rel="stylesheet" href="/static/david/css/style_2020-04-25.css"> | |||
<link rel="stylesheet" href="/static/david/css/style_2020-06-19.css"> | |||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin> | |||
@@ -31,6 +31,22 @@ | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_italic.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<script type="text/javascript"> | |||
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> | |||
<body class="remarkdown h1-underline h2-underline h3-underline hr-center ul-star pre-tick"> | |||
@@ -170,28 +186,6 @@ mark::after { | |||
</footer> | |||
<script src="/static/david/js/instantpage-3.0.0.min.js" type="module" defer></script> | |||
<script type="text/javascript"> | |||
/* This is a work in progress with Anthony https://ricaud.me */ | |||
// TODISCUSS: | |||
// 1. give a way for the user to close that chooser? | |||
// 2. store preferences? Done using localStorage | |||
// 3. create the template from scratch in JS? | |||
// 4. how to make it generic? (no need for forced-dark/light existing rules) | |||
// Results from a Poll: https://mastodon.social/@dav/104093540923157521 | |||
// Avoir un moyen de changer de thème d'un site à la main : | |||
// 49% => Utile | |||
// 23% => Pas utile | |||
// 9% => So 2000 | |||
// 19% => Je veux le même | |||
// After 24 hours and 43 votes | |||
// A bit hard to interpret, I guess people wanting it found it useful too! | |||
function toggleTheme(themeName) { | |||
document.body.classList.toggle('forced-dark', themeName === 'dark') | |||
document.body.classList.toggle('forced-light', themeName === 'light') | |||
} | |||
function loadThemeForm(templateName) { | |||
const themeSelectorTemplate = document.querySelector(templateName) | |||
const form = themeSelectorTemplate.content.firstElementChild |
@@ -23,7 +23,7 @@ | |||
<meta name="msapplication-config" content="/static/david/icons2/browserconfig.xml"> | |||
<meta name="theme-color" content="#f0f0ea"> | |||
<!-- Documented, feel free to shoot an email. --> | |||
<link rel="stylesheet" href="/static/david/css/style_2020-04-25.css"> | |||
<link rel="stylesheet" href="/static/david/css/style_2020-06-19.css"> | |||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin> | |||
@@ -31,6 +31,22 @@ | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_italic.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<script type="text/javascript"> | |||
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> | |||
<body class="remarkdown h1-underline h2-underline h3-underline hr-center ul-star pre-tick"> | |||
@@ -177,28 +193,6 @@ | |||
</footer> | |||
<script src="/static/david/js/instantpage-3.0.0.min.js" type="module" defer></script> | |||
<script type="text/javascript"> | |||
/* This is a work in progress with Anthony https://ricaud.me */ | |||
// TODISCUSS: | |||
// 1. give a way for the user to close that chooser? | |||
// 2. store preferences? Done using localStorage | |||
// 3. create the template from scratch in JS? | |||
// 4. how to make it generic? (no need for forced-dark/light existing rules) | |||
// Results from a Poll: https://mastodon.social/@dav/104093540923157521 | |||
// Avoir un moyen de changer de thème d'un site à la main : | |||
// 49% => Utile | |||
// 23% => Pas utile | |||
// 9% => So 2000 | |||
// 19% => Je veux le même | |||
// After 24 hours and 43 votes | |||
// A bit hard to interpret, I guess people wanting it found it useful too! | |||
function toggleTheme(themeName) { | |||
document.body.classList.toggle('forced-dark', themeName === 'dark') | |||
document.body.classList.toggle('forced-light', themeName === 'light') | |||
} | |||
function loadThemeForm(templateName) { | |||
const themeSelectorTemplate = document.querySelector(templateName) | |||
const form = themeSelectorTemplate.content.firstElementChild |
@@ -23,7 +23,7 @@ | |||
<meta name="msapplication-config" content="/static/david/icons2/browserconfig.xml"> | |||
<meta name="theme-color" content="#f0f0ea"> | |||
<!-- Documented, feel free to shoot an email. --> | |||
<link rel="stylesheet" href="/static/david/css/style_2020-04-25.css"> | |||
<link rel="stylesheet" href="/static/david/css/style_2020-06-19.css"> | |||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin> | |||
@@ -31,6 +31,22 @@ | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_italic.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<script type="text/javascript"> | |||
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> | |||
<body class="remarkdown h1-underline h2-underline h3-underline hr-center ul-star pre-tick"> | |||
@@ -157,28 +173,6 @@ mark::after { | |||
</footer> | |||
<script src="/static/david/js/instantpage-3.0.0.min.js" type="module" defer></script> | |||
<script type="text/javascript"> | |||
/* This is a work in progress with Anthony https://ricaud.me */ | |||
// TODISCUSS: | |||
// 1. give a way for the user to close that chooser? | |||
// 2. store preferences? Done using localStorage | |||
// 3. create the template from scratch in JS? | |||
// 4. how to make it generic? (no need for forced-dark/light existing rules) | |||
// Results from a Poll: https://mastodon.social/@dav/104093540923157521 | |||
// Avoir un moyen de changer de thème d'un site à la main : | |||
// 49% => Utile | |||
// 23% => Pas utile | |||
// 9% => So 2000 | |||
// 19% => Je veux le même | |||
// After 24 hours and 43 votes | |||
// A bit hard to interpret, I guess people wanting it found it useful too! | |||
function toggleTheme(themeName) { | |||
document.body.classList.toggle('forced-dark', themeName === 'dark') | |||
document.body.classList.toggle('forced-light', themeName === 'light') | |||
} | |||
function loadThemeForm(templateName) { | |||
const themeSelectorTemplate = document.querySelector(templateName) | |||
const form = themeSelectorTemplate.content.firstElementChild |
@@ -23,7 +23,7 @@ | |||
<meta name="msapplication-config" content="/static/david/icons2/browserconfig.xml"> | |||
<meta name="theme-color" content="#f0f0ea"> | |||
<!-- Documented, feel free to shoot an email. --> | |||
<link rel="stylesheet" href="/static/david/css/style_2020-04-25.css"> | |||
<link rel="stylesheet" href="/static/david/css/style_2020-06-19.css"> | |||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin> | |||
@@ -31,6 +31,22 @@ | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_italic.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<script type="text/javascript"> | |||
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> | |||
<body class="remarkdown h1-underline h2-underline h3-underline hr-center ul-star pre-tick"> | |||
@@ -189,28 +205,6 @@ | |||
</footer> | |||
<script src="/static/david/js/instantpage-3.0.0.min.js" type="module" defer></script> | |||
<script type="text/javascript"> | |||
/* This is a work in progress with Anthony https://ricaud.me */ | |||
// TODISCUSS: | |||
// 1. give a way for the user to close that chooser? | |||
// 2. store preferences? Done using localStorage | |||
// 3. create the template from scratch in JS? | |||
// 4. how to make it generic? (no need for forced-dark/light existing rules) | |||
// Results from a Poll: https://mastodon.social/@dav/104093540923157521 | |||
// Avoir un moyen de changer de thème d'un site à la main : | |||
// 49% => Utile | |||
// 23% => Pas utile | |||
// 9% => So 2000 | |||
// 19% => Je veux le même | |||
// After 24 hours and 43 votes | |||
// A bit hard to interpret, I guess people wanting it found it useful too! | |||
function toggleTheme(themeName) { | |||
document.body.classList.toggle('forced-dark', themeName === 'dark') | |||
document.body.classList.toggle('forced-light', themeName === 'light') | |||
} | |||
function loadThemeForm(templateName) { | |||
const themeSelectorTemplate = document.querySelector(templateName) | |||
const form = themeSelectorTemplate.content.firstElementChild |
@@ -23,7 +23,7 @@ | |||
<meta name="msapplication-config" content="/static/david/icons2/browserconfig.xml"> | |||
<meta name="theme-color" content="#f0f0ea"> | |||
<!-- Documented, feel free to shoot an email. --> | |||
<link rel="stylesheet" href="/static/david/css/style_2020-04-25.css"> | |||
<link rel="stylesheet" href="/static/david/css/style_2020-06-19.css"> | |||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin> | |||
@@ -31,6 +31,22 @@ | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_italic.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<script type="text/javascript"> | |||
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> | |||
<body class="remarkdown h1-underline h2-underline h3-underline hr-center ul-star pre-tick"> | |||
@@ -156,28 +172,6 @@ | |||
</footer> | |||
<script src="/static/david/js/instantpage-3.0.0.min.js" type="module" defer></script> | |||
<script type="text/javascript"> | |||
/* This is a work in progress with Anthony https://ricaud.me */ | |||
// TODISCUSS: | |||
// 1. give a way for the user to close that chooser? | |||
// 2. store preferences? Done using localStorage | |||
// 3. create the template from scratch in JS? | |||
// 4. how to make it generic? (no need for forced-dark/light existing rules) | |||
// Results from a Poll: https://mastodon.social/@dav/104093540923157521 | |||
// Avoir un moyen de changer de thème d'un site à la main : | |||
// 49% => Utile | |||
// 23% => Pas utile | |||
// 9% => So 2000 | |||
// 19% => Je veux le même | |||
// After 24 hours and 43 votes | |||
// A bit hard to interpret, I guess people wanting it found it useful too! | |||
function toggleTheme(themeName) { | |||
document.body.classList.toggle('forced-dark', themeName === 'dark') | |||
document.body.classList.toggle('forced-light', themeName === 'light') | |||
} | |||
function loadThemeForm(templateName) { | |||
const themeSelectorTemplate = document.querySelector(templateName) | |||
const form = themeSelectorTemplate.content.firstElementChild |
@@ -23,7 +23,7 @@ | |||
<meta name="msapplication-config" content="/static/david/icons2/browserconfig.xml"> | |||
<meta name="theme-color" content="#f0f0ea"> | |||
<!-- Documented, feel free to shoot an email. --> | |||
<link rel="stylesheet" href="/static/david/css/style_2020-04-25.css"> | |||
<link rel="stylesheet" href="/static/david/css/style_2020-06-19.css"> | |||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin> | |||
@@ -31,6 +31,22 @@ | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_italic.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<script type="text/javascript"> | |||
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> | |||
<body class="remarkdown h1-underline h2-underline h3-underline hr-center ul-star pre-tick"> | |||
@@ -166,28 +182,6 @@ | |||
</footer> | |||
<script src="/static/david/js/instantpage-3.0.0.min.js" type="module" defer></script> | |||
<script type="text/javascript"> | |||
/* This is a work in progress with Anthony https://ricaud.me */ | |||
// TODISCUSS: | |||
// 1. give a way for the user to close that chooser? | |||
// 2. store preferences? Done using localStorage | |||
// 3. create the template from scratch in JS? | |||
// 4. how to make it generic? (no need for forced-dark/light existing rules) | |||
// Results from a Poll: https://mastodon.social/@dav/104093540923157521 | |||
// Avoir un moyen de changer de thème d'un site à la main : | |||
// 49% => Utile | |||
// 23% => Pas utile | |||
// 9% => So 2000 | |||
// 19% => Je veux le même | |||
// After 24 hours and 43 votes | |||
// A bit hard to interpret, I guess people wanting it found it useful too! | |||
function toggleTheme(themeName) { | |||
document.body.classList.toggle('forced-dark', themeName === 'dark') | |||
document.body.classList.toggle('forced-light', themeName === 'light') | |||
} | |||
function loadThemeForm(templateName) { | |||
const themeSelectorTemplate = document.querySelector(templateName) | |||
const form = themeSelectorTemplate.content.firstElementChild |
@@ -23,7 +23,7 @@ | |||
<meta name="msapplication-config" content="/static/david/icons2/browserconfig.xml"> | |||
<meta name="theme-color" content="#f0f0ea"> | |||
<!-- Documented, feel free to shoot an email. --> | |||
<link rel="stylesheet" href="/static/david/css/style_2020-04-25.css"> | |||
<link rel="stylesheet" href="/static/david/css/style_2020-06-19.css"> | |||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin> | |||
@@ -31,6 +31,22 @@ | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_italic.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<script type="text/javascript"> | |||
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> | |||
<body class="remarkdown h1-underline h2-underline h3-underline hr-center ul-star pre-tick"> | |||
@@ -194,28 +210,6 @@ | |||
</footer> | |||
<script src="/static/david/js/instantpage-3.0.0.min.js" type="module" defer></script> | |||
<script type="text/javascript"> | |||
/* This is a work in progress with Anthony https://ricaud.me */ | |||
// TODISCUSS: | |||
// 1. give a way for the user to close that chooser? | |||
// 2. store preferences? Done using localStorage | |||
// 3. create the template from scratch in JS? | |||
// 4. how to make it generic? (no need for forced-dark/light existing rules) | |||
// Results from a Poll: https://mastodon.social/@dav/104093540923157521 | |||
// Avoir un moyen de changer de thème d'un site à la main : | |||
// 49% => Utile | |||
// 23% => Pas utile | |||
// 9% => So 2000 | |||
// 19% => Je veux le même | |||
// After 24 hours and 43 votes | |||
// A bit hard to interpret, I guess people wanting it found it useful too! | |||
function toggleTheme(themeName) { | |||
document.body.classList.toggle('forced-dark', themeName === 'dark') | |||
document.body.classList.toggle('forced-light', themeName === 'light') | |||
} | |||
function loadThemeForm(templateName) { | |||
const themeSelectorTemplate = document.querySelector(templateName) | |||
const form = themeSelectorTemplate.content.firstElementChild |
@@ -23,7 +23,7 @@ | |||
<meta name="msapplication-config" content="/static/david/icons2/browserconfig.xml"> | |||
<meta name="theme-color" content="#f0f0ea"> | |||
<!-- Documented, feel free to shoot an email. --> | |||
<link rel="stylesheet" href="/static/david/css/style_2020-04-25.css"> | |||
<link rel="stylesheet" href="/static/david/css/style_2020-06-19.css"> | |||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin> | |||
@@ -31,6 +31,22 @@ | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_italic.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<script type="text/javascript"> | |||
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> | |||
<body class="remarkdown h1-underline h2-underline h3-underline hr-center ul-star pre-tick"> | |||
@@ -135,28 +151,6 @@ | |||
</footer> | |||
<script src="/static/david/js/instantpage-3.0.0.min.js" type="module" defer></script> | |||
<script type="text/javascript"> | |||
/* This is a work in progress with Anthony https://ricaud.me */ | |||
// TODISCUSS: | |||
// 1. give a way for the user to close that chooser? | |||
// 2. store preferences? Done using localStorage | |||
// 3. create the template from scratch in JS? | |||
// 4. how to make it generic? (no need for forced-dark/light existing rules) | |||
// Results from a Poll: https://mastodon.social/@dav/104093540923157521 | |||
// Avoir un moyen de changer de thème d'un site à la main : | |||
// 49% => Utile | |||
// 23% => Pas utile | |||
// 9% => So 2000 | |||
// 19% => Je veux le même | |||
// After 24 hours and 43 votes | |||
// A bit hard to interpret, I guess people wanting it found it useful too! | |||
function toggleTheme(themeName) { | |||
document.body.classList.toggle('forced-dark', themeName === 'dark') | |||
document.body.classList.toggle('forced-light', themeName === 'light') | |||
} | |||
function loadThemeForm(templateName) { | |||
const themeSelectorTemplate = document.querySelector(templateName) | |||
const form = themeSelectorTemplate.content.firstElementChild |
@@ -23,7 +23,7 @@ | |||
<meta name="msapplication-config" content="/static/david/icons2/browserconfig.xml"> | |||
<meta name="theme-color" content="#f0f0ea"> | |||
<!-- Documented, feel free to shoot an email. --> | |||
<link rel="stylesheet" href="/static/david/css/style_2020-04-25.css"> | |||
<link rel="stylesheet" href="/static/david/css/style_2020-06-19.css"> | |||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin> | |||
@@ -31,6 +31,22 @@ | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_italic.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<script type="text/javascript"> | |||
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> | |||
<body class="remarkdown h1-underline h2-underline h3-underline hr-center ul-star pre-tick"> | |||
@@ -172,28 +188,6 @@ | |||
</footer> | |||
<script src="/static/david/js/instantpage-3.0.0.min.js" type="module" defer></script> | |||
<script type="text/javascript"> | |||
/* This is a work in progress with Anthony https://ricaud.me */ | |||
// TODISCUSS: | |||
// 1. give a way for the user to close that chooser? | |||
// 2. store preferences? Done using localStorage | |||
// 3. create the template from scratch in JS? | |||
// 4. how to make it generic? (no need for forced-dark/light existing rules) | |||
// Results from a Poll: https://mastodon.social/@dav/104093540923157521 | |||
// Avoir un moyen de changer de thème d'un site à la main : | |||
// 49% => Utile | |||
// 23% => Pas utile | |||
// 9% => So 2000 | |||
// 19% => Je veux le même | |||
// After 24 hours and 43 votes | |||
// A bit hard to interpret, I guess people wanting it found it useful too! | |||
function toggleTheme(themeName) { | |||
document.body.classList.toggle('forced-dark', themeName === 'dark') | |||
document.body.classList.toggle('forced-light', themeName === 'light') | |||
} | |||
function loadThemeForm(templateName) { | |||
const themeSelectorTemplate = document.querySelector(templateName) | |||
const form = themeSelectorTemplate.content.firstElementChild |
@@ -23,7 +23,7 @@ | |||
<meta name="msapplication-config" content="/static/david/icons2/browserconfig.xml"> | |||
<meta name="theme-color" content="#f0f0ea"> | |||
<!-- Documented, feel free to shoot an email. --> | |||
<link rel="stylesheet" href="/static/david/css/style_2020-04-25.css"> | |||
<link rel="stylesheet" href="/static/david/css/style_2020-06-19.css"> | |||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin> | |||
@@ -31,6 +31,22 @@ | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_italic.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<script type="text/javascript"> | |||
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> | |||
<body class="remarkdown h1-underline h2-underline h3-underline hr-center ul-star pre-tick"> | |||
@@ -168,28 +184,6 @@ | |||
</footer> | |||
<script src="/static/david/js/instantpage-3.0.0.min.js" type="module" defer></script> | |||
<script type="text/javascript"> | |||
/* This is a work in progress with Anthony https://ricaud.me */ | |||
// TODISCUSS: | |||
// 1. give a way for the user to close that chooser? | |||
// 2. store preferences? Done using localStorage | |||
// 3. create the template from scratch in JS? | |||
// 4. how to make it generic? (no need for forced-dark/light existing rules) | |||
// Results from a Poll: https://mastodon.social/@dav/104093540923157521 | |||
// Avoir un moyen de changer de thème d'un site à la main : | |||
// 49% => Utile | |||
// 23% => Pas utile | |||
// 9% => So 2000 | |||
// 19% => Je veux le même | |||
// After 24 hours and 43 votes | |||
// A bit hard to interpret, I guess people wanting it found it useful too! | |||
function toggleTheme(themeName) { | |||
document.body.classList.toggle('forced-dark', themeName === 'dark') | |||
document.body.classList.toggle('forced-light', themeName === 'light') | |||
} | |||
function loadThemeForm(templateName) { | |||
const themeSelectorTemplate = document.querySelector(templateName) | |||
const form = themeSelectorTemplate.content.firstElementChild |
@@ -23,7 +23,7 @@ | |||
<meta name="msapplication-config" content="/static/david/icons2/browserconfig.xml"> | |||
<meta name="theme-color" content="#f0f0ea"> | |||
<!-- Documented, feel free to shoot an email. --> | |||
<link rel="stylesheet" href="/static/david/css/style_2020-04-25.css"> | |||
<link rel="stylesheet" href="/static/david/css/style_2020-06-19.css"> | |||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin> | |||
@@ -31,6 +31,22 @@ | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_italic.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<script type="text/javascript"> | |||
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> | |||
<body class="remarkdown h1-underline h2-underline h3-underline hr-center ul-star pre-tick"> | |||
@@ -154,28 +170,6 @@ | |||
</footer> | |||
<script src="/static/david/js/instantpage-3.0.0.min.js" type="module" defer></script> | |||
<script type="text/javascript"> | |||
/* This is a work in progress with Anthony https://ricaud.me */ | |||
// TODISCUSS: | |||
// 1. give a way for the user to close that chooser? | |||
// 2. store preferences? Done using localStorage | |||
// 3. create the template from scratch in JS? | |||
// 4. how to make it generic? (no need for forced-dark/light existing rules) | |||
// Results from a Poll: https://mastodon.social/@dav/104093540923157521 | |||
// Avoir un moyen de changer de thème d'un site à la main : | |||
// 49% => Utile | |||
// 23% => Pas utile | |||
// 9% => So 2000 | |||
// 19% => Je veux le même | |||
// After 24 hours and 43 votes | |||
// A bit hard to interpret, I guess people wanting it found it useful too! | |||
function toggleTheme(themeName) { | |||
document.body.classList.toggle('forced-dark', themeName === 'dark') | |||
document.body.classList.toggle('forced-light', themeName === 'light') | |||
} | |||
function loadThemeForm(templateName) { | |||
const themeSelectorTemplate = document.querySelector(templateName) | |||
const form = themeSelectorTemplate.content.firstElementChild |
@@ -23,7 +23,7 @@ | |||
<meta name="msapplication-config" content="/static/david/icons2/browserconfig.xml"> | |||
<meta name="theme-color" content="#f0f0ea"> | |||
<!-- Documented, feel free to shoot an email. --> | |||
<link rel="stylesheet" href="/static/david/css/style_2020-04-25.css"> | |||
<link rel="stylesheet" href="/static/david/css/style_2020-06-19.css"> | |||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin> | |||
@@ -31,6 +31,22 @@ | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_italic.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<script type="text/javascript"> | |||
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> | |||
<body class="remarkdown h1-underline h2-underline h3-underline hr-center ul-star pre-tick"> | |||
@@ -170,28 +186,6 @@ Le trou où la bête panse ses plaies, non le repaire où elle fourbit ses griff | |||
</footer> | |||
<script src="/static/david/js/instantpage-3.0.0.min.js" type="module" defer></script> | |||
<script type="text/javascript"> | |||
/* This is a work in progress with Anthony https://ricaud.me */ | |||
// TODISCUSS: | |||
// 1. give a way for the user to close that chooser? | |||
// 2. store preferences? Done using localStorage | |||
// 3. create the template from scratch in JS? | |||
// 4. how to make it generic? (no need for forced-dark/light existing rules) | |||
// Results from a Poll: https://mastodon.social/@dav/104093540923157521 | |||
// Avoir un moyen de changer de thème d'un site à la main : | |||
// 49% => Utile | |||
// 23% => Pas utile | |||
// 9% => So 2000 | |||
// 19% => Je veux le même | |||
// After 24 hours and 43 votes | |||
// A bit hard to interpret, I guess people wanting it found it useful too! | |||
function toggleTheme(themeName) { | |||
document.body.classList.toggle('forced-dark', themeName === 'dark') | |||
document.body.classList.toggle('forced-light', themeName === 'light') | |||
} | |||
function loadThemeForm(templateName) { | |||
const themeSelectorTemplate = document.querySelector(templateName) | |||
const form = themeSelectorTemplate.content.firstElementChild |
@@ -23,7 +23,7 @@ | |||
<meta name="msapplication-config" content="/static/david/icons2/browserconfig.xml"> | |||
<meta name="theme-color" content="#f0f0ea"> | |||
<!-- Documented, feel free to shoot an email. --> | |||
<link rel="stylesheet" href="/static/david/css/style_2020-04-25.css"> | |||
<link rel="stylesheet" href="/static/david/css/style_2020-06-19.css"> | |||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin> | |||
@@ -31,6 +31,22 @@ | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_italic.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<script type="text/javascript"> | |||
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> | |||
<body class="remarkdown h1-underline h2-underline h3-underline hr-center ul-star pre-tick"> | |||
@@ -133,28 +149,6 @@ | |||
</footer> | |||
<script src="/static/david/js/instantpage-3.0.0.min.js" type="module" defer></script> | |||
<script type="text/javascript"> | |||
/* This is a work in progress with Anthony https://ricaud.me */ | |||
// TODISCUSS: | |||
// 1. give a way for the user to close that chooser? | |||
// 2. store preferences? Done using localStorage | |||
// 3. create the template from scratch in JS? | |||
// 4. how to make it generic? (no need for forced-dark/light existing rules) | |||
// Results from a Poll: https://mastodon.social/@dav/104093540923157521 | |||
// Avoir un moyen de changer de thème d'un site à la main : | |||
// 49% => Utile | |||
// 23% => Pas utile | |||
// 9% => So 2000 | |||
// 19% => Je veux le même | |||
// After 24 hours and 43 votes | |||
// A bit hard to interpret, I guess people wanting it found it useful too! | |||
function toggleTheme(themeName) { | |||
document.body.classList.toggle('forced-dark', themeName === 'dark') | |||
document.body.classList.toggle('forced-light', themeName === 'light') | |||
} | |||
function loadThemeForm(templateName) { | |||
const themeSelectorTemplate = document.querySelector(templateName) | |||
const form = themeSelectorTemplate.content.firstElementChild |
@@ -23,7 +23,7 @@ | |||
<meta name="msapplication-config" content="/static/david/icons2/browserconfig.xml"> | |||
<meta name="theme-color" content="#f0f0ea"> | |||
<!-- Documented, feel free to shoot an email. --> | |||
<link rel="stylesheet" href="/static/david/css/style_2020-04-25.css"> | |||
<link rel="stylesheet" href="/static/david/css/style_2020-06-19.css"> | |||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin> | |||
@@ -31,6 +31,22 @@ | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_italic.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<script type="text/javascript"> | |||
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> | |||
<body class="remarkdown h1-underline h2-underline h3-underline hr-center ul-star pre-tick"> | |||
@@ -143,28 +159,6 @@ | |||
</footer> | |||
<script src="/static/david/js/instantpage-3.0.0.min.js" type="module" defer></script> | |||
<script type="text/javascript"> | |||
/* This is a work in progress with Anthony https://ricaud.me */ | |||
// TODISCUSS: | |||
// 1. give a way for the user to close that chooser? | |||
// 2. store preferences? Done using localStorage | |||
// 3. create the template from scratch in JS? | |||
// 4. how to make it generic? (no need for forced-dark/light existing rules) | |||
// Results from a Poll: https://mastodon.social/@dav/104093540923157521 | |||
// Avoir un moyen de changer de thème d'un site à la main : | |||
// 49% => Utile | |||
// 23% => Pas utile | |||
// 9% => So 2000 | |||
// 19% => Je veux le même | |||
// After 24 hours and 43 votes | |||
// A bit hard to interpret, I guess people wanting it found it useful too! | |||
function toggleTheme(themeName) { | |||
document.body.classList.toggle('forced-dark', themeName === 'dark') | |||
document.body.classList.toggle('forced-light', themeName === 'light') | |||
} | |||
function loadThemeForm(templateName) { | |||
const themeSelectorTemplate = document.querySelector(templateName) | |||
const form = themeSelectorTemplate.content.firstElementChild |
@@ -23,7 +23,7 @@ | |||
<meta name="msapplication-config" content="/static/david/icons2/browserconfig.xml"> | |||
<meta name="theme-color" content="#f0f0ea"> | |||
<!-- Documented, feel free to shoot an email. --> | |||
<link rel="stylesheet" href="/static/david/css/style_2020-04-25.css"> | |||
<link rel="stylesheet" href="/static/david/css/style_2020-06-19.css"> | |||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin> | |||
@@ -31,6 +31,22 @@ | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_italic.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<script type="text/javascript"> | |||
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> | |||
<body class="remarkdown h1-underline h2-underline h3-underline hr-center ul-star pre-tick"> | |||
@@ -187,28 +203,6 @@ L’alternative c’est l’ermitage.</p> | |||
</footer> | |||
<script src="/static/david/js/instantpage-3.0.0.min.js" type="module" defer></script> | |||
<script type="text/javascript"> | |||
/* This is a work in progress with Anthony https://ricaud.me */ | |||
// TODISCUSS: | |||
// 1. give a way for the user to close that chooser? | |||
// 2. store preferences? Done using localStorage | |||
// 3. create the template from scratch in JS? | |||
// 4. how to make it generic? (no need for forced-dark/light existing rules) | |||
// Results from a Poll: https://mastodon.social/@dav/104093540923157521 | |||
// Avoir un moyen de changer de thème d'un site à la main : | |||
// 49% => Utile | |||
// 23% => Pas utile | |||
// 9% => So 2000 | |||
// 19% => Je veux le même | |||
// After 24 hours and 43 votes | |||
// A bit hard to interpret, I guess people wanting it found it useful too! | |||
function toggleTheme(themeName) { | |||
document.body.classList.toggle('forced-dark', themeName === 'dark') | |||
document.body.classList.toggle('forced-light', themeName === 'light') | |||
} | |||
function loadThemeForm(templateName) { | |||
const themeSelectorTemplate = document.querySelector(templateName) | |||
const form = themeSelectorTemplate.content.firstElementChild |
@@ -23,7 +23,7 @@ | |||
<meta name="msapplication-config" content="/static/david/icons2/browserconfig.xml"> | |||
<meta name="theme-color" content="#f0f0ea"> | |||
<!-- Documented, feel free to shoot an email. --> | |||
<link rel="stylesheet" href="/static/david/css/style_2020-04-25.css"> | |||
<link rel="stylesheet" href="/static/david/css/style_2020-06-19.css"> | |||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin> | |||
@@ -31,6 +31,22 @@ | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_italic.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<script type="text/javascript"> | |||
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> | |||
<body class="remarkdown h1-underline h2-underline h3-underline hr-center ul-star pre-tick"> | |||
@@ -163,28 +179,6 @@ | |||
</footer> | |||
<script src="/static/david/js/instantpage-3.0.0.min.js" type="module" defer></script> | |||
<script type="text/javascript"> | |||
/* This is a work in progress with Anthony https://ricaud.me */ | |||
// TODISCUSS: | |||
// 1. give a way for the user to close that chooser? | |||
// 2. store preferences? Done using localStorage | |||
// 3. create the template from scratch in JS? | |||
// 4. how to make it generic? (no need for forced-dark/light existing rules) | |||
// Results from a Poll: https://mastodon.social/@dav/104093540923157521 | |||
// Avoir un moyen de changer de thème d'un site à la main : | |||
// 49% => Utile | |||
// 23% => Pas utile | |||
// 9% => So 2000 | |||
// 19% => Je veux le même | |||
// After 24 hours and 43 votes | |||
// A bit hard to interpret, I guess people wanting it found it useful too! | |||
function toggleTheme(themeName) { | |||
document.body.classList.toggle('forced-dark', themeName === 'dark') | |||
document.body.classList.toggle('forced-light', themeName === 'light') | |||
} | |||
function loadThemeForm(templateName) { | |||
const themeSelectorTemplate = document.querySelector(templateName) | |||
const form = themeSelectorTemplate.content.firstElementChild |
@@ -23,7 +23,7 @@ | |||
<meta name="msapplication-config" content="/static/david/icons2/browserconfig.xml"> | |||
<meta name="theme-color" content="#f0f0ea"> | |||
<!-- Documented, feel free to shoot an email. --> | |||
<link rel="stylesheet" href="/static/david/css/style_2020-04-25.css"> | |||
<link rel="stylesheet" href="/static/david/css/style_2020-06-19.css"> | |||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin> | |||
@@ -31,6 +31,22 @@ | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_italic.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<script type="text/javascript"> | |||
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> | |||
<body class="remarkdown h1-underline h2-underline h3-underline hr-center ul-star pre-tick"> | |||
@@ -156,28 +172,6 @@ | |||
</footer> | |||
<script src="/static/david/js/instantpage-3.0.0.min.js" type="module" defer></script> | |||
<script type="text/javascript"> | |||
/* This is a work in progress with Anthony https://ricaud.me */ | |||
// TODISCUSS: | |||
// 1. give a way for the user to close that chooser? | |||
// 2. store preferences? Done using localStorage | |||
// 3. create the template from scratch in JS? | |||
// 4. how to make it generic? (no need for forced-dark/light existing rules) | |||
// Results from a Poll: https://mastodon.social/@dav/104093540923157521 | |||
// Avoir un moyen de changer de thème d'un site à la main : | |||
// 49% => Utile | |||
// 23% => Pas utile | |||
// 9% => So 2000 | |||
// 19% => Je veux le même | |||
// After 24 hours and 43 votes | |||
// A bit hard to interpret, I guess people wanting it found it useful too! | |||
function toggleTheme(themeName) { | |||
document.body.classList.toggle('forced-dark', themeName === 'dark') | |||
document.body.classList.toggle('forced-light', themeName === 'light') | |||
} | |||
function loadThemeForm(templateName) { | |||
const themeSelectorTemplate = document.querySelector(templateName) | |||
const form = themeSelectorTemplate.content.firstElementChild |
@@ -23,7 +23,7 @@ | |||
<meta name="msapplication-config" content="/static/david/icons2/browserconfig.xml"> | |||
<meta name="theme-color" content="#f0f0ea"> | |||
<!-- Documented, feel free to shoot an email. --> | |||
<link rel="stylesheet" href="/static/david/css/style_2020-04-25.css"> | |||
<link rel="stylesheet" href="/static/david/css/style_2020-06-19.css"> | |||
<!-- See https://www.zachleat.com/web/comprehensive-webfonts/ for the trade-off. --> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin> | |||
@@ -31,6 +31,22 @@ | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_regular.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_bold.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<link rel="preload" href="/static/david/css/fonts/triplicate_t3_italic.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: dark)" crossorigin> | |||
<script type="text/javascript"> | |||
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> | |||
{% block extra_head %}{% endblock %} | |||
<body class="remarkdown h1-underline h2-underline h3-underline hr-center ul-star pre-tick"> | |||
{% block content %}{% endblock content %} | |||
@@ -64,28 +80,6 @@ | |||
</footer> | |||
<script src="/static/david/js/instantpage-3.0.0.min.js" type="module" defer></script> | |||
<script type="text/javascript"> | |||
/* This is a work in progress with Anthony https://ricaud.me */ | |||
// TODISCUSS: | |||
// 1. give a way for the user to close that chooser? | |||
// 2. store preferences? Done using localStorage | |||
// 3. create the template from scratch in JS? | |||
// 4. how to make it generic? (no need for forced-dark/light existing rules) | |||
// Results from a Poll: https://mastodon.social/@dav/104093540923157521 | |||
// Avoir un moyen de changer de thème d'un site à la main : | |||
// 49% => Utile | |||
// 23% => Pas utile | |||
// 9% => So 2000 | |||
// 19% => Je veux le même | |||
// After 24 hours and 43 votes | |||
// A bit hard to interpret, I guess people wanting it found it useful too! | |||
function toggleTheme(themeName) { | |||
document.body.classList.toggle('forced-dark', themeName === 'dark') | |||
document.body.classList.toggle('forced-light', themeName === 'light') | |||
} | |||
function loadThemeForm(templateName) { | |||
const themeSelectorTemplate = document.querySelector(templateName) | |||
const form = themeSelectorTemplate.content.firstElementChild |