Optimized Navigation Bar, Have Yet To Make Sidebar Work.
This commit is contained in:
+19
-41
@@ -1,5 +1,7 @@
|
|||||||
<?php
|
<?php
|
||||||
$current = basename($_SERVER['SCRIPT_NAME']);
|
$current_file = basename($_SERVER['SCRIPT_NAME']); // Extracts File Name ONLY, Not File Path
|
||||||
|
|
||||||
|
/* Navigation Bar Pages, 'fileName' => ['Page Name', 'pageIcon'] */
|
||||||
$menu_items = [
|
$menu_items = [
|
||||||
'index.php' => ['Home', 'logo.png'],
|
'index.php' => ['Home', 'logo.png'],
|
||||||
'alchemyIngredientPage.php' => ['Alchemy', 'alchemy.png'],
|
'alchemyIngredientPage.php' => ['Alchemy', 'alchemy.png'],
|
||||||
@@ -17,51 +19,27 @@ $menu_items = [
|
|||||||
</button>
|
</button>
|
||||||
<nav class="navbar" aria-label="Profession Navigation">
|
<nav class="navbar" aria-label="Profession Navigation">
|
||||||
<ul class="navbar__list">
|
<ul class="navbar__list">
|
||||||
<?php foreach ($menu_items as $file => $info): ?>
|
<!-- Finds & Sets Active Profession Page -->
|
||||||
<?php
|
<?php foreach ($menu_items as $file => $info):
|
||||||
$is_active = ($current === $file) ? ' navbar__link--active' : '';
|
$root_file_name = pathinfo($file, PATHINFO_FILENAME); // Extracts File Name ONLY, Not File Path
|
||||||
|
|
||||||
|
$is_current = (str_starts_with($current_file, $root_file_name));
|
||||||
|
$is_active = $is_current ? ' navbar__link--active' : '';
|
||||||
|
|
||||||
|
if ($is_current) {
|
||||||
|
$active_profession = $root_file_name; // File Name, e.g., 'alchemyIngredientPage' or 'blacksmithing'
|
||||||
|
$active_profession_title = $info[0]; // Page Name, e.g., 'Alchemy' or 'Blacksmithing'
|
||||||
|
}
|
||||||
?>
|
?>
|
||||||
<li class="navbar__item">
|
<li class="navbar__item">
|
||||||
<a href="<?= $file ?>" class="navbar__link<?= $is_active ?>">
|
<a href="<?php echo $file; ?>" class="navbar__link<?php echo $is_active ?>">
|
||||||
<img src="img/<?= $info[1] ?>" alt="<?= $info[0] ?>" class="navbar__icon">
|
<img src="img/<?php echo $info[1]; ?>" alt="<?php echo $info[0] ?>"
|
||||||
|
class="navbar__icon">
|
||||||
</a>
|
</a>
|
||||||
</li>
|
</li>
|
||||||
<?php endforeach; ?>
|
<?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>
|
</ul>
|
||||||
</nav>
|
</nav>
|
||||||
</header>
|
</header>
|
||||||
|
|
||||||
|
<script src="sidebar.js"></script>
|
||||||
Reference in New Issue
Block a user