https://wiki.nefald.fr/index.php?action=history&feed=atom&title=Mod%C3%A8le%3ARecherche%2Fstyles.css 2026-04-28T19:36:46Z Historique des versions pour cette page sur le wiki MediaWiki 1.43.6 https://wiki.nefald.fr/index.php?title=Mod%C3%A8le:Recherche/styles.css&diff=5665&oldid=prev 2026-03-11T15:48:43Z

<p>sticky</p> <table style="background-color: #fff; color: #202122;" data-mw="interface"> <col class="diff-marker" /> <col class="diff-content" /> <col class="diff-marker" /> <col class="diff-content" /> <tr class="diff-title" lang="fr"> <td colspan="2" style="background-color: #fff; color: #202122; text-align: center;">← Version précédente</td> <td colspan="2" style="background-color: #fff; color: #202122; text-align: center;">Version du 11 mars 2026 à 15:48</td> </tr><tr><td colspan="2" class="diff-lineno" id="mw-diff-left-l138">Ligne 138 :</td> <td colspan="2" class="diff-lineno">Ligne 138 :</td></tr> <tr><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>max-width: 100%;</div></td><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>max-width: 100%;</div></td></tr> <tr><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>}</div></td><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>}</div></td></tr> <tr><td colspan="2" class="diff-side-deleted"></td><td class="diff-marker" data-marker="+"></td><td style="color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div><ins style="font-weight: bold; text-decoration: none;">}</ins></div></td></tr> <tr><td colspan="2" class="diff-side-deleted"></td><td class="diff-marker" data-marker="+"></td><td style="color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div><ins style="font-weight: bold; text-decoration: none;"></ins></div></td></tr> <tr><td colspan="2" class="diff-side-deleted"></td><td class="diff-marker" data-marker="+"></td><td style="color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div><ins style="font-weight: bold; text-decoration: none;">.nefald-page-search-container {</ins></div></td></tr> <tr><td colspan="2" class="diff-side-deleted"></td><td class="diff-marker" data-marker="+"></td><td style="color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div><ins style="font-weight: bold; text-decoration: none;">display: flex;</ins></div></td></tr> <tr><td colspan="2" class="diff-side-deleted"></td><td class="diff-marker" data-marker="+"></td><td style="color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div><ins style="font-weight: bold; text-decoration: none;">width: 100%;</ins></div></td></tr> <tr><td colspan="2" class="diff-side-deleted"></td><td class="diff-marker" data-marker="+"></td><td style="color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div><ins style="font-weight: bold; text-decoration: none;">position: sticky;</ins></div></td></tr> <tr><td colspan="2" class="diff-side-deleted"></td><td class="diff-marker" data-marker="+"></td><td style="color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div><ins style="font-weight: bold; text-decoration: none;">top: var(--header-size, 56px);</ins></div></td></tr> <tr><td colspan="2" class="diff-side-deleted"></td><td class="diff-marker" data-marker="+"></td><td style="color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div><ins style="font-weight: bold; text-decoration: none;">z-index: 10;</ins></div></td></tr> <tr><td colspan="2" class="diff-side-deleted"></td><td class="diff-marker" data-marker="+"></td><td style="color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div><ins style="font-weight: bold; text-decoration: none;">background-color: var(--color-surface-0);</ins></div></td></tr> <tr><td colspan="2" class="diff-side-deleted"></td><td class="diff-marker" data-marker="+"></td><td style="color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #a3d3ff; vertical-align: top; white-space: pre-wrap;"><div><ins style="font-weight: bold; text-decoration: none;">padding-block: var(--space-xs, 8px);</ins></div></td></tr> <tr><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>}</div></td><td class="diff-marker"></td><td style="background-color: #f8f9fa; color: #202122; font-size: 88%; border-style: solid; border-width: 1px 1px 1px 4px; border-radius: 0.33em; border-color: #eaecf0; vertical-align: top; white-space: pre-wrap;"><div>}</div></td></tr> </table>

Hiob https://wiki.nefald.fr/index.php?title=Mod%C3%A8le:Recherche/styles.css&diff=5662&oldid=prev 2026-03-11T15:42:20Z

<p>Page créée avec « <span class="autocomment">============================================================ * Modèle:Recherche/styles.css * ============================================================ : </span> .nefald-page-search { display: flex; align-items: center; gap: var(--space-xs); padding: var(--space-xs) var(--space-sm); background-color: var(--color-surface-1); border: 1px solid var(--border-color-base); border-radius: var(--border-radius-base); max-width: 480px; transition: border-color 0.2s ease,... »</p> <p><b>Nouvelle page</b></p><div>/* ============================================================<br /> * Modèle:Recherche/styles.css<br /> * ============================================================ */<br /> <br /> .nefald-page-search {<br /> display: flex;<br /> align-items: center;<br /> gap: var(--space-xs);<br /> padding: var(--space-xs) var(--space-sm);<br /> background-color: var(--color-surface-1);<br /> border: 1px solid var(--border-color-base);<br /> border-radius: var(--border-radius-base);<br /> max-width: 480px;<br /> transition: border-color 0.2s ease, box-shadow 0.2s ease;<br /> }<br /> <br /> .nefald-page-search__icon {<br /> font-size: 1rem;<br /> color: var(--color-subtle);<br /> flex-shrink: 0;<br /> user-select: none;<br /> }<br /> <br /> .nefald-page-search__input {<br /> flex: 1;<br /> border: none;<br /> background: transparent;<br /> color: var(--color-base);<br /> font-size: var(--font-size-small);<br /> font-family: var(--font-family-citizen-base);<br /> outline: none;<br /> min-width: 0;<br /> }<br /> <br /> .nefald-page-search__counter {<br /> font-size: var(--font-size-x-small);<br /> color: var(--color-subtle);<br /> white-space: nowrap;<br /> flex-shrink: 0;<br /> min-width: 5ch;<br /> text-align: center;<br /> }<br /> <br /> .nefald-page-search__prev,<br /> .nefald-page-search__next,<br /> .nefald-page-search__clear {<br /> display: flex;<br /> align-items: center;<br /> justify-content: center;<br /> flex-shrink: 0;<br /> width: 24px;<br /> height: 24px;<br /> padding: 0;<br /> border: none;<br /> border-radius: var(--border-radius-base);<br /> background: transparent;<br /> color: var(--color-subtle);<br /> cursor: pointer;<br /> font-size: 0.75rem;<br /> transition: background-color 0.15s ease, color 0.15s ease;<br /> }<br /> <br /> .nefald-page-search__prev:hover,<br /> .nefald-page-search__next:hover,<br /> .nefald-page-search__clear:hover {<br /> background-color: var(--color-surface-2);<br /> color: var(--color-base);<br /> }<br /> <br /> .nefald-page-search__prev:active,<br /> .nefald-page-search__next:active,<br /> .nefald-page-search__clear:active {<br /> background-color: var(--color-surface-3);<br /> }<br /> <br /> /* --- Surlignage --- */<br /> <br /> .nefald-highlight {<br /> background-color: oklch(90% 0.18 85);<br /> color: oklch(25% 0.08 75);<br /> border-radius: 2px;<br /> padding: 0 2px;<br /> }<br /> <br /> .nefald-highlight--active {<br /> background-color: oklch(78% 0.20 60);<br /> color: oklch(20% 0.10 55);<br /> outline: 2px solid oklch(65% 0.22 55);<br /> outline-offset: 1px;<br /> }<br /> <br /> /* Surlignage des résultats */<br /> mark.nefald-search-highlight {<br /> background-color: var(--nefald-warning-bg);<br /> color: var(--nefald-warning-text);<br /> border-bottom: 2px solid var(--nefald-warning-border);<br /> padding: 1px 2px;<br /> border-radius: 2px;<br /> transition: background-color 0.2s ease;<br /> }<br /> <br /> /* Résultat actif / courant */<br /> mark.nefald-search-highlight--active {<br /> background-color: var(--nefald-info-bg);<br /> color: var(--nefald-info-text);<br /> border-bottom-color: var(--nefald-info-border);<br /> outline: 2px solid var(--nefald-info-border);<br /> outline-offset: 1px;<br /> }<br /> <br /> /* Conteneur */<br /> .nefald-page-search-container {<br /> display: flex;<br /> width: 100%;<br /> }<br /> <br /> .nefald-page-search--left {<br /> justify-content: flex-start;<br /> }<br /> <br /> .nefald-page-search--center {<br /> justify-content: center;<br /> }<br /> <br /> .nefald-page-search--right {<br /> justify-content: flex-end;<br /> }<br /> <br /> /* Le widget lui-même prend toute la place disponible avec un max */<br /> .nefald-page-search {<br /> width: 100%;<br /> max-width: 600px;<br /> }<br /> <br /> /* Mobile : toujours pleine largeur */<br /> @media (max-width: 720px) {<br /> .nefald-page-search {<br /> max-width: 100%;<br /> }<br /> }</div>

Hiob