Files
folio/templates/wizard/nav.php
2026-05-14 21:48:33 +02:00

37 lines
2.0 KiB
PHP
Raw Permalink Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<?php
// Attendu : $step (int), $totalSteps (int), $mode ('create'|'edit'), $uuid (string)
$_wizLabels = $mode === 'create'
? ['Contenu', 'Publication', 'Catégorie', 'Tags', 'SEO & Validation']
: ['Contenu', 'Publication', 'Catégorie', 'Tags', 'SEO', 'Diff & Validation'];
$_base = $mode === 'create' ? '/new/' . rawurlencode($uuid ?? '') : '/edit/' . rawurlencode($uuid ?? '');
?>
<nav class="wizard-nav mb-4">
<div class="d-flex align-items-center gap-1 flex-wrap">
<?php foreach ($_wizLabels as $_wi => $_wl):
$_wn = $_wi + 1;
$_wActive = ($_wn === $step);
$_wDone = ($_wn < $step);
$_wHref = ($_wDone && ($uuid ?? '') !== '') ? htmlspecialchars($_base . '/' . $_wn) : null;
?>
<?php if ($_wi > 0): ?>
<span class="wizard-sep text-muted px-1"></span>
<?php endif; ?>
<div class="wizard-step<?= $_wActive ? ' wz-active' : ($_wDone ? ' wz-done' : ' wz-upcoming') ?>">
<?php if ($_wHref): ?><a href="<?= $_wHref ?>" class="wz-link"><?php endif; ?>
<span class="wz-num"><?= $_wDone ? '✓' : $_wn ?></span>
<span class="wz-label d-none d-sm-inline"><?= htmlspecialchars($_wl) ?></span>
<?php if ($_wHref): ?></a><?php endif; ?>
</div>
<?php endforeach; ?>
</div>
</nav>
<style>
.wizard-nav{border-bottom:1px solid var(--bs-border-color,#dee2e6);padding-bottom:.75rem}
.wizard-step{display:inline-flex;align-items:center;gap:.3rem;padding:.25rem .5rem;border-radius:.4rem;font-size:.85rem}
.wz-active{background:#0d6efd;color:#fff;font-weight:600}
.wz-done{color:#198754}.wz-done .wz-link{color:#198754;text-decoration:none}
.wz-upcoming{color:var(--bs-secondary-color,#6c757d)}
.wz-num{display:inline-flex;align-items:center;justify-content:center;width:1.4rem;height:1.4rem;border-radius:50%;border:1.5px solid currentColor;font-size:.75rem;flex-shrink:0}
.wz-active .wz-num{border-color:#fff}
</style>