@progressio_resources/gravity-design-system 1.1.14 → 1.1.16

package/src/lib/styles/foundations/elevation/_hero.elevation.scss

@@ -0,0 +1,22 @@
+$elevations: (
+  none,
+  xs,
+  sm,
+  md
+);
+
+.elevation-none {
+  box-shadow: none;
+}
+
+.elevation-xs {
+  box-shadow: 0 1px 4px 0 rgba(var(--shadow-primary), 0.22);
+}
+
+.elevation-sm {
+  box-shadow: 0 4px 10px 0 rgba(var(--shadow-primary), 0.22);
+}
+
+.elevation-xs {
+  box-shadow: 0 8px 35px 0 rgba(var(--shadow-primary), 0.22);
+}

package/src/lib/styles/foundations/grids/_grids.scss

@@ -0,0 +1,158 @@
+$grids: (
+  sm: 4,
+  md: 6,
+  lg: 12,
+  xl: 16
+);
+
+.col-sm-1 {
+  width: calc(100% / 4) * 1;
+}
+
+.col-sm-2 {
+  width: calc(100% / 4) * 2;
+}
+
+.col-sm-3 {
+  width: calc(100% / 4) * 3;
+}
+
+.col-sm-4 {
+  width: calc(100% / 4) * 4;
+}
+
+.col-md-1 {
+  width: calc(100% / 6) * 1;
+}
+
+.col-md-2 {
+  width: calc(100% / 6) * 2;
+}
+
+.col-md-3 {
+  width: calc(100% / 6) * 3;
+}
+
+.col-md-4 {
+  width: calc(100% / 6) * 4;
+}
+
+.col-md-5 {
+  width: calc(100% / 6) * 5;
+}
+
+.col-md-6 {
+  width: calc(100% / 6) * 6;
+}
+
+.col-lg-1 {
+  width: calc(100% / 12) * 1;
+}
+
+.col-lg-2 {
+  width: calc(100% / 12) * 2;
+}
+
+.col-lg-3 {
+  width: calc(100% / 12) * 3;
+}
+
+.col-lg-4 {
+  width: calc(100% / 12) * 4;
+}
+
+.col-lg-5 {
+  width: calc(100% / 12) * 5;
+}
+
+.col-lg-6 {
+  width: calc(100% / 12) * 6;
+}
+
+.col-lg-7 {
+  width: calc(100% / 12) * 7;
+}
+
+.col-lg-8 {
+  width: calc(100% / 12) * 8;
+}
+
+.col-lg-9 {
+  width: calc(100% / 12) * 9;
+}
+
+.col-lg-10 {
+  width: calc(100% / 12) * 10;
+}
+
+.col-lg-11 {
+  width: calc(100% / 12) * 11;
+}
+
+.col-lg-12 {
+  width: calc(100% / 12) * 12;
+}
+
+.col-xl-1 {
+  width: calc(100% / 16) * 1;
+}
+
+.col-xl-2 {
+  width: calc(100% / 16) * 2;
+}
+
+.col-xl-3 {
+  width: calc(100% / 16) * 3;
+}
+
+.col-xl-4 {
+  width: calc(100% / 16) * 4;
+}
+
+.col-xl-5 {
+  width: calc(100% / 16) * 5;
+}
+
+.col-xl-6 {
+  width: calc(100% / 16) * 6;
+}
+
+.col-xl-7 {
+  width: calc(100% / 16) * 7;
+}
+
+.col-xl-8 {
+  width: calc(100% / 16) * 8;
+}
+
+.col-xl-9 {
+  width: calc(100% / 16) * 9;
+}
+
+.col-xl-10 {
+  width: calc(100% / 16) * 10;
+}
+
+.col-xl-11 {
+  width: calc(100% / 16) * 11;
+}
+
+.col-xl-12 {
+  width: calc(100% / 16) * 12;
+}
+
+.col-xl-13 {
+  width: calc(100% / 16) * 13;
+}
+
+.col-xl-14 {
+  width: calc(100% / 16) * 14;
+}
+
+.col-xl-15 {
+  width: calc(100% / 16) * 15;
+}
+
+.col-xl-16 {
+  width: calc(100% / 16) * 16;
+}

package/src/lib/styles/gravity-design-system.scss

@@ -1,9 +1,16 @@
-@import "./fundamentals/border-radius/hero.border-radius";
-@import "./fundamentals/colors/tokens/hero.tokens";
-@import "./fundamentals/spacing/spacing";
-@import "./fundamentals/typography/hero.typography";
-@import "./overwrite/bootstrap/bootstrap-export";
-@import "./overwrite/pretty-checkbox/pretty-checkbox.scss";
+@import "./responsive";
+@import "./shared";
+
+//Components
 @import "./components/card_highlight";
 @import "./components/datepicker";
 @import "./components/link";
+
+//Foundations
+@import "./foundations/breakpoints/breakpoints";
+@import "./foundations/grids/grids";
+@import "./foundations/spacing/spacing";
+
+//Overwrite
+@import "./overwrite/bootstrap/bootstrap-export";
+@import "./overwrite/pretty-checkbox/pretty-checkbox.scss";

package/src/lib/styles/overwrite/bootstrap/_modal.scss

@@ -1,4 +1,4 @@
-@import "../../fundamentals/border-radius/hero.border-radius";
+@import "../../foundations/border-radius/hero.border-radius";
 
 $modal-margin: 3.5rem;
 
@@ -34,6 +34,7 @@ $modal-margin: 3.5rem;
 
 .modal-dialog-scrollable {
   height: calc(100% - $modal-margin * 2);
+  min-height: 15rem;
 
   .modal-content {
     max-height: 100%;
@@ -41,6 +42,7 @@ $modal-margin: 3.5rem;
   }
 
   .dialog-body {
+    max-height: 16vw;
     overflow-y: auto;
   }
 }
@@ -57,7 +59,8 @@ $modal-margin: 3.5rem;
 .modal-dialog-centered {
   align-items: center;
   display: flex;
-  min-height: calc(100% - $modal-margin * 2);
+  height: calc(100% - $modal-margin * 2);
+  min-height: 15rem;
 }
 
 .modal-fullscreen {

package/src/lib/styles/themes/_hero.scss

@@ -0,0 +1,4 @@
+@import "../foundations/border-radius/hero.border-radius";
+@import "../foundations/colors/tokens/hero.tokens";
+@import "../foundations/elevation/hero.elevation";
+@import "../foundations/typography/hero.typography";

package/src/lib/assets/icons/radio-off.svg

@@ -1,3 +0,0 @@
-<svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
-<rect x="2.5" y="2.5" width="43" height="43" rx="21.5" stroke="var(--radio-button-on-primary, red)" stroke-width="5"/>
-</svg>

package/src/lib/assets/icons/radio-on.svg

@@ -1,3 +0,0 @@
-<svg width="28" height="28" viewBox="0 0 28 28" fill="none" xmlns="http://www.w3.org/2000/svg">
-<rect width="28" height="28" rx="14" fill="var(--radio-button-off-primary, red)"/>
-</svg>

package/src/lib/styles/fundamentals/grids/grids.scss

@@ -1,6 +0,0 @@
-$grids: (
-  sm: 4,
-  md: 6,
-  lg: 12,
-  xl: 16
-);