@enigmatry/scss-foundation 19.0.1-preview.1 → 19.0.1-preview.4

package/coverage/clover.xml

@@ -1,6 +1,6 @@
 <?xml version="1.0" encoding="UTF-8"?>
-<coverage generated="1741782357222" clover="3.2.0">
-  <project timestamp="1741782357222" name="All files">
+<coverage generated="1746714355918" clover="3.2.0">
+  <project timestamp="1746714355918" name="All files">
     <metrics statements="0" coveredstatements="0" conditionals="0" coveredconditionals="0" methods="0" coveredmethods="0" elements="0" coveredelements="0" complexity="0" loc="0" ncloc="0" packages="0" files="0" classes="0"/>
   </project>
 </coverage>

package/coverage/lcov-report/index.html

@@ -86,7 +86,7 @@
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at 2025-03-12T12:25:57.217Z
+                at 2025-05-08T14:25:55.914Z
             </div>
         <script src="prettify.js"></script>
         <script>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@enigmatry/scss-foundation",
-  "version": "19.0.1-preview.1",
+  "version": "19.0.1-preview.4",
   "author": "Enigmatry",
   "description": "Collection of SCSS utilities useful for the most of projects.",
   "homepage": "https://github.com/enigmatry/entry-angular-building-blocks/tree/master/libs/scss-foundation#readme",

package/src/modules/_map.scss

@@ -5,7 +5,6 @@
 @use 'variables' as vars;
 
 @function value-from($object, $path) {
-
 	@if meta.type-of($object) != map {
 		@return -error('Please provide valid object! Given value: ' + $object);
 	}
@@ -22,7 +21,7 @@
 		@if (map.has-key($result, $key) == false) {
 			@return -error('Path segment must be any of following values: ' + map.keys($result) + '. Given path segment: ' + $key);
 		}
-        
+
 		$result: map.get($result, $key);
 	}
 
@@ -32,6 +31,7 @@
 @function -split($string, $separator: '.') {
 	$result: ();
 	$current-index: string.index($string, $separator);
+
 	@while $current-index != null {
 		$key: string.slice($string, 1, $current-index - 1);
 		$result: list.append($result, $key);

package/src/modules/layout/_grid.scss

@@ -8,6 +8,7 @@ $breakpoints: () !default;
 @use 'sass-true/sass/throw';
 @use '../../modules/variables' as vars;
 @use 'sass:list';
+
 @forward '../../modules/responsiveness/breakpoints' with (
 	$breakpoints: $breakpoints
 );
@@ -37,7 +38,6 @@ $offset-prefix: 'offset-';
 				$catch: vars.$testing
 			);
 		}
-		
 		@else {
 			@include grid-core.generate($column-prefix, $offset-prefix, $spacing);
 			@include grid-core.generate-reverse-row($breakpoints);
@@ -71,6 +71,7 @@ $offset-prefix: 'offset-';
 
 @mixin -responsive-grid-from($spacing, $divisions) {
 	$division-limit: $divisions + 1;
+
 	@each $item, $value in $breakpoints {
 		$size: map.get($value, description);
 

package/src/modules/responsiveness/_breakpoints.scss

@@ -1,4 +1,4 @@
-/* stylelint-disable at-rule-allowed-list */
+/* stylelint-disable at-rule-allowed-list, media-query-no-invalid */
 $breakpoints: () !default;
 
 @use 'sass:list';
@@ -15,6 +15,7 @@ $breakpoints: () !default;
 @function -get-size($size) {
 	@if (map.has-key($breakpoints, $size)) {
 		$gotten-size: map.get($breakpoints, $size);
+
 		@return map.get($gotten-size, size);
 	}
 

package/src/modules/sizes/_set-size.scss

@@ -1,9 +1,10 @@
 @mixin box-dimensions($property, $value, $min-value: null, $max-value: null) {
 	#{$property}: $value;
-  
+
 	@if $min-value {
 		min-#{$property}: $min-value;
 	}
+
 	@if $max-value {
 		max-#{$property}: $max-value;
 	}

package/tests/layout/grid-core.tests.scss

@@ -1,8 +1,4 @@
-/* stylelint-disable selector-max-attribute */
-/* stylelint-disable csstools/use-nesting */
-/* stylelint-disable shorthand-property-no-redundant-values */
-/* stylelint-disable max-nesting-depth */
-/* stylelint-disable at-rule-allowed-list */
+/* stylelint-disable shorthand-property-no-redundant-values, selector-max-attribute, at-rule-allowed-list */
 $custom-breakpoints: () !default;
 
 @use 'sass-true/sass/true';
@@ -88,24 +84,24 @@ $custom-breakpoints: () !default;
 						flex-direction: row-reverse;
 					}
 				}
-					
+
 				@media only screen and (width >= 800px) {
 					.row.reverse-row-md {
 						flex-direction: row-reverse;
 					}
 				}
-					
+
 				.row.reverse-row-under-sm {
 					flex-direction: row-reverse;
-					
+
 					@media only screen and (width >= 540px) {
 						flex-direction: row;
 					}
 				}
-					
+
 				.row.reverse-row-under-md {
 					flex-direction: row-reverse;
-					
+
 					@media only screen and (width >= 800px) {
 						flex-direction: row;
 					}

package/tests/layout/grid.tests.scss

@@ -1,10 +1,4 @@
-/* stylelint-disable pitcher/max-lines */
-/* stylelint-disable csstools/use-nesting */
-/* stylelint-disable selector-max-attribute */
-/* stylelint-disable shorthand-property-no-redundant-values */
-/* stylelint-disable number-max-precision */
-/* stylelint-disable max-nesting-depth */
-/* stylelint-disable at-rule-allowed-list */
+/* stylelint-disable pitcher/max-lines, csstools/use-nesting, selector-max-attribute, plugin/file-max-lines, shorthand-property-no-redundant-values, at-rule-allowed-list, number-max-precision */
 @use '../../src/modules/layout/grid';
 @use '../../src/modules/variables' as vars;
 @use 'sass-true';
@@ -133,778 +127,778 @@ vars.$testing: true;
 					max-width: 100%;
 					padding: 0 0;
 				}
-					
+
 				.col-auto {
 					flex: 0 0 auto;
 					width: auto;
 					padding: 0 0;
 				}
-					
+
 				@media only screen and (width >= 576px) {
 					.row.reverse-row-sm {
 						flex-direction: row-reverse;
 					}
 				}
-					
+
 				@media only screen and (width >= 768px) {
 					.row.reverse-row-md {
 						flex-direction: row-reverse;
 					}
 				}
-					
+
 				@media only screen and (width >= 992px) {
 					.row.reverse-row-lg {
 						flex-direction: row-reverse;
 					}
 				}
-					
+
 				@media only screen and (width >= 1200px) {
 					.row.reverse-row-xl {
 						flex-direction: row-reverse;
 					}
 				}
-					
+
 				@media only screen and (width >= 1400px) {
 					.row.reverse-row-xxl {
 						flex-direction: row-reverse;
 					}
 				}
-					
+
 				.row.reverse-row-under-sm {
 					flex-direction: row-reverse;
-					
+
 					@media only screen and (width >= 576px) {
 						flex-direction: row;
 					}
 				}
-					
+
 				.row.reverse-row-under-md {
 					flex-direction: row-reverse;
-					
+
 					@media only screen and (width >= 768px) {
 						flex-direction: row;
 					}
 				}
-					
+
 				.row.reverse-row-under-lg {
 					flex-direction: row-reverse;
-					
+
 					@media only screen and (width >= 992px) {
 						flex-direction: row;
 					}
 				}
-					
+
 				.row.reverse-row-under-xl {
 					flex-direction: row-reverse;
-					
+
 					@media only screen and (width >= 1200px) {
 						flex-direction: row;
 					}
 				}
-					
+
 				.row.reverse-row-under-xxl {
 					flex-direction: row-reverse;
-					
+
 					@media only screen and (width >= 1400px) {
 						flex-direction: row;
 					}
 				}
-					
+
 				.col-1 {
 					flex: 0 0 auto;
 					width: 8.3333333333%;
 					padding: 0 0;
 				}
-					
+
 				.offset-1 {
 					margin-left: 8.3333333333%;
 				}
-					
+
 				.col-2 {
 					flex: 0 0 auto;
 					width: 16.6666666667%;
 					padding: 0 0;
 				}
-					
+
 				.offset-2 {
 					margin-left: 16.6666666667%;
 				}
-					
+
 				.col-3 {
 					flex: 0 0 auto;
 					width: 25%;
 					padding: 0 0;
 				}
-					
+
 				.offset-3 {
 					margin-left: 25%;
 				}
-					
+
 				.col-4 {
 					flex: 0 0 auto;
 					width: 33.3333333333%;
 					padding: 0 0;
 				}
-					
+
 				.offset-4 {
 					margin-left: 33.3333333333%;
 				}
-					
+
 				.col-5 {
 					flex: 0 0 auto;
 					width: 41.6666666667%;
 					padding: 0 0;
 				}
-					
+
 				.offset-5 {
 					margin-left: 41.6666666667%;
 				}
-					
+
 				.col-6 {
 					flex: 0 0 auto;
 					width: 50%;
 					padding: 0 0;
 				}
-					
+
 				.offset-6 {
 					margin-left: 50%;
 				}
-					
+
 				.col-7 {
 					flex: 0 0 auto;
 					width: 58.3333333333%;
 					padding: 0 0;
 				}
-					
+
 				.offset-7 {
 					margin-left: 58.3333333333%;
 				}
-					
+
 				.col-8 {
 					flex: 0 0 auto;
 					width: 66.6666666667%;
 					padding: 0 0;
 				}
-					
+
 				.offset-8 {
 					margin-left: 66.6666666667%;
 				}
-					
+
 				.col-9 {
 					flex: 0 0 auto;
 					width: 75%;
 					padding: 0 0;
 				}
-					
+
 				.offset-9 {
 					margin-left: 75%;
 				}
-					
+
 				.col-10 {
 					flex: 0 0 auto;
 					width: 83.3333333333%;
 					padding: 0 0;
 				}
-					
+
 				.offset-10 {
 					margin-left: 83.3333333333%;
 				}
-					
+
 				.col-11 {
 					flex: 0 0 auto;
 					width: 91.6666666667%;
 					padding: 0 0;
 				}
-					
+
 				.offset-11 {
 					margin-left: 91.6666666667%;
 				}
-					
+
 				.col-12 {
 					flex: 0 0 auto;
 					width: 100%;
 					padding: 0 0;
 				}
-					
+
 				.offset-12 {
 					margin-left: 100%;
 				}
-					
+
 				@media only screen and (width >= 576px) {
 					.col-sm-auto {
 						flex: 0 0 auto;
 						width: auto;
 						padding: 0 0;
 					}
-					
+
 					.col-sm-1 {
 						flex: 0 0 auto;
 						width: 8.3333333333%;
 					}
-					
+
 					.offset-sm-1 {
 						margin-left: 8.3333333333%;
 					}
-					
+
 					.col-sm-2 {
 						flex: 0 0 auto;
 						width: 16.6666666667%;
 					}
-					
+
 					.offset-sm-2 {
 						margin-left: 16.6666666667%;
 					}
-					
+
 					.col-sm-3 {
 						flex: 0 0 auto;
 						width: 25%;
 					}
-					
+
 					.offset-sm-3 {
 						margin-left: 25%;
 					}
-					
+
 					.col-sm-4 {
 						flex: 0 0 auto;
 						width: 33.3333333333%;
 					}
-					
+
 					.offset-sm-4 {
 						margin-left: 33.3333333333%;
 					}
-					
+
 					.col-sm-5 {
 						flex: 0 0 auto;
 						width: 41.6666666667%;
 					}
-					
+
 					.offset-sm-5 {
 						margin-left: 41.6666666667%;
 					}
-					
+
 					.col-sm-6 {
 						flex: 0 0 auto;
 						width: 50%;
 					}
-					
+
 					.offset-sm-6 {
 						margin-left: 50%;
 					}
-					
+
 					.col-sm-7 {
 						flex: 0 0 auto;
 						width: 58.3333333333%;
 					}
-					
+
 					.offset-sm-7 {
 						margin-left: 58.3333333333%;
 					}
-					
+
 					.col-sm-8 {
 						flex: 0 0 auto;
 						width: 66.6666666667%;
 					}
-					
+
 					.offset-sm-8 {
 						margin-left: 66.6666666667%;
 					}
-					
+
 					.col-sm-9 {
 						flex: 0 0 auto;
 						width: 75%;
 					}
-					
+
 					.offset-sm-9 {
 						margin-left: 75%;
 					}
-					
+
 					.col-sm-10 {
 						flex: 0 0 auto;
 						width: 83.3333333333%;
 					}
-					
+
 					.offset-sm-10 {
 						margin-left: 83.3333333333%;
 					}
-					
+
 					.col-sm-11 {
 						flex: 0 0 auto;
 						width: 91.6666666667%;
 					}
-					
+
 					.offset-sm-11 {
 						margin-left: 91.6666666667%;
 					}
-					
+
 					.col-sm-12 {
 						flex: 0 0 auto;
 						width: 100%;
 					}
-					
+
 					.offset-sm-12 {
 						margin-left: 100%;
 					}
 				}
-					
+
 				@media only screen and (width >= 768px) {
 					.col-md-auto {
 						flex: 0 0 auto;
 						width: auto;
 						padding: 0 0;
 					}
-					
+
 					.col-md-1 {
 						flex: 0 0 auto;
 						width: 8.3333333333%;
 					}
-					
+
 					.offset-md-1 {
 						margin-left: 8.3333333333%;
 					}
-					
+
 					.col-md-2 {
 						flex: 0 0 auto;
 						width: 16.6666666667%;
 					}
-					
+
 					.offset-md-2 {
 						margin-left: 16.6666666667%;
 					}
-					
+
 					.col-md-3 {
 						flex: 0 0 auto;
 						width: 25%;
 					}
-					
+
 					.offset-md-3 {
 						margin-left: 25%;
 					}
-					
+
 					.col-md-4 {
 						flex: 0 0 auto;
 						width: 33.3333333333%;
 					}
-					
+
 					.offset-md-4 {
 						margin-left: 33.3333333333%;
 					}
-					
+
 					.col-md-5 {
 						flex: 0 0 auto;
 						width: 41.6666666667%;
 					}
-					
+
 					.offset-md-5 {
 						margin-left: 41.6666666667%;
 					}
-					
+
 					.col-md-6 {
 						flex: 0 0 auto;
 						width: 50%;
 					}
-					
+
 					.offset-md-6 {
 						margin-left: 50%;
 					}
-					
+
 					.col-md-7 {
 						flex: 0 0 auto;
 						width: 58.3333333333%;
 					}
-					
+
 					.offset-md-7 {
 						margin-left: 58.3333333333%;
 					}
-					
+
 					.col-md-8 {
 						flex: 0 0 auto;
 						width: 66.6666666667%;
 					}
-					
+
 					.offset-md-8 {
 						margin-left: 66.6666666667%;
 					}
-					
+
 					.col-md-9 {
 						flex: 0 0 auto;
 						width: 75%;
 					}
-					
+
 					.offset-md-9 {
 						margin-left: 75%;
 					}
-					
+
 					.col-md-10 {
 						flex: 0 0 auto;
 						width: 83.3333333333%;
 					}
-					
+
 					.offset-md-10 {
 						margin-left: 83.3333333333%;
 					}
-					
+
 					.col-md-11 {
 						flex: 0 0 auto;
 						width: 91.6666666667%;
 					}
-					
+
 					.offset-md-11 {
 						margin-left: 91.6666666667%;
 					}
-					
+
 					.col-md-12 {
 						flex: 0 0 auto;
 						width: 100%;
 					}
-					
+
 					.offset-md-12 {
 						margin-left: 100%;
 					}
 				}
-					
+
 				@media only screen and (width >= 992px) {
 					.col-lg-auto {
 						flex: 0 0 auto;
 						width: auto;
 						padding: 0 0;
 					}
-					
+
 					.col-lg-1 {
 						flex: 0 0 auto;
 						width: 8.3333333333%;
 					}
-					
+
 					.offset-lg-1 {
 						margin-left: 8.3333333333%;
 					}
-					
+
 					.col-lg-2 {
 						flex: 0 0 auto;
 						width: 16.6666666667%;
 					}
-					
+
 					.offset-lg-2 {
 						margin-left: 16.6666666667%;
 					}
-					
+
 					.col-lg-3 {
 						flex: 0 0 auto;
 						width: 25%;
 					}
-					
+
 					.offset-lg-3 {
 						margin-left: 25%;
 					}
-					
+
 					.col-lg-4 {
 						flex: 0 0 auto;
 						width: 33.3333333333%;
 					}
-					
+
 					.offset-lg-4 {
 						margin-left: 33.3333333333%;
 					}
-					
+
 					.col-lg-5 {
 						flex: 0 0 auto;
 						width: 41.6666666667%;
 					}
-					
+
 					.offset-lg-5 {
 						margin-left: 41.6666666667%;
 					}
-					
+
 					.col-lg-6 {
 						flex: 0 0 auto;
 						width: 50%;
 					}
-					
+
 					.offset-lg-6 {
 						margin-left: 50%;
 					}
-					
+
 					.col-lg-7 {
 						flex: 0 0 auto;
 						width: 58.3333333333%;
 					}
-					
+
 					.offset-lg-7 {
 						margin-left: 58.3333333333%;
 					}
-					
+
 					.col-lg-8 {
 						flex: 0 0 auto;
 						width: 66.6666666667%;
 					}
-					
+
 					.offset-lg-8 {
 						margin-left: 66.6666666667%;
 					}
-					
+
 					.col-lg-9 {
 						flex: 0 0 auto;
 						width: 75%;
 					}
-					
+
 					.offset-lg-9 {
 						margin-left: 75%;
 					}
-					
+
 					.col-lg-10 {
 						flex: 0 0 auto;
 						width: 83.3333333333%;
 					}
-					
+
 					.offset-lg-10 {
 						margin-left: 83.3333333333%;
 					}
-					
+
 					.col-lg-11 {
 						flex: 0 0 auto;
 						width: 91.6666666667%;
 					}
-					
+
 					.offset-lg-11 {
 						margin-left: 91.6666666667%;
 					}
-					
+
 					.col-lg-12 {
 						flex: 0 0 auto;
 						width: 100%;
 					}
-					
+
 					.offset-lg-12 {
 						margin-left: 100%;
 					}
 				}
-					
+
 				@media only screen and (width >= 1200px) {
 					.col-xl-auto {
 						flex: 0 0 auto;
 						width: auto;
 						padding: 0 0;
 					}
-					
+
 					.col-xl-1 {
 						flex: 0 0 auto;
 						width: 8.3333333333%;
 					}
-					
+
 					.offset-xl-1 {
 						margin-left: 8.3333333333%;
 					}
-					
+
 					.col-xl-2 {
 						flex: 0 0 auto;
 						width: 16.6666666667%;
 					}
-					
+
 					.offset-xl-2 {
 						margin-left: 16.6666666667%;
 					}
-					
+
 					.col-xl-3 {
 						flex: 0 0 auto;
 						width: 25%;
 					}
-					
+
 					.offset-xl-3 {
 						margin-left: 25%;
 					}
-					
+
 					.col-xl-4 {
 						flex: 0 0 auto;
 						width: 33.3333333333%;
 					}
-					
+
 					.offset-xl-4 {
 						margin-left: 33.3333333333%;
 					}
-					
+
 					.col-xl-5 {
 						flex: 0 0 auto;
 						width: 41.6666666667%;
 					}
-					
+
 					.offset-xl-5 {
 						margin-left: 41.6666666667%;
 					}
-					
+
 					.col-xl-6 {
 						flex: 0 0 auto;
 						width: 50%;
 					}
-					
+
 					.offset-xl-6 {
 						margin-left: 50%;
 					}
-					
+
 					.col-xl-7 {
 						flex: 0 0 auto;
 						width: 58.3333333333%;
 					}
-					
+
 					.offset-xl-7 {
 						margin-left: 58.3333333333%;
 					}
-					
+
 					.col-xl-8 {
 						flex: 0 0 auto;
 						width: 66.6666666667%;
 					}
-					
+
 					.offset-xl-8 {
 						margin-left: 66.6666666667%;
 					}
-					
+
 					.col-xl-9 {
 						flex: 0 0 auto;
 						width: 75%;
 					}
-					
+
 					.offset-xl-9 {
 						margin-left: 75%;
 					}
-					
+
 					.col-xl-10 {
 						flex: 0 0 auto;
 						width: 83.3333333333%;
 					}
-					
+
 					.offset-xl-10 {
 						margin-left: 83.3333333333%;
 					}
-					
+
 					.col-xl-11 {
 						flex: 0 0 auto;
 						width: 91.6666666667%;
 					}
-					
+
 					.offset-xl-11 {
 						margin-left: 91.6666666667%;
 					}
-					
+
 					.col-xl-12 {
 						flex: 0 0 auto;
 						width: 100%;
 					}
-					
+
 					.offset-xl-12 {
 						margin-left: 100%;
 					}
 				}
-					
+
 				@media only screen and (width >= 1400px) {
 					.col-xxl-auto {
 						flex: 0 0 auto;
 						width: auto;
 						padding: 0 0;
 					}
-					
+
 					.col-xxl-1 {
 						flex: 0 0 auto;
 						width: 8.3333333333%;
 					}
-					
+
 					.offset-xxl-1 {
 						margin-left: 8.3333333333%;
 					}
-					
+
 					.col-xxl-2 {
 						flex: 0 0 auto;
 						width: 16.6666666667%;
 					}
-					
+
 					.offset-xxl-2 {
 						margin-left: 16.6666666667%;
 					}
-					
+
 					.col-xxl-3 {
 						flex: 0 0 auto;
 						width: 25%;
 					}
-					
+
 					.offset-xxl-3 {
 						margin-left: 25%;
 					}
-					
+
 					.col-xxl-4 {
 						flex: 0 0 auto;
 						width: 33.3333333333%;
 					}
-					
+
 					.offset-xxl-4 {
 						margin-left: 33.3333333333%;
 					}
-					
+
 					.col-xxl-5 {
 						flex: 0 0 auto;
 						width: 41.6666666667%;
 					}
-					
+
 					.offset-xxl-5 {
 						margin-left: 41.6666666667%;
 					}
-					
+
 					.col-xxl-6 {
 						flex: 0 0 auto;
 						width: 50%;
 					}
-					
+
 					.offset-xxl-6 {
 						margin-left: 50%;
 					}
-					
+
 					.col-xxl-7 {
 						flex: 0 0 auto;
 						width: 58.3333333333%;
 					}
-					
+
 					.offset-xxl-7 {
 						margin-left: 58.3333333333%;
 					}
-					
+
 					.col-xxl-8 {
 						flex: 0 0 auto;
 						width: 66.6666666667%;
 					}
-					
+
 					.offset-xxl-8 {
 						margin-left: 66.6666666667%;
 					}
-					
+
 					.col-xxl-9 {
 						flex: 0 0 auto;
 						width: 75%;
 					}
-					
+
 					.offset-xxl-9 {
 						margin-left: 75%;
 					}
-					
+
 					.col-xxl-10 {
 						flex: 0 0 auto;
 						width: 83.3333333333%;
 					}
-					
+
 					.offset-xxl-10 {
 						margin-left: 83.3333333333%;
 					}
-					
+
 					.col-xxl-11 {
 						flex: 0 0 auto;
 						width: 91.6666666667%;
 					}
-					
+
 					.offset-xxl-11 {
 						margin-left: 91.6666666667%;
 					}
-					
+
 					.col-xxl-12 {
 						flex: 0 0 auto;
 						width: 100%;
 					}
-					
+
 					.offset-xxl-12 {
 						margin-left: 100%;
 					}
@@ -932,7 +926,7 @@ vars.$testing: true;
 						padding: 0 8px;
 					}
 				}
-                    
+
 				.col-auto {
 					flex: 0 0 auto;
 					width: auto;
@@ -944,21 +938,25 @@ vars.$testing: true;
 						flex-direction: row-reverse;
 					}
 				}
+
 				@media only screen and (width >= 768px) {
 					.row.reverse-row-md {
 						flex-direction: row-reverse;
 					}
 				}
+
 				@media only screen and (width >= 992px) {
 					.row.reverse-row-lg {
 						flex-direction: row-reverse;
 					}
 				}
+
 				@media only screen and (width >= 1200px) {
 					.row.reverse-row-xl {
 						flex-direction: row-reverse;
 					}
 				}
+
 				@media only screen and (width >= 1400px) {
 					.row.reverse-row-xxl {
 						flex-direction: row-reverse;
@@ -967,6 +965,7 @@ vars.$testing: true;
 
 				.row.reverse-row-under-sm {
 					flex-direction: row-reverse;
+
 					@media only screen and (width >= 576px) {
 						flex-direction: row;
 					}
@@ -974,6 +973,7 @@ vars.$testing: true;
 
 				.row.reverse-row-under-md {
 					flex-direction: row-reverse;
+
 					@media only screen and (width >= 768px) {
 						flex-direction: row;
 					}
@@ -981,6 +981,7 @@ vars.$testing: true;
 
 				.row.reverse-row-under-lg {
 					flex-direction: row-reverse;
+
 					@media only screen and (width >= 992px) {
 						flex-direction: row;
 					}
@@ -988,6 +989,7 @@ vars.$testing: true;
 
 				.row.reverse-row-under-xl {
 					flex-direction: row-reverse;
+
 					@media only screen and (width >= 1200px) {
 						flex-direction: row;
 					}
@@ -995,27 +997,28 @@ vars.$testing: true;
 
 				.row.reverse-row-under-xxl {
 					flex-direction: row-reverse;
+
 					@media only screen and (width >= 1400px) {
 						flex-direction: row;
 					}
 				}
-                    
+
 				.col-1 {
 					flex: 0 0 auto;
 					width: 50%;
 					padding: 0 8px;
 				}
-                    
+
 				.offset-1 {
 					margin-left: 50%;
 				}
-                    
+
 				.col-2 {
 					flex: 0 0 auto;
 					width: 100%;
 					padding: 0 8px;
 				}
-                    
+
 				.offset-2 {
 					margin-left: 100%;
 				}
@@ -1026,21 +1029,21 @@ vars.$testing: true;
 						width: auto;
 						padding: 0 8px;
 					}
-				  
+
 					.col-sm-1 {
 						flex: 0 0 auto;
 						width: 50%;
 					}
-				  
+
 					.offset-sm-1 {
 						margin-left: 50%;
 					}
-				  
+
 					.col-sm-2 {
 						flex: 0 0 auto;
 						width: 100%;
 					}
-				  
+
 					.offset-sm-2 {
 						margin-left: 100%;
 					}
@@ -1052,21 +1055,21 @@ vars.$testing: true;
 						width: auto;
 						padding: 0 8px;
 					}
-				  
+
 					.col-md-1 {
 						flex: 0 0 auto;
 						width: 50%;
 					}
-				  
+
 					.offset-md-1 {
 						margin-left: 50%;
 					}
-				  
+
 					.col-md-2 {
 						flex: 0 0 auto;
 						width: 100%;
 					}
-				  
+
 					.offset-md-2 {
 						margin-left: 100%;
 					}
@@ -1078,21 +1081,21 @@ vars.$testing: true;
 						width: auto;
 						padding: 0 8px;
 					}
-				  
+
 					.col-lg-1 {
 						flex: 0 0 auto;
 						width: 50%;
 					}
-				  
+
 					.offset-lg-1 {
 						margin-left: 50%;
 					}
-				  
+
 					.col-lg-2 {
 						flex: 0 0 auto;
 						width: 100%;
 					}
-				  
+
 					.offset-lg-2 {
 						margin-left: 100%;
 					}
@@ -1104,21 +1107,21 @@ vars.$testing: true;
 						width: auto;
 						padding: 0 8px;
 					}
-				  
+
 					.col-xl-1 {
 						flex: 0 0 auto;
 						width: 50%;
 					}
-				  
+
 					.offset-xl-1 {
 						margin-left: 50%;
 					}
-				  
+
 					.col-xl-2 {
 						flex: 0 0 auto;
 						width: 100%;
 					}
-				  
+
 					.offset-xl-2 {
 						margin-left: 100%;
 					}
@@ -1130,21 +1133,21 @@ vars.$testing: true;
 						width: auto;
 						padding: 0 8px;
 					}
-				  
+
 					.col-xxl-1 {
 						flex: 0 0 auto;
 						width: 50%;
 					}
-				  
+
 					.offset-xxl-1 {
 						margin-left: 50%;
 					}
-				  
+
 					.col-xxl-2 {
 						flex: 0 0 auto;
 						width: 100%;
 					}
-				  
+
 					.offset-xxl-2 {
 						margin-left: 100%;
 					}