Merge branch 'develop' into feature/46-forms-flow-preview

src/assets/scss/components/formBuilder.scss

@@ -191,16 +191,108 @@
 }
 
 .formElementSettings__repeater {
-  display: flex;
-  flex-direction: column;
+  display: grid;
+  grid-template-columns: 1fr;
   gap: 0.5rem;
 }
 
 .formElementSettings__repeaterItem {
+  display: grid;
+  grid-template-columns: 4.5fr 2.4fr 1fr 1.4fr 0.7fr;
+  gap: 12px;
 
+  > div {
+    display: flex;
+    align-items: center;
+    width: 100%;
+    box-sizing: border-box;
+
+    input, select, .p-dropdown {
+      width: 100%;
+      box-sizing: border-box;
+    }
+  }
 }
 
-.formElementSettings__subRepeater {
-  padding: 10px 20px;
-  background-color: #f9f9f9;
+.formElementSettings__subRepeaterWrapper {
+  display: grid;
+  grid-template-columns: 1fr;
+  gap: 7px;
+}
+
+.formElementSettings__subRepeaterItem {
+  display: grid;
+  grid-template-columns: 9.3fr 0.7fr;
+  gap: 12px;
+
+  > div {
+    display: flex;
+    align-items: center;
+    width: 100%;
+    box-sizing: border-box;
+
+    input, select, .p-dropdown {
+      width: 100%;
+      box-sizing: border-box;
+    }
+  }
+}
+
+.formElementSettings__repeaterItemIconBtn {
+  border: none;
+  background: transparent;
+  padding: 0;
+  font-size: 2rem;
+  color: var(--table-border-color);
+
+  i {
+    font-size: 2rem;
+  }
+
+  &:hover {
+    cursor: pointer;
+    color: var(--menuitem-active-background);
+  }
+
+  &:not([data-active="false"]) {
+    color: var(--menuitem-active-background);
+  }
+}
+
+.formElementSettings__lastRowHeader {
+  display: grid;
+  grid-template-columns: 8.3fr 1.7fr;
+  gap: 7px;
+}
+
+.formElementSettings__lastRowHeaderTitle {
+  display: flex;
+  height: 40px;
+  padding: 10.5px 17.5px;
+  justify-content: center;
+  align-items: center;
+  border-radius: 4px;
+  background: #f8f9fa;
+  border: 1px solid #dee2e6;
+  font-size: 14px;
+  font-style: normal;
+  font-weight: 700;
+}
+
+.formElementSettings__lastRowItem {
+  display: grid;
+  grid-template-columns: 1.7fr 8.3fr;
+  gap: 7px;
+
+  > div {
+    display: flex;
+    align-items: center;
+    width: 100%;
+    box-sizing: border-box;
+
+    input, select, .p-dropdown {
+      width: 100%;
+      box-sizing: border-box;
+    }
+  }
 }

src/assets/scss/components/statsBigBadges.scss

@@ -25,8 +25,8 @@
     justify-content: space-between;
     padding: 16px;
     border-radius: 6px;
-    border: 1px solid var(--yellow-500);
-    background: var(--card-full-background-color-2);
+    border: 1px solid #858585;
+    background: #cecece;
     align-items: center;
     gap: 48px;
 
@@ -41,26 +41,73 @@
     span:nth-last-of-type(1) {
         font-size: 22px;
     }
+}
 
-    &:nth-of-type(2) {
-        border: 1px solid var(--yellow-500);
-        background: var(--card-full-background-color-3);
+.statsBigBadges__grid {
+    .statsBigBadges__gridItem {
+        &:nth-of-type(1) {
+            border: 1px solid var(--yellow-500);
+            background: var(--card-full-background-color-2);
+        }
+
+        &:nth-of-type(2) {
+            border: 1px solid var(--yellow-500);
+            background: var(--card-full-background-color-3);
+        }
+
+        &:nth-of-type(3) {
+            border: 1px solid var(--yellow-500);
+            background: var(--card-full-background-color-4);
+        }
+
+        &:nth-of-type(4) {
+            border: 1px solid var(--yellow-500);
+            background: var(--card-full-background-color-1);
+        }
+
+        &:nth-of-type(5) {
+            border: 1px solid var(--yellow-500);
+            background: var(--card-full-background-color-5);
+        }
+
+        &:nth-of-type(6) {
+            border: 1px solid var(--yellow-500);
+            background: var(--card-full-background-color-6);
+        }
     }
-    &:nth-of-type(3) {
-        border: 1px solid var(--yellow-500);
-        background: var(--card-full-background-color-4);
-    }
-    &:nth-of-type(4) {
-        border: 1px solid var(--yellow-500);
-        background: var(--card-full-background-color-1);
-    }
-    &:nth-of-type(5) {
-        border: 1px solid var(--yellow-500);
-        background: var(--card-full-background-color-5);
-    }
-    &:nth-of-type(6) {
-        border: 1px solid var(--yellow-500);
-        background: var(--card-full-background-color-6);
+
+    &.applStats {
+        .statsBigBadges__gridItem {
+            &:nth-of-type(1) {
+                border: 1px solid var(--yellow-500);
+                background: var(--card-full-background-color-2);
+            }
+
+            &:nth-of-type(2) {
+                border: 1px solid var(--yellow-500);
+                background: var(--card-full-background-color-3);
+            }
+
+            &:nth-of-type(3) {
+                border: 1px solid var(--yellow-500);
+                background: var(--card-full-background-color-4);
+            }
+
+            &:nth-of-type(4) {
+                border: 1px solid var(--yellow-500);
+                background: var(--card-full-background-color-7);
+            }
+
+            &:nth-of-type(5) {
+                border: 1px solid var(--yellow-500);
+                background: var(--card-full-background-color-8);
+            }
+
+            &:nth-of-type(6) {
+                border: 1px solid var(--yellow-500);
+                background: var(--card-full-background-color-9);
+            }
+        }
     }
 }
 

src/assets/scss/theme.scss

@@ -29,6 +29,9 @@
   --card-full-background-color-1: #54965b;
   --card-full-background-color-5: #4ba190;
   --card-full-background-color-6: #6d68c0;
+  --card-full-background-color-7: #06B6D4;
+  --card-full-background-color-8: #FF3D32;
+  --card-full-background-color-9: #F97316;
 }
 
 @import "./components/layout.scss";