Initial commit

themes/coopgo-theme/assets/sass/coopgo-web-ui-kit/_helpers.scss

@@ -0,0 +1,77 @@
+/* WIDTH */ 
+
+$widthvalues: (0, 5, 10, 15, 20, 25, 30, 35, 40, 45, 50, 75, 100, 125, 150, 200, 300, 400, 500, 600, 700, 800, 900, 1000, 1024);
+
+@each $width in $widthvalues {
+    .w-#{$width} {
+        width: #{$width}px;
+    }
+
+    .max-w-#{$width} {
+        max-width: #{$width}px;
+    }
+
+    .min-w-#{$width} {
+        min-width: #{$width}px;
+    }
+
+    .h-#{$width} {
+        height: #{$width}px;
+    }
+
+    .max-h-#{$width} {
+        max-height: #{$width}px;
+    }
+
+    .min-h-#{$width} {
+        min-height: #{$width}px;
+    }
+}
+
+
+.w-full {
+    width: 100% !important;
+}
+
+/* POSITIONING */
+
+.ta-r {
+    text-align: right;
+}
+.ta-l {
+    text-align: left;
+}
+.ta-c {
+    text-align: center;
+}
+.ta-j {
+    text-align: justify;
+}
+
+/* SPACINGS */ 
+.m-auto {
+    margin: auto;
+}
+
+$spaceamounts: (0, 5, 10, 15, 20, 25, 30, 35, 40, 45, 50, 75, 100, 125, 200, 300);
+$sides: (top, bottom, left, right);
+
+@each $space in $spaceamounts {
+
+    .m-#{$space} {
+        margin: #{$space}px !important;
+    }
+    .p-#{$space} {
+        padding: #{$space}px !important;
+    }
+
+    @each $side in $sides {
+        .m-#{str-slice($side, 0, 1)}-#{$space} {
+            margin-#{$side}: #{$space}px !important;
+        }
+
+        .p-#{str-slice($side, 0, 1)}-#{$space} {
+            padding-#{$side}: #{$space}px !important;
+        }
+    }
+}