From ba66131df075113401eb4c0ee0e45a3dcb8254e7 Mon Sep 17 00:00:00 2001 From: Devesh Jain Date: Fri, 14 Oct 2022 23:52:04 +0530 Subject: [PATCH 1/2] Updated navbar improved design, responsiveness, working hamburger(mobile-view), linked contact.html --- css/nav.css | 70 +++++++++++++++++++++++++++++++++++++++++++++++++++ css/style.css | 1 - index.html | 42 +++++++++++++------------------ script.js | 8 ++++++ 4 files changed, 95 insertions(+), 26 deletions(-) create mode 100644 css/nav.css create mode 100644 script.js diff --git a/css/nav.css b/css/nav.css new file mode 100644 index 0000000..17ddb7a --- /dev/null +++ b/css/nav.css @@ -0,0 +1,70 @@ +.topnav { + overflow: hidden; + background-color: #212529; + overflow: hidden; + background-color: #212529; + display: flex; + justify-content: space-between; + align-items: center; + } + + .topnav a { + float: left; + display: block; + color: #f2f2f2b6; + text-align: center; + padding: 14px 16px; + text-decoration: none; + font-size: 17px; + } + + .topnav a:hover { + color: rgb(255, 255, 255); + font-weight: 500; + } + + .topnav a.active { + color: white; + } + + .topnav .icon { + display: none; + } + .nvl{ + display: flex; + align-items: center; + justify-content: flex-end; + } + .srch{ + display: flex; + } + @media screen and (max-width: 600px) { + .topnav a:not(:first-child) {display: none;} + .topnav a.icon { + float: right; + display: block; + } + .nvl{ + display: flex; + flex-direction: column; + align-items: center; + align-content: center; + } + .srch { + display: none!important; + } + } + + @media screen and (max-width: 600px) { + .topnav.responsive {position: relative;} + .topnav.responsive .icon { + position: absolute; + right: 0; + top: 0; + } + .topnav.responsive a { + float: none; + display: block; + text-align: left; + } + } \ No newline at end of file diff --git a/css/style.css b/css/style.css index 42e5c4a..724be70 100644 --- a/css/style.css +++ b/css/style.css @@ -35,7 +35,6 @@ body{ /* Header styling */ nav{ width: 100%; - height: 8vh; } .header-div{ diff --git a/index.html b/index.html index 86668e7..9bcaa7e 100644 --- a/index.html +++ b/index.html @@ -8,6 +8,7 @@ Project + @@ -17,40 +18,30 @@ - -
- +
@@ -328,6 +319,7 @@
Risk Of Fact + diff --git a/script.js b/script.js new file mode 100644 index 0000000..3724f2f --- /dev/null +++ b/script.js @@ -0,0 +1,8 @@ +function myFunction() { + var x = document.getElementById("myTopnav"); + if (x.className === "topnav") { + x.className += " responsive"; + } else { + x.className = "topnav"; + } + } \ No newline at end of file From 404822913a9c1f3904ec80c6f058652f4d509cc7 Mon Sep 17 00:00:00 2001 From: Devesh Jain Date: Sat, 15 Oct 2022 00:04:27 +0530 Subject: [PATCH 2/2] Added navbar to contact.html --- Contact.html | 98 +++++++++++++++++++++++++++++++++++----------------- 1 file changed, 67 insertions(+), 31 deletions(-) diff --git a/Contact.html b/Contact.html index 1034603..fab2861 100644 --- a/Contact.html +++ b/Contact.html @@ -1,43 +1,79 @@ + Contact us + + + + + - + + + + -
-
Contact us
-
We'll get back to you soon!
- -
-
- - -
- -
- - -
- -
- - -
- -
- - -
- -
- -
-
-
+ + +
+
Contact us
+
We'll get back to you soon!
+ +
+
+ + +
+ +
+ + +
+ +
+ + +
+ +
+ + +
+ +
+ +
+
+
+ + \ No newline at end of file