All pages now php. nav now can use show which page is active.

This commit is contained in:
2026-08-16 20:52:13 -05:00
parent d2b52f7a42
commit 02a800232c
5 changed files with 69 additions and 57 deletions
+64
View File
@@ -0,0 +1,64 @@
<?php
$current = basename($_SERVER['PHP_SELF']);
$menu_items = [
'index.php' => ['Home', 'logo.png'],
'alchemyIngredientPage.php' => ['Alchemy', 'alchemy.png'],
'blacksmithing.php' => ['Blacksmithing', 'blacksmithing.png'],
'engineering.php' => ['Engineering', 'engineering.png'],
'jewelcrafting.php' => ['Jewelcrafting', 'jewelcrafting.png'],
'leatherworking.php' => ['Leatherworking', 'leatherworking.png'],
'tailoring.php' => ['Tailoring', 'tailoring.png'],
];
?>
<header class="site-header">
<nav class="navbar" aria-label="Profession Navigation">
<ul class="navbar__list">
<?php foreach ($menu_items as $file => $info): ?>
<?php
$is_active = ($current === $file) ? ' navbar__link--active' : '';
?>
<li class="navbar__item">
<a href="<?= $file ?>" class="navbar__link<?= $is_active ?>">
<img src="img/<?= $info[1] ?>" alt="<?= $info[0] ?>" class="navbar__icon">
</a>
</li>
<?php endforeach; ?>
<!--<li class="navbar__item">
<a href="index.php" class="navbar__link">
<img src="img/logo.png" alt="Company Name Home" class="navbar__icon">
</a>
</li>
<li class="navbar__item">
<a href="alchemyIngredientPage.php" class="navbar__link">
<img src="img/alchemy.png" alt="Alchemy" class="navbar__icon">
</a>
</li>
<li class="navbar__item">
<a href="" class="navbar__link">
<img src="img/blacksmithing.png" alt="Blacksmithing" class="navbar__icon">
</a>
</li>
<li class="navbar__item">
<a href="" class="navbar__link">
<img src="img/engineering.png" alt="Engineering" class="navbar__icon">
</a>
</li>
<li class="navbar__item">
<a href="" class="navbar__link">
<img src="img/jewelcrafting.png" alt="Jewelcrafting" class="navbar__icon">
</a>
</li>
<li class="navbar__item">
<a href="" class="navbar__link">
<img src="img/leatherworking.png" alt="Leatherworking" class="navbar__icon">
</a>
</li>
<li class="navbar__item">
<a href="" class="navbar__link">
<img src="img/tailoring.png" alt="Tailoring" class="navbar__icon">
</a>
</li> -->
</ul>
</nav>
</header>