bookmarklet: adapte la procédure pour les HUG

- Adapte la procédure pour les HUG, maintenant que le problème de
  redirection dans leur réseau a été résolu.
- Ajoute un avertissement sur le fait que ça peut ne pas fonctionner
  partout.

Co-Authored-by: iGor milhit <igor@milhit.ch>

bookmarklet.md

@@ -1,5 +1,5 @@
 ---
-title: Bookmarklet OpenAthens pour l'UNIGE
+title: Bookmarklet OpenAthens pour l'UNIGE et les HUG
 creation_date: 2025-08-08T09:55:05+0200
 date: Automne 2025
 id: 20250808095505
@@ -17,15 +17,21 @@ logo:
 ## Description
 
 Un *bookmarklet* est un signet (marqueur, favori ou *bookmark*) ajouté au
-navigateur web (Firefox, Safari ou Chrome). Une fois configuré, le
+navigateur web (Firefox, Safari, Chrome, etc.). Une fois configuré, le
 *bookmarklet* proposé ici permet de faciliter et d'accélérer l'authentification
 avec OpenAthens pour accéder aux publications scientifiques faisant l'objet
 d'un abonnement ou d'une licence pour la Bibliothèque de l'UNIGE.
 
 Cette authentification est devenue nécessaire pour la consultation de ces
-contenus depuis les HUG. Malheureusement, actuellement, le *bookmarklet* ne
-fonctionne pas comme attendu depuis le réseau des HUG. Mais il reste utile pour
-toutes les autres situations (à la maison, en déplacement, etc.)
+contenus depuis les HUG.
+
+:::{.warning}
+
+Le fonctionnement du *bookmarklet* dépend en partie de la manière dont
+l'éditeur ou le service implémente OpenAthens. Il se peut que pour certaines
+revues il ne se comporte pas comme attendu.
+
+:::
 
 ## Configuration {.newpage}
 

style.css

@@ -85,7 +85,7 @@
         margin: 2em auto 1em auto;
     }
     .logo img {
-        max-width: 50%;
+        max-width: 25%;
         padding: .5em;
     }
 
@@ -207,13 +207,28 @@
         content: "Figure " counter(figureNumber) " : ";
     }
 
-    .exercise {
+    .exercise,
+    .warning {
         background-color: #f2f1f1;
         width: 90%;
         margin: 0 auto;
         border: 2px solid #d80669;
         border-radius: .5em;
-        padding: 0 .5em;
+        padding: .5em;
+        display: flex;
+        align-items: center;
+    }
+
+    .exercice > p,
+    .warning > p {
+        margin: 0;
+        padding-left: .5em;
+    }
+
+    .exercice::before,
+    .warning::before {
+        content: "⚠️";
+        font-size: larger;
     }
 
     blockquote {