minor fixes and updated helpers

Author: UnderlineWords

src/Utilities/helpers.scss

@@ -1,6 +1,7 @@
 /////////////////////////////////////////////////////////
 /// PUNICA CSS > UTILITIES : HELPERS
 /////////////////////////////////////////////////////////
+@import "variables";
 @import "mixins";
 ///
 ///
@@ -33,6 +34,7 @@
 	/// Background Colors
 	///
 	@include setHelperList($bg-colors, "background-color", "!important");
+	@include setColorScale($bg-colors);
 
 	///
 	/// Cursors

src/Utilities/mixins.scss

@@ -111,6 +111,28 @@
 	#{$property}: #{$value}#{$value-type} #{$specificity};
 }
 
+///
+/// Color Scale
+/// @param {Array} $colors
+///
+@mixin setColorScale($colors) {
+	@for $i from 5 through 35 {
+		@each $class, $color in $colors {
+			@if $i % 5 == 0 {
+				$percentage: $i*1%;
+				// darken
+				.#{$class}-darken-#{$i} {
+					background-color: darken($color, $percentage);
+				}
+				// lighten
+				.#{$class}-lighten-#{$i} {
+					background-color: lighten($color, $percentage);
+				}
+			}
+		}
+	}
+}
+
 ///
 /// Other Helpers
 ///

src/punica.scss

@@ -2,7 +2,7 @@
 /// PUNICA CSS
 /////////////////////////////////////////////////////////
 // ======================================================
-$active-theme: default; // active theme name 
+$active-theme: default; // active theme name
 // ======================================================
 
 /// Class names & Framework Options =====================
@@ -14,8 +14,8 @@ $active-theme: default; // active theme name
 
 /// Global Getter functions, Mixins & Variables =========
 @import "_global/_getters";
-@import "_global/mixins";
 @import "_global/variables";
+@import "_global/mixins";
 
 /// Active Theme ========================================
 @include get-theme() {
@@ -33,7 +33,6 @@ $active-theme: default; // active theme name
 	@import "Layout/variables";
 	@import "Elements/variables";
 	@import "Components/variables";
-	@import "Utilities/variables"; 
 	///
 	@import "Layout/index";
 	@import "Elements/index";