Fixed major issues and unified the interface

NithinV404 · Oct 27, 2023 · 0c77086 · 0c77086
1 parent a3d9c3e
commit 0c77086
Show file tree

Hide file tree

Showing 18 changed files with 721 additions and 731 deletions.
diff --git a/Css/about.css b/Css/about.css
@@ -7,26 +7,16 @@
 }
 body
 {
-background-image:  linear-gradient(315deg, #485461 0%, #28313b 74%);
-}
-h1{
-    color: white;
-    font-weight: bolder;
-    font-size: 80px;
-    position: relative;
-    top: 252px;
-    left: 230px;
+    background-image:  linear-gradient(315deg, #485461 0%, #28313b 74%);
+    background-repeat:no-repeat;
+    background-size:100% 100vh;
+
 }
-.p
+h1
 {
-    color: white;
-    font-weight: bolder;
-    font-size: 20px;
-    position: relative;
-    top: 257px;
-    left: 229px;
-
+    font-size: 5rem;
 }
+
 .photo
 {
     height: 400px;
@@ -39,17 +29,24 @@ h1{
     left: 987px;
 
 }
-.logo
+.content-holder
 {
-    position:relative;
-    bottom: 376px;
-    left: 237px;
+    display: flex;
+    justify-content: space-around;
+    align-items: center;
+    padding-top: 5rem;
+
 }
-.icon
+.img-holder > img
 {
- height: 70px;
- width: 52px;   
- position: relative;
- bottom: 320px;
- right: 483px;
-}
+    height: 500px;
+    width: 500px;
+    border-radius: 5px;
+}
+@media only screen and (max-width: 1200px) {
+    .content-holder
+    {
+        flex-direction: column;
+        gap: 3rem;
+    }
+  }
diff --git a/Css/home.css b/Css/home.css
@@ -9,25 +9,6 @@ body
 {
     background-image: linear-gradient(315deg, #485461 0%, #28313b 74%);
 }
-.navbar{
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-    padding: 20px;
-}
-nav{
-    flex-shrink: 0;
-    text-align: right;
-}
-nav ul{
-    display: inline-block;
-    list-style-type: none;
-}
-nav ul li{
-    display: inline-block;
-    margin-right: 50px;
-    font-size: 20px;
-}
 a{
     text-decoration: none;
     color: white;
@@ -87,73 +68,4 @@ h1{
 .header{
     box-shadow: 2rem white;
 }
-.header .row{
-    margin-top: 0;
-}
-.product:hover ~ hr {
-    margin-left: 15.5%;
-    width:15%;
-  }
-
-.faq:hover ~ hr {
-    margin-left:38%;
-    width:14%
-  }
-
-.login:hover ~ hr {
-    margin-left: 59%;
-    width: 8%;
-  }
-.register:hover ~ hr {
-    margin-left: 75%;
-    width:13%;
-}
-.logo
-{
-    margin-right: 50px;
-}
-.logo > img
-{
-    height: 100px;
-    width: 100px;
-}
-i
-{
-    display: block;
-    color: white;
-    font-size: 2rem;
-    cursor: pointer;
-    transition: ease-out 100ms;
-}
-i:hover
-{
-    color:#B993D6;
-    font-size: 1.8rem;
-}
-hr {
-    height: .25rem;
-    width:8%;
-    margin: 0;
-    background-image: linear-gradient(to right, #B993D6 0%, #8CA6DB  51%, #B993D6  100%);
-    border: none;
-    transition: .3s ease-in-out;
-  }
-  .photo
-  {
-      position: absolute;
-      height: 400px;
-      width: 600px;
-      object-fit:cover;
-      background:url("Assets/shop\ now\ 2.jpg");
-      box-shadow: 5px 5px 5px #28313b;
-      border-radius: 5px;
-      margin-top: -12rem;
-      transition: ease-out 100ms;
-  }
- .photo:hover
- {
-    margin-top: -14rem;
-    margin-left: -5rem;
-    height: 500px;
-    width: 700px;
- }
+
diff --git a/Css/login.css b/Css/login.css
@@ -39,7 +39,7 @@ input
     background-image: linear-gradient(315deg, #485461 0%, #28313b 0%);
     color: white;
 }
-.btn
+#login-form > button
 {
     background-image: linear-gradient(to right, #B993D6 0%, #8CA6DB  51%, #B993D6  100%);
     display:inline-block;
@@ -51,7 +51,7 @@ input
     background-size: 200% auto;
     border: none;
 }
-.btn:hover {
+#login-form > button {
     background-position: right center; /* change the direction of the change here */
     color: #fff;
     text-decoration: none;
@@ -100,16 +100,11 @@ input[type="password"]
     width: 300px;
     margin: 1rem 23rem;
 }
-i
+#email-icon,#togglePassword
 {
-    color:white;
-    cursor: pointer;
+    font-size: 20px;
     margin-left: -30px;
 }
-i:hover
-{
-    font-size: 15px;
-}
 .logo
 {
     width: 100px;