layout configuration options added to menu

1 files changed, 63 insertions, 2 deletions

diff --git a/src/client/views/nodes/DataVizBox/DocCreatorMenu.scss b/src/client/views/nodes/DataVizBox/DocCreatorMenu.scss
index 243954873..71ad9e105 100644
--- a/src/client/views/nodes/DataVizBox/DocCreatorMenu.scss
+++ b/src/client/views/nodes/DataVizBox/DocCreatorMenu.scss
@@ -121,11 +121,38 @@
     text-transform: uppercase;
     cursor: pointer;
 
-    &.repeat {
+    &.spacer {
+        border-left: none;
+        border-right: none;
+        border-radius: 0px;
+        width: auto;
+        text-transform: none;
+         
+        &.small {
+            height: 20px;
+            transform: translateY(-5px);
+        }
+    }
+
+    &.config {
         border-top-right-radius: 0px;
         border-bottom-right-radius: 0px;
         width: 60px;
         border-right: 0px;
+
+        &.layout-config {
+            height: 20px;
+            transform: translateY(-5px);
+            text-transform: none;
+            padding-left: 2px;
+        }
+
+        &.dimensions {
+            text-transform: none;
+            height: 20px;
+            transform: translateY(-5px);
+            width: 70px;
+        }
     }
 }
 
@@ -138,12 +165,46 @@
     align-items: center;
     justify-content: center;
 
-    &.repeat {
+    &.config {
         margin: 0px;
         border-top-left-radius: 0px;
         border-bottom-left-radius: 0px;
         border-left: 0px;
         width: 40px;
+
+        &.layout-config {
+            height: 20px;
+            transform: translateY(-5px);
+        }
+
+        &.dimensions {
+            height: 20px;
+            width: 30px;
+            transform: translateY(-5px);
+
+            &.right {
+                border-top-left-radius: 0px;
+                border-bottom-left-radius: 0px;
+            }
+
+            &.left {
+                border-radius: 0px;
+                border-right: 0px;
+            }
+        }
+    }
+}
+
+.docCreatorMenu-configuration-bar {
+    width: 200;
+    gap: 5px;
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    justify-content: center;
+
+    &.no-gap {
+        gap: 0px;
     }
 }