🐞[bug]: On the login page there is no option to switch to signup page #…

…318 (#338)  ## Description I have properly made the changes and added the switch links on login and signup page so that user can switch to login or signup without any issues. ## Related Issues  - Closes #318 ## Type of PR  - [X] (Bug) ## Screenshots / videos (if applicable) ![image](https://github.com/user-attachments/assets/fe9db0d7-ff8c-4211-bc2d-8af79fc7f681) ![image](https://github.com/user-attachments/assets/cc8ae888-9c97-41e0-bc9f-9ecc463e63f9) ## Checklist - [X] I have gone through the [contributing guide](https://github.com/Anjaliavv51/Retro) - [X] I have updated my branch and synced it with project `main` branch before making this PR - [X] I have performed a self-review of my code - [X] I have tested the changes thoroughly before submitting this pull request. - [X] I have provided relevant issue numbers, screenshots, and videos after making the changes. - [X] I have commented my code, particularly in hard-to-understand areas. ## Additional context: @Anjaliavv51 you can check this and merge it to main and assign this to me and put relevent labels okay gssoc 2024 ext and hacktoberfest and level.
Anjaliavv51 · Oct 8, 2024 · e980288 · e980288
2 parents df4a42f + 8bef6ac
commit e980288
Show file tree

Hide file tree

Showing 2 changed files with 44 additions and 0 deletions.
diff --git a/Html-files/login.html b/Html-files/login.html
@@ -89,6 +89,26 @@
                   --ff-poppins: "Poppins", sans-serif;
               }
       </style>
+      <style>
+        /* Styles for the switch link */
+        .switch-link {
+          margin-top: 20px;
+          font-family: var(--ff-poppins);
+          text-align: center;
+          color: hsl(203, 30%, 26%);
+        }
+
+        .switch-link a {
+          color: hsl(0, 100%, 50%);
+          text-decoration: none;
+          font-weight: bold;
+          transition: color 0.3s ease;
+        }
+
+        .switch-link a:hover {
+          color: hsl(203, 30%, 26%);
+        }
+      </style>
 </head>
 <body>
   <div class="circle-container">
@@ -142,6 +162,8 @@ <h1 style="color: hsl(203, 30%,26%);font-family: var(--ff-philosopher);">LOGIN</
         <button type="submit" class="btn-login" style="color: black;font-family:var(--ff-poppins);">Login</button>
         <button id="google-login" style="color: black;font-family:var(--ff-poppins);">Login with google</button>
         <p id="error-message" style="color: red; font-family: var(--ff-poppins);"></p>
+
+        <p class="switch-link">Don’t have an account? <a href="signup.html">Sign Up</a></p>
       </div>
     </div>
 </form>

diff --git a/Html-files/signup.html b/Html-files/signup.html
@@ -169,6 +169,26 @@
 .area .way:nth-child(8):hover ~ .box{transform: rotateX(20deg) rotateY(0deg);}
 .area .way:nth-child(9):hover ~ .box{transform: rotateX(20deg) rotateY(-20deg);}
   </style>
+  <style>
+    /* Styles for the switch link */
+    .switch-link {
+      margin-top: 20px;
+      font-family: var(--ff-poppins);
+      text-align: center;
+      color: hsl(203, 30%, 26%);
+    }
+
+    .switch-link a {
+      color: hsl(0, 100%, 50%);
+      text-decoration: none;
+      font-weight: bold;
+      transition: color 0.3s ease;
+    }
+
+    .switch-link a:hover {
+      color: hsl(203, 30%, 26%);
+    }
+  </style>
 </head>
 <body>
   <div class="circle-container">
@@ -241,6 +261,8 @@ <h1 style="font-family: var(--ff-philosopher);color: hsl(203, 30%, 26%);">SIGN U
             <div class="btnNext"><button type="submit" class="btn-login" style="font-family: var(--ff-philosopher);color: #ddd;">Register</button>
               <button id="google-login" style="font-family: var(--ff-philosopher);color: #ddd;">Signup with Google</button></div>
           </div>
+
+          <p class="switch-link">Already have an account? <a href="login.html">Login</a></p>
         </div>
       </div>
       <script>