Refactored nav page to reduce code duplication.

This commit is contained in:
Thalita
2021-08-20 11:38:55 +01:00
parent fe30bd87e5
commit 073be7ee4b

View File

@@ -1,82 +1,58 @@
<%#
TV 20/08/21 - Quick refactor to cut down on code duplication. Can (and should) be refactored further.
This is part of a bootstrap template which can be accessed at: https://getbootstrap.com/docs/4.0/components/navbar/
This file is fairly repetitave, this reason for this is, te ruby code tests what the $page title is set to,
this in turn then uses the navbar with the corresponding page title. This is so when a user is on a page the
page is highlighted in the navbar. This uses the nav-item active and the span current which can be seen below.
%>
<% if $page_title.eql? "Home"%>
<nav class="navbar navbar-expand-lg navbar-light">
<a class="navbar-brand" href="#"> <%= @business_name %> </a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav">
<li class="nav-item active">
<a class="nav-link" href="index.php">Home <span class="sr-only">(current)</span></a>
</li>
<li class="nav-item">
<a class="nav-link" href="information.php">About</a>
</li>
<li class="nav-item">
<a class="nav-link" href="login.php">Log-in</a>
</li>
</ul>
</div>
</nav>
<% elsif $page_title.eql? "Information" %>
<nav class="navbar navbar-expand-lg navbar-light">
<a class="navbar-brand" href="#"> <%= @business_name %> </a>
<a class="navbar-brand" href="#"> <%= @business_name %> </a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav">
<li class="nav-item">
<a class="nav-link" href="index.php">Home</a>
</li>
<li class="nav-item active">
<a class="nav-link" href="information.php">About <span class="sr-only">(current)</span></a>
</li>
<li class="nav-item">
<a class="nav-link" href="login.php">Log-in</a>
</li>
</ul>
</div>
</nav>
<% elsif $page_title.eql? "User-Portal"%>
<nav class="navbar navbar-expand-lg navbar-light">
<a class="navbar-brand" href="#"> <%= @business_name %></a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav">
<li class="nav-item active">
<a class="nav-link" href="#">User Portal</a>
</li>
</ul>
</div>
</nav>
<% else %>
<nav class="navbar navbar-expand-lg navbar-light">
<a class="navbar-brand" href="#"> <%= @business_name %> </a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav">
<li class="nav-item">
<a class="nav-link" href="index.php">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="information.php">About</a>
</li>
<li class="nav-item active">
<a class="nav-link" href="login.php">Log-in<span class="sr-only">(current)</span></a>
</li>
</ul>
</div>
</nav>
<% end %>
<div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav">
<% if $page_title.eql? "Home" %>
<li class="nav-item active">
<a class="nav-link" href="index.php">Home <span class="sr-only">(current)</span></a>
</li>
<li class="nav-item">
<a class="nav-link" href="information.php">About</a>
</li>
<li class="nav-item">
<a class="nav-link" href="login.php">Log-in</a>
</li>
<% elsif $page_title.eql? "Information" %>
<li class="nav-item">
<a class="nav-link" href="index.php">Home</a>
</li>
<li class="nav-item active">
<a class="nav-link" href="information.php">About <span class="sr-only">(current)</span></a>
</li>
<li class="nav-item">
<a class="nav-link" href="login.php">Log-in</a>
</li>
<% elsif $page_title.eql? "User-Portal" %>
<li class="nav-item active">
<a class="nav-link" href="#">User Portal</a>
</li>
<% elsif $page_title.eql? "Update-Profile" %>
<li class="nav-item active">
<a class="nav-link" href="#">Update Profile</a>
</li>
<% else %>
<li class="nav-item">
<a class="nav-link" href="index.php">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="information.php">About</a>
</li>
<li class="nav-item active">
<a class="nav-link" href="login.php">Log-in<span class="sr-only">(current)</span></a>
</li>
<% end %>
</ul>
</div>
</nav>