Je coudifie, au cas où j'en aurais besoin...

• Installer Windows 11 sur un ancien ordinateur (même si Microsoft dit non)
• Installer Windows 11 sans compte Microsoft
• Créer une image allégée de Windows 11 (pour les SSD de petite capacité)
• Installer une ISO propre de Windows 11
• Éliminer le filigrane “PC incompatible”
• Maîtrisez Windows 11 avec Bloatynosy NUE
• SuperMSConfig : Pour les perfectionnistes du contrôle
• Éliminez les publicités de Windows 11 avec OFGB
• Nanazip : Le clone moderne de 7zip
• Microsoft Auto SR : L’upscaling DLSS/FSR natif dans Windows 11

etc

C'est dingue la quantité de logiciels à manipuler pour avoir un windows se comporte simplement comme un linux

<link rel="stylesheet" href="http://www.warriordudimanche.net/./plugins/Galart/style.css"/> <link rel="stylesheet" href="http://www.warriordudimanche.net/./plugins/Galart/assets/lightbox.css"/> <script src="http://www.warriordudimanche.net/./plugins/Galart/assets/lightbox.js"> <script>[].forEach.call(document.querySelectorAll("[lightbox]"), function(el) { el.lightbox = new Lightbox(el);});

---

► Commentaires

Comment faire un placeholder d'image en la remplaçant par une version floue mais en CSS ? Et sans coller du css inline qui vient te pourrir tes pages ?

En gros, d'après ce que j'ai compris, il utilise les fonctions natives de calcul de CSS pour décomposer un entier en une série de bits contenant les couleurs de la future image. Ensuite, il suffit de préciser l'entier dans une variable CSS pour que le placeholder soit calculé.

<img class="media force-my-lqip" src="./media/a6438820.henry-co-3JFVNo4ukKQ-unsplash.jpg" data-original-source="http://www.warriordudimanche.net/gallery/henry-co-3JFVNo4ukKQ-unsplash.jpg" loading="lazy" width="300" height="200" style="--my-lqip:174708;--lqip:174708">

[style*="--lqip:"] {
--lqip-ca: mod(round(down, calc((var(--lqip) + pow(2, 19)) / pow(2, 18))), 4);
--lqip-cb: mod(round(down, calc((var(--lqip) + pow(2, 19)) / pow(2, 16))), 4);
--lqip-cc: mod(round(down, calc((var(--lqip) + pow(2, 19)) / pow(2, 14))), 4);
--lqip-cd: mod(round(down, calc((var(--lqip) + pow(2, 19)) / pow(2, 12))), 4);
--lqip-ce: mod(round(down, calc((var(--lqip) + pow(2, 19)) / pow(2, 10))), 4);
--lqip-cf: mod(round(down, calc((var(--lqip) + pow(2, 19)) / pow(2, 8))), 4);
--lqip-ll: mod(round(down, calc((var(--lqip) + pow(2, 19)) / pow(2, 6))), 4);
--lqip-aaa: mod(round(down, calc((var(--lqip) + pow(2, 19)) / pow(2, 3))), 8);
--lqip-bbb: mod(calc(var(--lqip) + pow(2, 19)), 8);
--lqip-ca-clr: hsl(0 0% calc(var(--lqip-ca) / 3 * 60% + 20%));
--lqip-cb-clr: hsl(0 0% calc(var(--lqip-cb) / 3 * 60% + 20%));
--lqip-cc-clr: hsl(0 0% calc(var(--lqip-cc) / 3 * 60% + 20%));
--lqip-cd-clr: hsl(0 0% calc(var(--lqip-cd) / 3 * 60% + 20%));
--lqip-ce-clr: hsl(0 0% calc(var(--lqip-ce) / 3 * 60% + 20%));
--lqip-cf-clr: hsl(0 0% calc(var(--lqip-cf) / 3 * 60% + 20%));
--lqip-base-clr: oklab(
  calc(var(--lqip-ll) / 3 * 0.6 + 0.2)
  calc(var(--lqip-aaa) / 8 * 0.7 - 0.35)
  calc((var(--lqip-bbb) + 1) / 8 * 0.7 - 0.35)
);
}

ça semble très intéressant, astucieux, élégant, léger et indépendant du JS.

L'article regorge de démos et d'explications.

<link rel="stylesheet" href="http://www.warriordudimanche.net/./plugins/Galart/style.css"/> <link rel="stylesheet" href="http://www.warriordudimanche.net/./plugins/Galart/assets/lightbox.css"/> <script src="http://www.warriordudimanche.net/./plugins/Galart/assets/lightbox.js"> <script>[].forEach.call(document.querySelectorAll("[lightbox]"), function(el) { el.lightbox = new Lightbox(el);});

---

► Commentaires

Une lib pour transformer le HTML rendu en une image: ça a l'air plus rapide et efficace que html2canvas. Faut que je teste pour voir si je m'embête à changer...

<link rel="stylesheet" href="http://www.warriordudimanche.net/./plugins/Galart/style.css"/> <link rel="stylesheet" href="http://www.warriordudimanche.net/./plugins/Galart/assets/lightbox.css"/> <script src="http://www.warriordudimanche.net/./plugins/Galart/assets/lightbox.js"> <script>[].forEach.call(document.querySelectorAll("[lightbox]"), function(el) { el.lightbox = new Lightbox(el);});

---

► Commentaires

Rigolo ça... voire mê peut-être utile...

Afficher des accords comme sur les sites de guitare en pur CSS.

<fret-board frets="4" strings="6" chord="C Major">
  <string-note string="6" mute></string-note>
  <string-note string="5" fret="3" finger="3"></string-note>
  <string-note string="4" fret="2" finger="2"></string-note>
  <string-note string="3" open></string-note>
  <string-note string="2" fret="1" finger="1"></string-note>
  <string-note string="1" open></string-note>
</fret-board>

devient

Le CSS est fourni et se configure avec des variables CSS claires.

On peut faire des barrés et tout... C'est juste beau.

<link rel="stylesheet" href="http://www.warriordudimanche.net/./plugins/Galart/style.css"/> <link rel="stylesheet" href="http://www.warriordudimanche.net/./plugins/Galart/assets/lightbox.css"/> <script src="http://www.warriordudimanche.net/./plugins/Galart/assets/lightbox.js"> <script>[].forEach.call(document.querySelectorAll("[lightbox]"), function(el) { el.lightbox = new Lightbox(el);});

---

► Commentaires

J'adore linux... il y a toujours une solution.

Je devais recadrer les captures de livre de maths effectuées ia le crtl maj S de firefox afin de ne garder que les pages elles-mêmes. Ben imageMagick fait ça en une seule commande...

En gros, on installe le bouzin si pas encore fait

sudo apt install graphicsmagick-imagemagick-compat

Puis la commande mogrify fait le Job (c'est convert mais par lot)

mogrify -crop 2420x1700+670+100 *.png

En gros c'est mogrify -crop LARGEURxHAUTEUR+X+Y *.png

<link rel="stylesheet" href="http://www.warriordudimanche.net/./plugins/Galart/style.css"/> <link rel="stylesheet" href="http://www.warriordudimanche.net/./plugins/Galart/assets/lightbox.css"/> <script src="http://www.warriordudimanche.net/./plugins/Galart/assets/lightbox.js"> <script>[].forEach.call(document.querySelectorAll("[lightbox]"), function(el) { el.lightbox = new Lightbox(el);});

---

► Commentaires