From 8effff34870396d2e1d502aef48c99434428d30f Mon Sep 17 00:00:00 2001 From: Souvik Majee Date: Fri, 18 Oct 2024 19:40:14 +0530 Subject: [PATCH 1/2] Nav bar added --- index.html | 11 ----- team.html | 126 +++++++++++++++++++++++++++++++++++++++++++++++++++-- 2 files changed, 122 insertions(+), 15 deletions(-) diff --git a/index.html b/index.html index 166b125b..f669dea4 100644 --- a/index.html +++ b/index.html @@ -1297,17 +1297,6 @@

Travel Discussion Forum

color: #1e88e5; /* Text color change on hover */ } - /* Underline effect */ - /*nav.hi ul li.NAVI a::after { - content: ''; - /*display: block;*/ - width: 0; - height: 2px; - background: #ffcc00; - transition: width 0.3s; - margin: 0 auto; - } - nav.hi ul li.NAVI a:hover::after { width: 100%; } */ diff --git a/team.html b/team.html index 493e6a26..10d75b05 100644 --- a/team.html +++ b/team.html @@ -171,6 +171,43 @@ animation: back 10s linear infinite; } +.main-head { + position: fixed; + top: 0; + left: 0; + right: 0; + z-index: 5; + padding: 15px; + height: 90px; + background-color: #000; /* Initially black */ + color: white; + display: flex; + justify-content:space-evenly; /* Adjusted to space-between for better layout */ + align-items: center; + transition: background-color 0.3s ease, height 0.3s ease; +} + +#nav-list { + display: flex; + gap: 1rem; /* Adjusted gap for better spacing */ + list-style: none; + margin-left: 10px; + padding: 0; + align-items: center; +} +#nav-list li a { + color: white; + text-decoration: none; + font-weight: 400; + white-space: nowrap; + font-size: 20px; +} + +.navhover:hover { + transform: scale(1.05); + background-color: rgba(255,255,255,0.1); + color: white; /* Changes text color on hover */ +} @keyframes back{ 100%{ @@ -179,16 +216,97 @@ } +#logo-web{ + height: 50px; + width: 70px; +} +.mode-toggle img { + width: 30px; /* Adjust the size as needed */ + height: auto; +} +#nav-list { + display: flex; + gap: 1rem; /* Adjusted gap for better spacing */ + list-style: none; + padding: 0; + align-items: center; + justify-content: center; +} + +.logo{ + display: flex; + flex-direction: row; + align-items: center; +} + +.main-head a { + color: #ffffff; + text-decoration: none; +} + +.main-head li{ + display: inline; +} + +#nav-list li a { + color: white; + text-decoration: none; + font-weight: 400; + white-space: nowrap; + font-size: 25px; + font-family: Arial, Helvetica, sans-serif; + margin-right: 20px; +} + +.mode-toggle { + position: fixed; + top: 10px; + right: 10px; + background: none; + border: none; + cursor: pointer; + outline: none; + font-size: 1.5em; + transition: color 0.3s, transform 0.3s; + padding: 15px; + display: flex; + align-items: center; + z-index: 5; +} -
- -
- +
+ + + + + + +
+