|
|
|
|
|
|
|
|
|
|
|
<!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>La prise décision par consentement : un outil au service du groupe (archive) — David Larlet</title> |
|
|
|
|
|
<meta name="description" content="Publication mise en cache pour en conserver une trace."> |
|
|
|
|
|
<!-- 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"> |
|
|
|
|
|
<!-- Documented, feel free to shoot an email. --> |
|
|
|
|
|
<link rel="stylesheet" href="/static/david/css/style_2021-01-20.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> |
|
|
|
|
|
<link rel="preload" href="/static/david/css/fonts/triplicate_t4_poly_italic.woff2" as="font" type="font/woff2" media="(prefers-color-scheme: light), (prefers-color-scheme: no-preference)" crossorigin> |
|
|
|
|
|
<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> |
|
|
|
|
|
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> |
|
|
|
|
|
|
|
|
|
|
|
<meta name="robots" content="noindex, nofollow"> |
|
|
|
|
|
<meta content="origin-when-cross-origin" name="referrer"> |
|
|
|
|
|
<!-- Canonical URL for SEO purposes --> |
|
|
|
|
|
<link rel="canonical" href="http://pilavenir.canalblog.com/archives/2017/10/21/35793152.html"> |
|
|
|
|
|
|
|
|
|
|
|
<body class="remarkdown h1-underline h2-underline h3-underline em-underscore hr-center ul-star pre-tick" data-instant-intensity="viewport-all"> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<article> |
|
|
|
|
|
<header> |
|
|
|
|
|
<h1>La prise décision par consentement : un outil au service du groupe</h1> |
|
|
|
|
|
</header> |
|
|
|
|
|
<nav> |
|
|
|
|
|
<p class="center"> |
|
|
|
|
|
<a href="/david/" title="Aller à l’accueil"><svg class="icon icon-home"> |
|
|
|
|
|
<use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-home"></use> |
|
|
|
|
|
</svg> Accueil</a> • |
|
|
|
|
|
<a href="http://pilavenir.canalblog.com/archives/2017/10/21/35793152.html" title="Lien vers le contenu original">Source originale</a> |
|
|
|
|
|
<br> |
|
|
|
|
|
Mis en cache le 2024-04-04 |
|
|
|
|
|
</p> |
|
|
|
|
|
</nav> |
|
|
|
|
|
<hr> |
|
|
|
|
|
<p><img src="https://storage.canalblog.com/86/12/1386927/117820010.png" border="0" alt="" class="widthadapted"></p> |
|
|
|
|
|
<p> </p> |
|
|
|
|
|
<p><span><strong>Décision par consentement</strong> </span></p> |
|
|
|
|
|
<p align="JUSTIFY"><span>La prise de décision par consentement se différencie de la prise de décision par consensus : <span><strong>en consensus tout le monde dit « oui », en consentement, personne ne dit « non »</strong></span>. </span></p> |
|
|
|
|
|
<p align="JUSTIFY"><span><span>Cela sous-entend que lorsque l’on prend une décision par consentement, on ne va pas chercher la « meilleure solution » mais l’on va partir du principe qu’une bonne décision est celle qui respecte les limites de celles et ceux qui devront l’assumer, et qui ne compromet en rien la capacité de l’organisation à mener à bien sa mission. Le consentement implique qu’une décision ne peut être prise que lorsqu’il n’y a plus d’objection raisonnable à celle-ci. Tant qu’il y a des objections, l’ensemble du groupe est mobilisé pour bonifier la proposition. Ainsi, les objections permettent de révéler les limites avec lesquelles le groupe devra composer et indiquent donc l’espace de liberté dont le cercle dispose.</span> </span></p> |
|
|
|
|
|
<p class="ob-h3 western" align="JUSTIFY"><span>LE FACILITATEUR</span></p> |
|
|
|
|
|
<p align="JUSTIFY"><span>À la différence de l’animateur qui emmène un groupe vers un objectif à atteindre, le rôle du facilitateur est de dérouler les différentes étapes proposées dans le processus de décision. Qu’il soit ou non membre, <span><strong>il n’a pas de pouvoir sur le groupe</strong></span>. Il n’est pas plus responsable que les autres membres du groupe de la qualité du résultat obtenu.</span></p> |
|
|
|
|
|
<p class="ob-h3 western" align="JUSTIFY"><span>LE SECRÉTAIRE</span></p> |
|
|
|
|
|
<p align="JUSTIFY"><span>Le secrétaire assure un relevé des décisions et de la matière qui ont émergé de la séance. Durant les prises de décisions, il seconde le facilitateur en notant les propositions, amendements, objections et bonifications. Il est également celui qui remplace le facilitateur lorsque ce dernier est impliqué directement dans une phase du processus. Par exemple, pendant que le facilitateur est concentré sur le traitement d’une objection qu’il a posée, il peut demander au secrétaire d’assurer la facilitation du processus et la reprendra ensuite. Les rôles de facilitateurs et de secrétaires sont attribués par le processus de l’élection sans candidat afin de donner toute la légitimité nécessaire à ceux qui assureront ces missions.</span></p> |
|
|
|
|
|
<p class="ob-h3 western" align="JUSTIFY"><span>CIRCULATION DE LA PAROLE</span></p> |
|
|
|
|
|
<p align="JUSTIFY"><span>S’il est socialement extrêmement simple de se répartir la nourriture contenue dans un plat, il est beaucoup moins naturel de se répartir la parole. À défaut d’une plus grande sagesse collective, les processus régissent la circulation de celle-ci et le facilitateur peut, selon les étapes du processus ou les circonstances, proposer différentes façons de la distribuer :</span></p> |
|
|
|
|
|
<ul> |
|
|
|
|
|
<li> |
|
|
|
|
|
<p align="JUSTIFY"><span><strong><span>Parole tournante</span></strong><span> : le facilitateur lance la parole à sa droite ou sa gauche. Chacun s’exprime à son tour. Si quelqu’un n’est pas prêt, il peut passer. Le facilitateur reviendra vers lui une fois le tour terminé. </span></span></p> |
|
|
|
|
|
</li> |
|
|
|
|
|
<li> |
|
|
|
|
|
<p align="JUSTIFY"><span><strong><span>Parole au centre</span></strong><span> : pour inviter chacun à s’exprimer sur le sujet lorsque bon lui semble. À noter que cette pratique demande de la discipline pour rester centré sur le sujet de départ et ne pas réagir à ce que la personne précédente a exprimé. </span></span></p> |
|
|
|
|
|
</li> |
|
|
|
|
|
<li> |
|
|
|
|
|
<p align="JUSTIFY"><span><strong><span>Parole libre</span></strong></span><span><span> : permet de libérer la circulation de la parole. Celles et ceux qui souhaitent s’exprimer le font. On utilise ce terme en cercle dans l’intention de ne pas rentrer en débat. Chacun s’exprime pour nourrir le centre, c’est à dire pour faire avancer le groupe dans le processus de décisio</span>n. </span></p> |
|
|
|
|
|
</li> |
|
|
|
|
|
</ul> |
|
|
|
|
|
<p class="ob-h3 western" align="JUSTIFY"><span>L’ÉCOUTE DU CENTRE</span></p> |
|
|
|
|
|
<p align="JUSTIFY"><span>Écouter le centre, c’est écouter attentivement ce qui émerge du groupe au-delà de l’expression de chacun de ses membres. Si l’on considère que chaque personne a sa vérité et que personne ne détient LA vérité, alors le cercle sera d’autant plus riche que chacun dispose d’une facette de la résolution de la problématique qui est au centre.</span></p> |
|
|
|
|
|
<p align="JUSTIFY"><span>L’écoute du centre invite ainsi chacun à écouter ce que l’autre a à offrir dans une posture de coopération, en lâchant son point de vue (potentiellement divergeant) sur la question et en essayant d’entrevoir en quoi ce qui est dit peut servir le sujet commun.</span></p> |
|
|
|
|
|
<p align="JUSTIFY"><span>L’écoute du centre repose sur l’implication de chacun à nourrir le centre, c’est-à-dire d’aller lors de son tour de parole, écouter « ce qui est juste » en soi, participer de façon active, précise, argumentée de sorte à éclairer, apporter de la matière à la construction commune.</span></p> |
|
|
|
|
|
<p class="ob-h4 western" align="JUSTIFY"><span>0. Préparation de la proposition</span></p> |
|
|
|
|
|
<ul> |
|
|
|
|
|
<li> |
|
|
|
|
|
<p align="JUSTIFY"><span>Écoute du centre : chacun est invité à formuler les éléments importants relatifs au point traité. Cette phase peut prendre la tournure d’une discussion ouverte, cela peut être un temps à part entière. </span></p> |
|
|
|
|
|
</li> |
|
|
|
|
|
<li> |
|
|
|
|
|
<p align="JUSTIFY"><span>Élaboration de la proposition : déterminer le sujet, la problématique, les arguments. <br>Il est conseillé de faire une proposition simple au départ, qui sera transformée par intelligence collective au travers du processus de gestion par consentement. <br>Deux possibilités sont offertes : </span></p> |
|
|
|
|
|
<ul> |
|
|
|
|
|
<li> |
|
|
|
|
|
<p align="JUSTIFY"><span>le facilitateur peut demander à une personne de formuler une proposition, </span></p> |
|
|
|
|
|
</li> |
|
|
|
|
|
<li> |
|
|
|
|
|
<p align="JUSTIFY"><span>quelques personnes peuvent constituer un groupe d’amélioration qui va plancher sur l’élaboration écrite et argumentée de la proposition. </span></p> |
|
|
|
|
|
</li> |
|
|
|
|
|
</ul> |
|
|
|
|
|
</li> |
|
|
|
|
|
<li> |
|
|
|
|
|
<p align="JUSTIFY"><span>Présentation de la proposition : une personne est « porteuse » de la proposition, une seule proposition est traitée à la fois. </span></p> |
|
|
|
|
|
</li> |
|
|
|
|
|
</ul> |
|
|
|
|
|
<p class="ob-h4 western" align="JUSTIFY"><span>1. Clarifications : est-ce clair ? Est-ce que je comprends ?</span></p> |
|
|
|
|
|
<p align="JUSTIFY"><span>Chaque participant pose des questions en vue de comprendre la proposition dans son ensemble. C’est le porteur qui répond et clarifie les éléments de la proposition. L’objectif est d’ôter tout doute ou possible interprétation erronée de la proposition, cependant le porteur ne répond pas aux « pourquoi ? ». Il ne s’agit pas à ce stade d’exprimer ce que l’on ressent vis-à-vis de la proposition (phase 2).</span></p> |
|
|
|
|
|
<p class="ob-h4 western" align="JUSTIFY"><span>2. Ressentis : en quoi la proposition vient satisfaire mes besoins, ceux du projet par rapport à l’organisation ?</span></p> |
|
|
|
|
|
<p align="JUSTIFY"><span>Chacun exprime ce que la proposition lui évoque. C’est à ce stade qu’un maximum d’informations peuvent être exposées afin de nourrir le proposeur pour lui permettre d’amender la proposition en phase 3.</span></p> |
|
|
|
|
|
<p align="JUSTIFY"><span>Le proposeur tente d’avoir une écoute large, de saisir la température globale de ce qui se dégage au centre.</span></p> |
|
|
|
|
|
<p class="ob-h4 western" align="JUSTIFY"><span>3. Amendements</span></p> |
|
|
|
|
|
<p align="JUSTIFY"><span>Le proposeur est invité, sur la base de ce qu’il a entendu, à, éventuellement :</span></p> |
|
|
|
|
|
<ul> |
|
|
|
|
|
<li> |
|
|
|
|
|
<p align="JUSTIFY"><span>Reclarifier la proposition. </span></p> |
|
|
|
|
|
</li> |
|
|
|
|
|
<li> |
|
|
|
|
|
<p align="JUSTIFY"><span>Amender la proposition : proposer des modifications (ajouts, retraits). </span></p> |
|
|
|
|
|
</li> |
|
|
|
|
|
<li> |
|
|
|
|
|
<p align="JUSTIFY"><span>Retirer la proposition s’il s’avère qu’elle n’est pas pertinente. En cas de retrait, le processus reprend à la phase 0 avec une nouvelle proposition. </span></p> |
|
|
|
|
|
</li> |
|
|
|
|
|
</ul> |
|
|
|
|
|
<p class="ob-h4 western" align="JUSTIFY"><span>4. Formuler les objections</span></p> |
|
|
|
|
|
<p align="JUSTIFY"><span>Les objections ne sont pas des préférences, des avis, d’autres propositions, c’est ce que l’on considère comme des limites pour soi et pour la mise en œuvre du projet.</span></p> |
|
|
|
|
|
<ul> |
|
|
|
|
|
<li> |
|
|
|
|
|
<p align="JUSTIFY"><span>Le facilitateur fait un tour pour savoir si les membres du groupe ont des objections. Dans un premier temps, ils sont juste invités à dire si « oui » ou « non » ils ont une objection. S’il n’y a que des « non », la proposition est adoptée, aller directement en célébration. S’il y a des objections, elles sont écoutées et traitées une à une. La formulation d’une objection n’est pas la formulation de la solution à celle-ci. Le facilitateur se centre sur l’obtention de la formulation de l’objection. Il note les objections au tableau avec le prénom de la personne qui les porte. Émettre une objection, c’est s’en défaire comme quelque chose de personnel pour en faire la richesse du groupe. Une objection est un véritable cadeau pour le groupe : elle va lui permettre d’aller plus loin en explorant des parties de la proposition encore inexplorées. </span></p> |
|
|
|
|
|
</li> |
|
|
|
|
|
<li> |
|
|
|
|
|
<p align="JUSTIFY"><span>Le facilitateur teste les objections D’abord, identifier si une objection annule la proposition. Si c’est le cas, retour en 0. Le facilitateur n’a pas le pouvoir de dire si l’objection est raisonnable ou non. Il peut seulement poser des questions afin d’aider celui qui porte l’objection à le déterminer. </span></p> |
|
|
|
|
|
</li> |
|
|
|
|
|
</ul> |
|
|
|
|
|
<p align="JUSTIFY"><span>Une objection est raisonnable si :</span></p> |
|
|
|
|
|
<ul> |
|
|
|
|
|
<li> |
|
|
|
|
|
<p align="JUSTIFY"><span>Elle invite à une bonification de la proposition par l’intelligence collective du groupe. </span></p> |
|
|
|
|
|
</li> |
|
|
|
|
|
<li> |
|
|
|
|
|
<p align="JUSTIFY"><span>Elle élimine la proposition, en la rendant impossible à réaliser (on gagne du temps en passant à une autre proposition). </span></p> |
|
|
|
|
|
</li> |
|
|
|
|
|
<li> |
|
|
|
|
|
<p align="JUSTIFY"><span>Elle est argumentée de manière claire. </span></p> |
|
|
|
|
|
</li> |
|
|
|
|
|
<li> |
|
|
|
|
|
<p align="JUSTIFY"><span>Elle n’est pas une manière détournée, consciemment ou non, d’exprimer une préférence ou une autre proposition. </span></p> |
|
|
|
|
|
</li> |
|
|
|
|
|
</ul> |
|
|
|
|
|
<p class="ob-h4 western" align="JUSTIFY"><span>5. Bonifications</span></p> |
|
|
|
|
|
<p align="JUSTIFY"><span>Le facilitateur traite les objections une par une. Les objections posées au centre sont celles du groupe. La discussion est libre, chacun peut apporter des solutions dans le but de lever l’objection traitée. Le facilitateur s’assure régulièrement de vérifier que l’objection se lève auprès de la personne qui l’a émise. Si une solution lève l’objection d’une personne, celle-ci en informe le groupe.</span></p> |
|
|
|
|
|
<p align="JUSTIFY"><span>Après un tour de levée d’objections, le facilitateur s’assure que de nouvelles ne sont pas apparues. Lorsqu’il n’y a plus d’objection, il y a consentement mutuel, la proposition est adoptée.</span></p> |
|
|
|
|
|
<p align="CENTER"><span><strong><span>On peut alors partager cette belle réussite autour d'un verre !</span></strong></span></p> |
|
|
|
|
|
</article> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<hr> |
|
|
|
|
|
|
|
|
|
|
|
<footer> |
|
|
|
|
|
<p> |
|
|
|
|
|
<a href="/david/" title="Aller à l’accueil"><svg class="icon icon-home"> |
|
|
|
|
|
<use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-home"></use> |
|
|
|
|
|
</svg> Accueil</a> • |
|
|
|
|
|
<a href="/david/log/" title="Accès au flux RSS"><svg class="icon icon-rss2"> |
|
|
|
|
|
<use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-rss2"></use> |
|
|
|
|
|
</svg> Suivre</a> • |
|
|
|
|
|
<a href="http://larlet.com" title="Go to my English profile" data-instant><svg class="icon icon-user-tie"> |
|
|
|
|
|
<use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-user-tie"></use> |
|
|
|
|
|
</svg> Pro</a> • |
|
|
|
|
|
<a href="mailto:david%40larlet.fr" title="Envoyer un courriel"><svg class="icon icon-mail"> |
|
|
|
|
|
<use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-mail"></use> |
|
|
|
|
|
</svg> Email</a> • |
|
|
|
|
|
<abbr class="nowrap" title="Hébergeur : Alwaysdata, 62 rue Tiquetonne 75002 Paris, +33184162340"><svg class="icon icon-hammer2"> |
|
|
|
|
|
<use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-hammer2"></use> |
|
|
|
|
|
</svg> Légal</abbr> |
|
|
|
|
|
</p> |
|
|
|
|
|
<template id="theme-selector"> |
|
|
|
|
|
<form> |
|
|
|
|
|
<fieldset> |
|
|
|
|
|
<legend><svg class="icon icon-brightness-contrast"> |
|
|
|
|
|
<use xlink:href="/static/david/icons2/symbol-defs-2021-12.svg#icon-brightness-contrast"></use> |
|
|
|
|
|
</svg> Thème</legend> |
|
|
|
|
|
<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> |
|
|
|
|
|
</fieldset> |
|
|
|
|
|
</form> |
|
|
|
|
|
</template> |
|
|
|
|
|
</footer> |
|
|
|
|
|
<script src="/static/david/js/instantpage-5.1.0.min.js" type="module"></script> |
|
|
|
|
|
<script> |
|
|
|
|
|
function loadThemeForm(templateName) { |
|
|
|
|
|
const themeSelectorTemplate = document.querySelector(templateName) |
|
|
|
|
|
const form = themeSelectorTemplate.content.firstElementChild |
|
|
|
|
|
themeSelectorTemplate.replaceWith(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 hasDarkRules = false |
|
|
|
|
|
for (const styleSheet of Array.from(document.styleSheets)) { |
|
|
|
|
|
let mediaRules = [] |
|
|
|
|
|
for (const cssRule of styleSheet.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) { |
|
|
|
|
|
styleSheet.insertRule(mediaRule.cssText) |
|
|
|
|
|
hasDarkRules = true |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
|
|
|
if (hasDarkRules) { |
|
|
|
|
|
loadThemeForm('#theme-selector') |
|
|
|
|
|
} |
|
|
|
|
|
}) |
|
|
|
|
|
</script> |
|
|
|
|
|
</body> |
|
|
|
|
|
</html> |
