1 files changed, 31 insertions, 41 deletions

diff --git a/src/client/util/SettingsManager.scss b/src/client/util/SettingsManager.scss
index 1289ca2b4..c41adfdd7 100644
--- a/src/client/util/SettingsManager.scss
+++ b/src/client/util/SettingsManager.scss
@@ -62,26 +62,31 @@
 .password-content {
     display: flex;
     flex-direction: column;
+    align-items: flex-start;
 
     .password-content-inputs {
-        width: 100;
-        // margin-bottom: 10px;
+        display: flex;
+        flex-direction: column;
+        width: 100%;
         font-size: 10px;
+        align-items: flex-start;
 
         .password-inputs {
             border: 1px solid rgb(160, 160, 160);
-            margin-bottom: 8px;
+            margin-bottom: 15px;
             width: 130;
-            color: black;
+            color: $medium-gray;
             border-radius: 5px;
             padding: 7px;
         }
     }
 
     .password-content-buttons {
-        //margin-left: 84px;
-        //width: 100;
-        padding: 7px;
+        display: flex;
+        gap: 5px;
+        justify-content: center;
+        align-items: flex-start;
+        flex-direction: column;
 
         .password-submit {
             //margin-left: 85px;
@@ -103,7 +108,6 @@
 
 .modes-content {
     display: flex;
-    margin-left: 10px;
     font-size: 12px;
 
     .modes-select {
@@ -172,12 +176,12 @@
 
 .appearances-content {
     display: flex;
-    margin-top: 4px;
     color: black;
     font-size: 10px;
 
     .preferences-color {
         display: flex;
+        align-items: center;
         margin-top: 2px;
 
         .preferences-color-text {
@@ -252,40 +256,18 @@
     display: flex;
     flex-direction: column;
 
-    button {
-        width: auto;
-        align-self: center;
-        background: #252b33;
-        margin-right: 15px;
-
-        //margin-top: 4px;
-
-        &:hover {
-            background: $medium-gray;
-        }
-    }
-
-    // .delete-button {
-    //     background: rgb(227, 86, 86);
-    // }
 
     .close-button {
         position: absolute;
-        right: 1em;
-        top: 1em;
-        cursor: pointer;
+        right: 2px;
+        top: 2px;
     }
 
-    // .logout-button {
-    //     right: 355;
-    //     position: absolute;
-    // }
 
     .settings-content {
         background: #e4e4e4;
-        //border-radius: 6px;
         padding: 10px;
-        //width: 560px;
+        width: 500px;
         flex: 1 1 auto;
     }
 
@@ -296,11 +278,8 @@
 
     .error-text {
         color: #c40233;
-        width: 300;
-        margin-left: -20;
         font-size: 10;
         margin-bottom: 4;
-        margin-top: -3;
     }
 
     .success-text {
@@ -370,8 +349,11 @@
 
     .settings-user {
         position: absolute;
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        flex-direction: column;
         bottom: 10px;
-        text-align: center;
         left: 0;
         right: 0;
 
@@ -419,17 +401,25 @@
 
     .tab-column {
         flex: 0 0 50%;
+        flex-direction: column;
+        display: flex;
+        justify-content: flex-start;
+        align-items: flex-start;
 
         .tab-column-title {
-            color: black;
+            color: $dark-gray;
             font-size: 16px;
             font-weight: bold;
-            margin-bottom: 16px;
+            margin-bottom: 10px;
         }
 
         .tab-column-title,
         .tab-column-content {
-            padding-left: 16px;
+            display: flex;
+            justify-content: center;
+            align-items: flex-start;
+            flex-direction: column;
+            gap: 10px;
         }
     }
 }