Migrate all <img>-based icons to inline SVG via PHP helper

Replace every <img src="/assets/icons/..."> with <?= icon('name') ?>
across 26 template files. The PHP helper inlines the SVG markup into the
DOM so CSS color cascades naturally through fill="currentColor".

- Add src/icon.php helper: reads SVG file, sets width/height to 1em,
  injects aria-hidden, supports optional CSS class
- Fix 12 icon SVGs that had hardcoded fill="#000000" or missing fill attr
- Replace search.svg with Phosphor fill-based magnifying glass
- Add explicit SVG sizes for admin header nav icons (16px/20px)
- Scope public search icon CSS to form[role=search]:not(.header-search-form)
  to avoid breaking admin header layout; change stroke to fill
- Remove <img> filter: brightness(0) invert(1) hacks from admin.css
This commit is contained in:
Pontoporeia
2026-06-21 17:23:37 +02:00
parent b1774e6e97
commit dfde88eaa5
42 changed files with 166 additions and 108 deletions

View File

@@ -100,7 +100,7 @@ $websiteLabel = htmlspecialchars($_POST['website_label'] ?? '');
hx-swap="innerHTML"
hx-trigger="click"
onclick="document.getElementById('relink-modal').showModal(); window.__xamxamRelinkCtx = { queueType: 'cover', thesisId: '<?= htmlspecialchars((string)($thesisId ?? $_GET['id'] ?? '')) ?>' };">
<img src="/assets/icons/magic-wand.svg" width="16" height="16" alt="" aria-hidden="true" style="vertical-align:-2px;margin-right:var(--space-3xs)"> Relier un fichier existant
<?= icon('magic-wand') ?> Relier un fichier existant
</button>
<?php endif; ?>
</div>
@@ -128,7 +128,7 @@ $websiteLabel = htmlspecialchars($_POST['website_label'] ?? '');
hx-swap="innerHTML"
hx-trigger="click"
onclick="document.getElementById('relink-modal').showModal(); window.__xamxamRelinkCtx = { queueType: 'note_intention', thesisId: '<?= htmlspecialchars((string)($thesisId ?? $_GET['id'] ?? '')) ?>' };">
<img src="/assets/icons/magic-wand.svg" width="16" height="16" alt="" aria-hidden="true" style="vertical-align:-2px;margin-right:var(--space-3xs)"> Relier un fichier existant
<?= icon('magic-wand') ?> Relier un fichier existant
</button>
<?php endif; ?>
</div>
@@ -166,7 +166,7 @@ $websiteLabel = htmlspecialchars($_POST['website_label'] ?? '');
hx-swap="innerHTML"
hx-trigger="click"
onclick="document.getElementById('relink-modal').showModal(); window.__xamxamRelinkCtx = { queueType: 'tfe', thesisId: '<?= htmlspecialchars((string)($thesisId ?? $_GET['id'] ?? '')) ?>' };">
<img src="/assets/icons/magic-wand.svg" width="16" height="16" alt="" aria-hidden="true" style="vertical-align:-2px;margin-right:var(--space-3xs)"> Relier un fichier existant
<?= icon('magic-wand') ?> Relier un fichier existant
</button>
<?php if ($peerTubeEnabled): ?>
<button type="button" class="btn btn--sm btn--ghost peertube-browser-trigger"
@@ -177,7 +177,7 @@ $websiteLabel = htmlspecialchars($_POST['website_label'] ?? '');
hx-trigger="click"
onclick="document.getElementById('peertube-relink-modal').showModal(); window.__xamxamPeertubeRelinkCtx = { thesisId: '<?= htmlspecialchars((string)($thesisId ?? $_GET['id'] ?? '')) ?>' };"
>
<img src="/assets/icons/magic-wand.svg" width="16" height="16" alt="" aria-hidden="true" style="vertical-align:-2px;margin-right:var(--space-3xs)"> Relier une vidéo PeerTube
<?= icon('magic-wand') ?> Relier une vidéo PeerTube
</button>
<?php endif; ?>
<?php endif; ?>
@@ -207,7 +207,7 @@ $websiteLabel = htmlspecialchars($_POST['website_label'] ?? '');
hx-swap="innerHTML"
hx-trigger="click"
onclick="document.getElementById('relink-modal').showModal(); window.__xamxamRelinkCtx = { queueType: 'annexe', thesisId: '<?= htmlspecialchars((string)($thesisId ?? $_GET['id'] ?? '')) ?>' };">
<img src="/assets/icons/magic-wand.svg" width="16" height="16" alt="" aria-hidden="true" style="vertical-align:-2px;margin-right:var(--space-3xs)"> Relier un fichier existant
<?= icon('magic-wand') ?> Relier un fichier existant
</button>
<?php endif; ?>
</div>

View File

@@ -65,7 +65,7 @@ $adminMode = $adminMode ?? false;
<br>
</label>
<details class="licence-details">
<summary class="licence-summary"> <img src="/assets/icons/circle-i.svg" width="1rem" height="16" alt="" aria-hidden="true"> Info</summary>
<summary class="licence-summary"> <?= icon('circle-i') ?> Info</summary>
<p>
Mon TFE est en libre accès à tout le monde sur la plateforme des TFE ainsi que dans la bibliothèque de l'erg. Je suis conscient des responsabilités et obligations légales qui viennent avec une diffusion externe et acquiesce avoir lu la documentation prévue à cet effet par l'erg, ainsi qu'avoir discuté des enjeux d'une publication avec l'équipe pédagogique. J'accepte de partager mes droits de diffusion avec l'erg, ce uniquement dans le cadre d'une diffusion sur la plateforme xamxam.
</p>
@@ -86,7 +86,7 @@ $adminMode = $adminMode ?? false;
</label>
<br>
<details class="licence-details">
<summary class="licence-summary"> <img src="/assets/icons/circle-i.svg" width="1rem" height="16" alt="" aria-hidden="true"> Info</summary>
<summary class="licence-summary"> <?= icon('circle-i') ?> Info</summary>
<p>
Mon TFE et ma note d'intention ne sont accessibles que sur place en physique ainsi que sur la plateforme xamxam par la communauté erg. Une note descriptive est disponible sur le site à toustes. J'autorise une (ré-)utilisation et diffusion dans un contexte académique et didactique au sein de l'erg.
</p>
@@ -109,7 +109,7 @@ $adminMode = $adminMode ?? false;
</label>
<br>
<details class="licence-details">
<summary class="licence-summary"> <img src="/assets/icons/circle-i.svg" width="1rem" height="16" alt="" aria-hidden="true"> Info</summary>
<summary class="licence-summary"> <?= icon('circle-i') ?> Info</summary>
<p>
Mon TFE n'est pas disponible en physique ni sur le site. Une note descriptive est disponible sur le site.
</p>

View File

@@ -45,7 +45,7 @@ $langCount = count($selectedLanguages);
<input type="hidden" name="<?= htmlspecialchars($name) ?>[]" value="<?= htmlspecialchars($lang['name']) ?>">
<span class="tag-pill-name"><?= htmlspecialchars($lang['name']) ?></span>
<button type="button" class="tag-pill-remove" title="Retirer «&nbsp;<?= htmlspecialchars($lang['name']) ?>&nbsp;»" aria-label="Retirer <?= htmlspecialchars($lang['name']) ?>">
<img src="/assets/icons/trash-slash.svg" width="16" height="16" alt="" aria-hidden="true">
<?= icon('trash-slash') ?>
</button>
</span>
<?php endforeach; ?>

View File

@@ -48,7 +48,7 @@ $belowMin = $required && $tagCount < $minTags;
<input type="hidden" name="<?= htmlspecialchars($name) ?>[]" value="<?= htmlspecialchars($tag['name']) ?>">
<span class="tag-pill-name"><?= htmlspecialchars($tag['name']) ?></span>
<button type="button" class="tag-pill-remove" title="Retirer «&nbsp;<?= htmlspecialchars($tag['name']) ?>&nbsp;»" aria-label="Retirer <?= htmlspecialchars($tag['name']) ?>">
<img src="/assets/icons/trash-slash.svg" width="16" height="16" alt="" aria-hidden="true">
<?= icon('trash-slash') ?>
</button>
</span>
<?php endforeach; ?>