From 6b81b925daaa0f73b9229faff710b6b7d301cdbb Mon Sep 17 00:00:00 2001
From: Aniq Javed <2aniqqjavedd4493@gmail.com>
Date: Mon, 24 Oct 2022 04:18:09 +0500
Subject: [PATCH] Password Checker: Navbar and color palette updated

---
 Password Checker/index.html | 24 +++++++++++++++++++--
 Password Checker/style.css  | 42 ++++++++++++++++++++++++++++++-------
 2 files changed, 57 insertions(+), 9 deletions(-)
diff --git a/Password Checker/index.html b/Password Checker/index.html
index 8e98cc3..40db490 100644
--- a/Password Checker/index.html	
+++ b/Password Checker/index.html	
@@ -5,15 +5,35 @@
     <meta name="viewport" content="width=device-width, initial-scale=1">
     <title>Password Checker</title>
     <link rel="stylesheet" href="style.css">
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
   </head>
   <body>
     
-    <div class="cont">
+    <nav class="navbar navbar-expand-lg navbar-light bg-light navbar-items">
+      <a class="navbar-brand navbar-brand-text" href="#">Password Checker</a>
+      
+    
+      <div class="collapse navbar-collapse links" id="navbarSupportedContent">
+        <ul class="navbar-nav mr-auto list-links navbar-brand-text">
+          <li class="nav-item active">
+            <a class="nav-link navbar-brand-text" href="#">Home <span class="sr-only">(current)</span></a>
+          </li>
+          <li class="nav-item">
+            <a class="nav-link navbar-brand-text" href="#">About</a>
+          </li>
+          <li class="nav-item">
+            <a class="nav-link disabled navbar-brand-text" href="#">Contact Us</a>
+          </li>
+        </ul>
+      </div>
+    </nav>
+    <div class="section">
+      <div class="cont">
         <div class="check">
             <input type="password" onkeyup="Check()" placeholder="Enter a Password" name="pass" id="pass">
             <div class="msg">No Password</div>
         </div>
-    
+      </div>
     </div>
     <script src="script.js"></script>
   </body>
diff --git a/Password Checker/style.css b/Password Checker/style.css
index a9711ae..b4a20ae 100644
--- a/Password Checker/style.css	
+++ b/Password Checker/style.css	
@@ -1,21 +1,49 @@
-*
-{
-    padding: 0;
-    margin: 0;
-    box-sizing: border-box;
-    outline: none;
-}
+
 @import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;500&display=swap');
 body
 {
     font-family: 'Roboto', sans-serif;
+    
+}
+
+.navbar-items{
+    text-decoration: none;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    font-size: 20px;
+    background-color: rgb(109, 179, 6);
+    color: white !important;
+    
+}
+.navbar-brand-text{
+    color: white;
 }
+
+.links{
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    
+}
+
+.list-links{
+    list-style-type: none;
+    width: 300px;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+}
+
 .cont
 {
     display: flex;
     align-items: center;
     justify-content: center;
     padding: 200px 0;
+    background-image: url("https://img.freepik.com/free-vector/matrix-style-binary-code-digital-background-with-falling-numbers_1017-25336.jpg?w=740&t=st=1666566510~exp=1666567110~hmac=8dcc404b261084af9fbb43fd6cb8b913e571ae3df04a29032f1ccb0be01a75f9");
+    
+    
 }
 input
 {
