1 files changed, 60 insertions, 27 deletions
diff --git a/src/client/views/smartdraw/SmartDrawHandler.scss b/src/client/views/smartdraw/SmartDrawHandler.scss
index 0e8bd3349..cca7d77c7 100644
--- a/src/client/views/smartdraw/SmartDrawHandler.scss
+++ b/src/client/views/smartdraw/SmartDrawHandler.scss
@@ -1,44 +1,77 @@
 .smart-draw-handler {
     position: absolute;
-}
-
-.smartdraw-input {
-    color: black;
-}
 
-.smartdraw-options {
-    display: flex;
-    flex-direction: row;
-    justify-content: space-around;
-
-    .auto-color {
+    .smart-draw-main {
         display: flex;
-        flex-direction: column;
-        justify-content: center;
-        width: 30%;
+        flex-direction: row;
+
+        .smartdraw-input {
+            color: black;
+            margin: auto;
+        }
     }
 
-    .complexity {
+    .smartdraw-output-options {
         display: flex;
-        flex-direction: column;
+        flex-direction: row;
         justify-content: center;
-        width: 31%;
+        margin-top: 3px;
     }
 
-    .size {
+    .smartdraw-options-container {
+        width: 265px;
+        padding: 5px;
+        font-weight: bolder;
+        text-align: center;
         display: flex;
         flex-direction: column;
-        justify-content: center;
-        width: 39%;
 
-        .size-slider {
-            width: 80%;
+        .smartdraw-options {
+            font-weight: normal;
+            margin-top: 5px;
+            display: flex;
+            flex-direction: row;
+            justify-content: space-around;
+
+            .smartdraw-auto-color {
+                display: flex;
+                flex-direction: column;
+                align-items: center;
+                width: 30%;
+                margin-top: 3px;
+            }
+
+            .smartdraw-complexity {
+                display: flex;
+                flex-direction: column;
+                align-items: center;
+                width: 31%;
+                margin-top: 3px;
+            }
+
+            .smartdraw-size {
+                display: flex;
+                flex-direction: column;
+                align-items: center;
+                width: 39%;
+                margin-top: 3px;
+            }
+        }
+
+        .smartdraw-dimensions {
+            font-weight: normal;
+            margin-top: 7px;
+            padding-left: 25px;
         }
     }
-}
 
-.regenerate-box,
-.edit-box {
-    display: flex;
-    flex-direction: row;
+    .smartdraw-slider {
+        width: 65px;
+    }
+
+    .regenerate-box,
+    .edit-box {
+        display: flex;
+        flex-direction: row;
+    }
 }