coer-elements 2.0.30 → 2.0.32

package/styles/index.scss

@@ -11,6 +11,7 @@
 @use "./layout-flex.scss"      as _layout-flex;
 @use "./layout-grid.scss"      as _layout-grid;
 @use "./margins.scss"          as _margins;
+@use "./orders.scss"           as _orders;
 @use "./overflow.scss"         as _overflow;
 @use "./paddings.scss"         as _padding;
 @use "./paragraphs"            as _paragraphs;
@@ -45,6 +46,7 @@
             @include _layout-flex.mixin($breakpoint);
             @include _layout-grid.mixin($breakpoint); 
             @include _margins.mixin($breakpoint);
+            @include _orders.mixin($breakpoint);
             @include _overflow.mixin($breakpoint);
             @include _padding.mixin($breakpoint);
             @include _paragraphs.mixin($breakpoint);
@@ -65,6 +67,7 @@
             @include _layout-flex.mixin($breakpoint);
             @include _layout-grid.mixin($breakpoint); 
             @include _margins.mixin($breakpoint);
+            @include _orders.mixin($breakpoint);
             @include _overflow.mixin($breakpoint);
             @include _padding.mixin($breakpoint);
             @include _paragraphs.mixin($breakpoint);

package/styles/layout-flex-wrap.scss

@@ -2,6 +2,7 @@
     .#{$breakpoint}flex-wrap { 
         display: flex !important; 
         flex-wrap: wrap !important; 
+        gap: 10px;
     } 
 
     @each $key, $value in (
@@ -62,10 +63,12 @@
 
     @for $i from 1 through 100 { 
         .#{$breakpoint}flex-item-#{$i}px {
+            flex-grow: 0 !important;
             flex-basis: $i * 1px !important;
         } 
 
         .#{$breakpoint}flex-item-#{$i} {
+            flex-grow: 0 !important;
             flex-basis: $i * 1% !important;
         } 
 
@@ -82,6 +85,7 @@
 
 
     .#{$breakpoint}flex-item-150px {
+        flex-grow: 0 !important;
         flex-basis: 150px !important;
     }
 
@@ -99,6 +103,7 @@
         ) { 
 
         .#{$breakpoint}flex-item-#{$key} {
+            flex-grow: 0 !important;
             flex-basis: $value !important;
         }
 
@@ -111,6 +116,7 @@
 
     @for $i from 2 through 10 {      
         .#{$breakpoint}flex-item-#{$i * 100}px {
+            flex-grow: 0 !important;
             flex-basis: $i * 100px !important;
         }
 
@@ -121,6 +127,7 @@
 
         @if($i * 100 + 50 < 1000) {
             .#{$breakpoint}flex-item-#{$i * 100 + 50}px {
+                flex-grow: 0 !important;
                 flex-basis: $i * 100px + 50px;
             } 
 

package/styles/orders.scss

@@ -0,0 +1,7 @@
+@mixin mixin($breakpoint) { 
+    @for $i from 1 through 25 {
+        .#{$breakpoint}order-#{$i} {
+            order: $i !important;
+        }
+    } 
+}

package/styles/paragraphs.scss

@@ -8,10 +8,20 @@ h1, h2, h3, h4, h5, h6, p, pre, hr, figure, fieldset {
 } 
 
 @mixin mixin($breakpoint) {
-    .#{$breakpoint}white-space-nowrap {
-        white-space: nowrap !important;
+    
+    @each $key, $value in ( 
+        'normal'   : normal, 
+        'nowrap'   : nowrap, 
+        'pre'      : pre,
+        'pre-line' : pre-line,
+        'pre-wrap' : pre-wrap 
+    ) {   
+        .#{$breakpoint}white-space-#{$key} {
+            white-space: $value !important;
+        }
     }
 
+
     @each $key, $value in ( 
         'left'    : left, 
         'center'  : center,