Skip to content

Commit

Permalink
Updated the code for Navbar
Browse files Browse the repository at this point in the history
  • Loading branch information
Poushmita committed Oct 6, 2024
1 parent f28bfac commit 47e278e
Show file tree
Hide file tree
Showing 2 changed files with 26 additions and 99 deletions.
122 changes: 23 additions & 99 deletions index.html
Original file line number Diff line number Diff line change
Expand Up @@ -340,128 +340,52 @@

<!--Navbar Start-->
<nav class="navbar navbar-expand-lg fixed-top" id="top">
<!-- Bootstrap 5 switch -->
<div class="form-check form-switch">
<input class="form-check-input" type="checkbox" id="darkModeSwitch" checked>
<label class="form-check-label" for="darkModeSwitch">Dark Mode</label>
<script src="script.js"></script> <!-- Link to your JavaScript -->
</div>
<!-- <div class="form-check form-switch mx-4">
<input
class="form-check-input p-2"
type="checkbox"
role="switch"
id="flexSwitchCheckChecked"
checked
onclick="myFunction()"
/>
</div> -->
<div class="container-fluid">
<a class="black navbar-brand" href="#" style="font-family: var(--ff-philosopher);"><b>Retro</b></a>
<a class="navbar-brand" href="#" style="font-family: var(--ff-philosopher);"><b>Retro</b></a>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav me-auto mb-2 mb-lg-0">
<li class="nav-item">
<a class="black nav-link " aria-current="page" href="#" style="font-family: var(--ff-philosopher);">Home</a>
<a class="nav-link " aria-current="page" href="#" style="font-family: var(--ff-philosopher);">Home</a>
</li>
<li class="nav-item">

<a class="black nav-link" href="Html-files/menu.html" style="font-family: var(--ff-philosopher);">About</a>

<a class="nav-link" href="Html-files/menu.html" style="font-family: var(--ff-philosopher);color: black;">Collections</a>

<a class="navbar-brand" href="#" style="font-family: var(--ff-philosopher); color: black;">
<b>Retro</b>
</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent"
aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav me-auto mb-2 mb-lg-0">
<li class="nav-item">
<a class="nav-link" aria-current="page" href="#"
style="color: black; font-family: var(--ff-philosopher);">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="Html-files/about.html"
style="font-family: var(--ff-philosopher); color: black;">About Us</a>

</li>

<li class="nav-item">

<a class="nav-link" href="Html-files/about.html" style="font-family: var(--ff-philosopher);color: black;">About</a>


<a class="nav-link" href="Html-files/menu.html"
style="font-family: var(--ff-philosopher);color: black;">Collections</a>

</li>

<li class="nav-item">

<a class="black nav-link" href="Html-files/services.html" style="font-family: var(--ff-philosopher);">Services</a>

<a class="nav-link" href="Html-files/services.html"
style="font-family: var(--ff-philosopher);color: black;">Services</a>
<a class="nav-link" href="Html-files/menu.html" style="font-family: var(--ff-philosopher);">About</a>
</li>

<li class="nav-item">
<a class="nav-link" href="Html-files/contact.html" style="font-family: var(--ff-philosopher); color: black">Contact Us</a>
<a class="nav-link" href="Html-files/services.html" style="font-family: var(--ff-philosopher);">Services</a>
</li>

<li class="nav-item">
<a class="nav-link" href="#" style="font-family: var(--ff-philosopher); color: black;">More</a>
<a class="nav-link" href="Html-files/contact.html" style="font-family: var(--ff-philosopher);">Contact Us</a>
</li>

</ul>

<div class="navbar-right">
<ul class="navbar-nav">
<li class="nav-item">
<a class="nav-link" onclick="redirectLogin()"
style="color: black; font-family: var(--ff-philosopher);">Login</a>
</li>
<li class="nav-item">
<a class="nav-link" onclick="redirectSignup()"
style="color: black; font-family: var(--ff-philosopher);">Signup</a>
</li>
<li class="nav-item" style="list-style-type: none;">
<a class="nav-link" href="Html-files/cart.html" style="color: black;"><i
class="fa-solid fa-cart-shopping"></i>Cart</a>
</li>
</ul>
</div>
</div>
</div>
</nav>

<!--Navbar End-->

<!-- <nav class="navbar navbar-expand-lg fixed-top" id="top">
<div class="container-fluid">
<a class="navbar-brand" href="#" style="font-family: var(--ff-philosopher);color: black;"><b>Retro</b></a>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav me-auto mb-2 mb-lg-0">
<li class="nav-item">
<a class="nav-link " aria-current="page" href="#" style="color: black;font-family: var(--ff-philosopher);">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="Html-files/about.html" style="font-family: var(--ff-philosopher);color: black;">About</a>
</li>
<li class="nav-item">
<a class="black nav-link" href="Html-files/contact.html" style="font-family: var(--ff-philosopher);">Contact Us</a>
</li>
<!-- Google Translate Element -->
<li class="nav-item">
<div id="google_element" style="font-family: var(--ff-philosopher);color: black;" class="nav-link"></div>
<!-- Google Translate Element -->
<li class="nav-item">
<div id="google_element" style="font-family: var(--ff-philosopher);" class="nav-link"></div>
</li>
</ul>

</div>
<div class="d-flex p-2">

<li class="nav-item" style="list-style-type: none;font-family: var(--ff-philosopher);"><a class="black nav-btn" onclick="redirectLogin()">Login</a></li>&nbsp;&nbsp;
<li class="nav-item" style="list-style-type: none;font-family: var(--ff-philosopher);"><a class="black nav-btn" onclick="redirectSignup()">Sign Up</a></li>&nbsp;&nbsp;
<li class="nav-item" style="list-style-type: none;font-family: var(--ff-philosopher);"><a class="nav-btn" onclick="redirectLogin()">Login</a></li>&nbsp;&nbsp;
<li class="nav-item" style="list-style-type: none;font-family: var(--ff-philosopher);"><a class="nav-btn" onclick="redirectSignup()">Sign Up</a></li>&nbsp;&nbsp;
<li class="nav-item" style="list-style-type: none;">
<a class="nav-btn " href="Html-files/cart.html" style="color: black;"><i class="fa-solid fa-cart-shopping"></i></a>
<a class="nav-btn " href="Html-files/cart.html"><i class="fa-solid fa-cart-shopping"></i></a>
<!-- style="color: black;" -->
</li>

<li class="nav-item" style="list-style-type: none;font-family: var(--ff-philosopher);"><a class="nav-btn" onclick="redirectLogin()" style="color: black;">Login</a></li>&nbsp;&nbsp;
<li class="nav-item" style="list-style-type: none;font-family: var(--ff-philosopher);"><a class="nav-btn" onclick="redirectSignup()" style="color: black;">Sign Up</a></li>&nbsp;&nbsp;

</div>

</div>
Expand Down
3 changes: 3 additions & 0 deletions style.css
Original file line number Diff line number Diff line change
Expand Up @@ -24,6 +24,9 @@ section {
.footer{
background-color: hsl(20, 43%, 93%);
}
.navbar a{
color: black;
}


body {
Expand Down

0 comments on commit 47e278e

Please sign in to comment.