From f33c91b1747b60ded39c28060400c5715d0a2c05 Mon Sep 17 00:00:00 2001
From: UnderlineWords <fatih.kececi@yahoo.co.uk>
Date: Sun, 7 Jun 2020 06:11:03 +0300
Subject: [PATCH] Optimized grider.scss

---
 grider.scss | 23 +++++++++++++----------
 1 file changed, 13 insertions(+), 10 deletions(-)

diff --git a/grider.scss b/grider.scss
index cc15b6f..c93c063 100644
--- a/grider.scss
+++ b/grider.scss
@@ -6,13 +6,12 @@
 
 /*** BASIC ***/
 	$grid: 16;
-	$gutter: 4%;
 
 /*** NAMES ***/
 	$row-name: 'row';
 	$container-name: 'container';
 	$column-name: 'col';
-	$column-name-small: 'sm';
+	$offset: 'offset';
 
 /*** CONTAINER ***/
 	$container-width: 97%;
@@ -24,7 +23,7 @@
 
 /*** COLUMN ***/
 	$column-width: 100%;
-	$column-margin: .3rem;
+	$column-padding: 0;
 	$column-min-height: .125rem;
 
 /*** BREAKPOINTS ***/
@@ -61,23 +60,27 @@
 	width: $row-width;
 	[class^="#{$column-name}"] {
 		float: left;
-		margin: $column-margin;
+		padding: $column-padding;
 		min-height: $column-min-height;
-		flex-grow: 1;
-		max-width: 100%;
 	}
 	@for $i from 1 through $grid {
 		.#{$column-name}-#{$i} {
-			width: $column-width;
+			flex-basis: $column-width; 
 		}
-		.#{$column-name}-#{$i}-#{$column-name-small} {
-			width: ($column-width / ($grid / $i)) - ($gutter * ($grid - $i) / $grid); 
+		.#{$column-name}-#{$offset}-#{$i} {
+			margin-left: 0;
+			flex-basis: $column-width; 
 		}
 	}
 	@include breakpoints($breakpoint-medium) {
 		@for $i from 1 through $grid {
+			$value : (100 / ($grid / $i) ) * 1%;
 			.#{$column-name}-#{$i} { 
-				width: ($column-width / ($grid / $i)) - ($gutter * ($grid - $i) / $grid); 
+				flex-basis: $value; 
+			}
+			.#{$column-name}-#{$offset}-#{$i} {
+				flex-basis: $value;
+				margin-left: $value;
 			}
 		}
 	}