Resolve conflict

web/css/edit_profile.css

@@ -4,7 +4,7 @@
 }
 .left2{
     flex-basis: 28%;
-    padding-left: 20px;
+    /* padding-left: 1.5%; */
     padding-top: 2.5%;
 }
 
@@ -14,16 +14,17 @@ h1 {
 
 .right{
     flex-basis: 90%;
+    width: fit-content;
     align-content: left;
     padding-left: 5%;
     margin-top: 2.5%;
-    padding-right: 9%;
+    padding-right: 5%;
 }
 
 .right2{
     flex-basis: 72%;
     align-content: left;
-    padding-right: 15%;
+    /* padding-right: 5%; */
     padding-top: 30px;
 }
 
@@ -36,9 +37,10 @@ h1 {
 
 .cols{
     display: flex;
+    width: fit-content;
     flex-wrap: wrap;
     flex-direction: column;
-    margin-left: 100px;
+    padding-left: 50px;
 }
 .rows1{
     display: flex;
@@ -53,13 +55,13 @@ h1 {
     display: flex;
     flex-wrap: nowrap;
     flex-direction: row;
-    margin-left: 100px;
+    padding-left: 150px;
     justify-content: space-around;
     height:80px;
 }
 
 .rows{
-    margin-left: 100px;
+    padding-left: 150px;
     display: flex;
     flex-wrap: nowrap;
     flex-direction: row;
@@ -100,14 +102,16 @@ h1 {
     padding: 8px 10px;
     border-radius: 8px;
     font-size: 20px;
+    width: fit-content;
 }
 
 .upload-btn-wrapper input[type=file] {
     font-size: 50px;
     position: absolute;
+    width: fit-content;
     left: 0;
     top: 0;
-    opacity: 0;
+    opacity: 00;
 }
 
 #profpict_dummy{
@@ -133,8 +137,9 @@ input[type=file]{
     color: transparent;
 }
 
-.profpict_dummy{
+#profpict_dummy{
     width: 500px;
+    margin-left: 0;
 }
 
 input[type=text]{
@@ -143,10 +148,14 @@ input[type=text]{
     font-weight: 500;
     letter-spacing: 1px;
     font-size: 32px;
+    margin-left: 50px;
+    padding-left: 10px;
 }
 
 textarea{
     width: 625px;
+    margin-left: 50px;
+    padding-left: 10px;
     font-size: 32px;
 }
 
@@ -180,14 +189,17 @@ textarea{
 
 #warning-1{
     visibility: hidden;
-    width: 625px;
+    width: 620px;
+    margin-left: 50px;
 }
 
 #warning-2{
     visibility: hidden;
-    width: 625px;
+    width: 620px;
+    margin-left: 50px;
 }
 #warning-3{
     visibility: hidden;
-    width: 625px;
+    width: 620px;
+    margin-left: 50px;
 }

web/edit_profile/edit_profile.php

@@ -22,11 +22,11 @@
     }
     // echo $update_name;
     $update = setUserProfile($user_id, $update_name, $update_address, $update_phone, $name, $tmp_name);
-    if ($update == 0){
-        echo "<script type='text/javascript'>alert 'Update Failed';</script>";
-    } else{
-        echo "<script type='text/javascript'>alert 'Update Success';</script>";
-    }
+    // if ($update == 0){
+    //     echo "<script type='text/javascript'>alert 'Update Failed';</script>";
+    // } else{
+    //     echo "<script type='text/javascript'>alert 'Update Success';</script>";
+    // }
     header('Location: ../profile');
     exit;
 ?>
\ No newline at end of file

web/edit_profile/view.php

@@ -48,7 +48,7 @@
         <div class="flex-container">
             <input id="profpict_dummy" class="profpict_dummy"type="text" name="profile_picture2" readonly>
             <div class="upload-btn-wrapper">
-                <button class="btn">Browse ...</button>
+                <button class="btn">Browse...</button>
                 <input id="profpict" type="file" name="profile_picture" accept="image/png, image/jpg, image/jpeg" onchange="showname()" >
             </div>   
         </div>

web/javascript/edit_profile.js

@@ -71,6 +71,9 @@ function validateForm(){
         // alert(false);
         if (isNameEmpty == true){
             document.getElementById("warning-1").style.visibility = 'visible';
+        } else if (isNameTooLong == true){
+            document.getElementById("warning-1").style.visibility = 'visible';
+            document.getElementById("warning-1").innerHTML = 'Name must be under 20 characters.';
         }
         if (isAddressEmpty == true){
             document.getElementById("warning-2").style.visibility = 'visible';