Further fixed stylings

raynelfss · May 17, 2022 · 023c81c · 023c81c
1 parent ace4edc
commit 023c81c
Show file tree

Hide file tree

Showing 3 changed files with 26 additions and 16 deletions.
diff --git a/build/register.html b/build/register.html
@@ -8,18 +8,18 @@
     </head>
     <body>
         <div class="container">
-            <img class="pic" src="./imgs/Logo.png" width="200px">
+            <a href="/"><img class="pic" src="./imgs/Logo.png" width="200px"></a>
             <form class = "box">
                 <h3>REGISTER</h3>
-                <p>Enter name:</p>
+                <label>Enter name:</label>
                 <input type="text" name="" placeholder="Username" id="name">
-                <p>Enter phone number:</p>
+                <label>Enter phone number:</label>
                 <input type="text" name="" placeholder="Username" id="phoneNumber">
-                <p>Enter username:</p>
+                <label>Enter username:</label>
                 <input type="text" name="" placeholder="Username" id="username">
-                <p>Enter password:</p>
+                <label>Enter password:</label>
                 <input type="password" name="" placeholder="Password" id="password">
-                <p>Confirm password:</p>
+                <label>Confirm password:</label>
                 <input type="password" name="" placeholder="Password" id="password">
             </form>
             <div class ="buttons">

diff --git a/build/styles/login.css b/build/styles/login.css
@@ -19,7 +19,13 @@ body {
 .container {
     /* margin-top:50px;
     margin-left:50px; */
-    width:300px;
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    width: 300px;
+    /* height: 450px; */
+    /* overflow-y: scroll; */
+    /* overflow-x: hidden; */
     padding: 30px;
     position: fixed;
     top: 50%;
@@ -31,6 +37,10 @@ body {
     box-shadow: rgba(0, 0, 0, 0.25) 0px 14px 28px, rgba(0, 0, 0, 0.22) 0px 10px 10px;
 }
 
+.box{
+    display: flex;
+    flex-direction: column;
+}
 .box .h3 {
     color:#262626;
     font-weight: 700%;
@@ -41,27 +51,27 @@ body {
 .box .p{
     padding-left: 4px;
     color:#616161;
-    margin-bottom:-15px;
+    margin-bottom:10px;
 }
 
 .box input[type = "text"], .box input[type = "password"] {
     background: none;
-    display: block;
-    margin: 20px auto;
+    /* display: block; */
+    margin: 10px 0px;
     text-align: left;
     border: 1px solid gray;
-    padding: 14 px 10px;
-    width: 220px;
+    padding: 4px 10px;
+    /* width: 220px; */
     outline: none;
     color: black;
     border-radius: 10px;
     transition: 0.25px;
-    margin-right:80px;
+    /* margin-right:80px; */
 
 }
 
 .box input[type = "text"]:focus, .box input[type = "password"]:focus {
-    width: 220px;
+    /* width: 220px; */
     border-color: black;
     border-width: 2px;
 

diff --git a/build/userlogin.html b/build/userlogin.html
@@ -7,12 +7,12 @@
     </head>
     <body>
         <div class = "container">
-            <img class = "pic" src = "./imgs/Logo.png" width = "200px">
+            <a href="/"><img class = "pic" src = "./imgs/Logo.png" width = "200px"></a>
             <div class = "box">
                 <h3>LOGIN</h3>
                 <label for="username">Enter username:</label>
                 <input type = "text" name = "username" placeholder = "Username" id = "username">
-                <label for="password">Enter password:</p>
+                <label for="password">Enter password:</label>
                 <input type = "password" name = "" placeholder = "Password" id = "password">
             </div>
             <div class ="buttons">