flint-gs 1.0.2 → 1.0.3

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA1:
-  metadata.gz: adefc77ec25fe16ff919991e24879bc0f4dc759f
-  data.tar.gz: 14f25ce075162d8c41598646bbba8758325c66df
+  metadata.gz: 301e82276044ec3edab3bfb8e4f8bbfce2d51ecf
+  data.tar.gz: 4b4d85d4177a1a226030b7ff06c93e881c39fbef
 SHA512:
-  metadata.gz: 0651467cea2967bfb00279911a5bd7931160764ae0016e3d39021f8370a4932497ef33961dd331cc387f6c0600fbc0ac711bb4737b0559bfbac2498c331dc7e5
-  data.tar.gz: caa94185ced8f076b0a8c7c80d6d39e72a3840aedc5cf1de42eebe8f948f4ea6760586a27ad3fbdb0efdbfce83ede28e1785ddf159bb6343666fc90cb63832b7
+  metadata.gz: d0930c264816cf32f4b27380ed421613b18dc4b35f9cff3d417040f057b812a38bfb2bed5b4fcd28562ac6a4e7acdcfb3015c36cea01532a8d59806418c83fa8
+  data.tar.gz: 54060b0c7d3943a359438e42f79819d672f398efa2711961079431f2087590238a3a0eb1e4cfe9f9c60d82bb3a70012542e4ef4e7c49c803135be783134d93c0

data/README.md

@@ -10,15 +10,15 @@ Enjoy.
 
 ###Installation
 
-[1] `gem install flint-gs`
-[2] Add `require "flint"` to your `config.rb`
-[3] Import it in your stylesheets with `@import "flint";`
+1. `gem install flint-gs`
+2. Add `require "flint"` to your `config.rb`
+3. Import it in your stylesheets with `@import "flint";`
 
 If you don't want to install the gem, download/clone the current build files and use the starter `config.rb` to require any custom functions Flint uses. Currently this is required, as we're making use of custom SassScript functions until the 'script `&`' [returns to Sass](https://gist.github.com/nex3/8050187). Adjust the paths according to your project.
 
 ###Config
 
-Flint's `config map` is unique in the ability that you may define an unlimited number of breakpoints for your project. Whether that be 2 breakpoints, or even 12. You're in full control of your columns as well. Also, unlike most frameworks, you may name these anything that you like. Flint is smart and will figure out which one you're talking about.
+Flint's `config map` is unique in the ability that you may define an unlimited number of breakpoints for your project. Whether that be 2 breakpoints, or even 12. You're in full control of your columns as well. Also, unlike most frameworks, you may name these anything that you like. Flint is smart and will figure out which one you're talking about. To begin, you can either use the default config (below) which comes baked in, or you can define your own using the `$flint` variable using the template below.
 
 Settings may be entered in `px` or `em`, and Flint will do the rest.
 
@@ -138,34 +138,34 @@ Outputs, *(with debug mode on)*
   width: 17.1875%;
   margin-right: 0.78125%;
   margin-left: 0.78125%;
-  -flint-instance-count: 1;
-  -flint-key: desktop;
-  -flint-breakpoint: 1280px;
-  -flint-columns: 16;
-  -flint-span: 3;
-  -flint-context: NULL;
-  -flint-gutter: NULL;
-  -flint-shift: NULL;
-  -flint-output-width: 17.1875%;
-  -flint-output-margin-right: 0.78125%;
-  -flint-output-margin-left: 0.78125%;
+  -flint--instance-count: 1;
+  -flint--key: desktop;
+  -flint--breakpoint: 1280px;
+  -flint--columns: 16;
+  -flint--span: 3;
+  -flint--context: NULL;
+  -flint--gutter: NULL;
+  -flint--shift: NULL;
+  -flint--output-width: 17.1875%;
+  -flint--output-margin-right: 0.78125%;
+  -flint--output-margin-left: 0.78125%;
 }
 @media only screen and (min-width: 641px) and (max-width: 960px) {
   .recursive {
     width: 22.91667%;
     margin-right: 1.04167%;
     margin-left: 1.04167%;
-    -flint-instance-count: 2;
-    -flint-key: laptop;
-    -flint-breakpoint: 960px;
-    -flint-columns: 12;
-    -flint-span: 3;
-    -flint-context: NULL;
-    -flint-gutter: NULL;
-    -flint-shift: NULL;
-    -flint-output-width: 22.91667%;
-    -flint-output-margin-right: 1.04167%;
-    -flint-output-margin-left: 1.04167%;
+    -flint--instance-count: 2;
+    -flint--key: laptop;
+    -flint--breakpoint: 960px;
+    -flint--columns: 12;
+    -flint--span: 3;
+    -flint--context: NULL;
+    -flint--gutter: NULL;
+    -flint--shift: NULL;
+    -flint--output-width: 22.91667%;
+    -flint--output-margin-right: 1.04167%;
+    -flint--output-margin-left: 1.04167%;
   }
 }
 @media only screen and (min-width: 321px) and (max-width: 640px) {
@@ -173,17 +173,17 @@ Outputs, *(with debug mode on)*
     width: 34.375%;
     margin-right: 1.5625%;
     margin-left: 1.5625%;
-    -flint-instance-count: 3;
-    -flint-key: tablet;
-    -flint-breakpoint: 640px;
-    -flint-columns: 8;
-    -flint-span: 3;
-    -flint-context: NULL;
-    -flint-gutter: NULL;
-    -flint-shift: NULL;
-    -flint-output-width: 34.375%;
-    -flint-output-margin-right: 1.5625%;
-    -flint-output-margin-left: 1.5625%;
+    -flint--instance-count: 3;
+    -flint--key: tablet;
+    -flint--breakpoint: 640px;
+    -flint--columns: 8;
+    -flint--span: 3;
+    -flint--context: NULL;
+    -flint--gutter: NULL;
+    -flint--shift: NULL;
+    -flint--output-width: 34.375%;
+    -flint--output-margin-right: 1.5625%;
+    -flint--output-margin-left: 1.5625%;
   }
 }
 @media only screen and (min-width: 0) and (max-width: 320px) {
@@ -191,17 +191,17 @@ Outputs, *(with debug mode on)*
     width: 68.75%;
     margin-right: 3.125%;
     margin-left: 3.125%;
-    -flint-instance-count: 4;
-    -flint-key: mobile;
-    -flint-breakpoint: 320px;
-    -flint-columns: 4;
-    -flint-span: 3;
-    -flint-context: NULL;
-    -flint-gutter: NULL;
-    -flint-shift: NULL;
-    -flint-output-width: 68.75%;
-    -flint-output-margin-right: 3.125%;
-    -flint-output-margin-left: 3.125%;
+    -flint--instance-count: 4;
+    -flint--key: mobile;
+    -flint--breakpoint: 320px;
+    -flint--columns: 4;
+    -flint--span: 3;
+    -flint--context: NULL;
+    -flint--gutter: NULL;
+    -flint--shift: NULL;
+    -flint--output-width: 68.75%;
+    -flint--output-margin-right: 3.125%;
+    -flint--output-margin-left: 3.125%;
   }
 }
 ```

data/lib/flint.rb

@@ -5,7 +5,7 @@ Compass::Frameworks.register('flint', :path => extension_path)
 #  Version is a number. If a version contains alphas, it will be created as a prerelease version
 #  Date is in the form of YYYY-MM-DD
 module Flint
-  VERSION = "1.0.2"
+  VERSION = "1.0.3"
   DATE = "2014-04-21"
 end
 

data/stylesheets/flint/config/_config.scss

@@ -27,7 +27,7 @@ $flint: (
             "max-width": false, // [true : uses highest breakpoint | false | value(unit)]
             "center-container": true, // [true | false]
             "border-box-sizing": true, // [true | false]
-            "debug-mode": true, // [true | false]
+            "debug-mode": true, // [true | false ]
         ),
     ),
 ) !default;

data/stylesheets/flint/functions/_functions.scss

@@ -21,6 +21,6 @@
 @import "lib/purge";
 @import "lib/replace";
 @import "lib/remove";
-@import "lib/family-instance-exists";
+@import "lib/get-family-instance";
 @import "lib/get-instance-value";
 @import "lib/string-to-number";

data/stylesheets/flint/functions/helpers/_helpers.scss

@@ -1,3 +1,13 @@
+// Returns truthiness of a value
+// -------------------------------------------------------------------------------
+// @param $value [Literal] : value
+// -------------------------------------------------------------------------------
+// @return [Boolean]
+
+@function is-true($value) {
+	@return if($value == null, false, $value and $value != null and $value != "" and $value != ());
+}
+
 // Checks if item is map
 //--------------------------------------------------------------------------------
 // @param $n [Value] : value
@@ -129,14 +139,4 @@
 			}
 		}
 	} @return $all-columns;
-}
-
-// Returns truthiness of a value
-// -------------------------------------------------------------------------------
-// @param $value [Literal] : value
-// -------------------------------------------------------------------------------
-// @return [Boolean]
-
-@function is-true($value) {
-	@return if($value == null, false, $value and $value != null and $value != "" and $value != ());
 }

data/stylesheets/flint/functions/lib/{_family-instance-exists.scss → _get-family-instance.scss}

@@ -11,7 +11,7 @@
 // -------------------------------------------------------------------------------
 // @return [Selectors] | false
 
-@function family-instance-exists($key: get-value(settings, default)) {
+@function get-family-instance($key: get-value(settings, default)) {
 	$selector-string: selector_string();
 	$selector-list: string-to-list($selector-string);
 	$length: length($selector-list);

data/stylesheets/flint/functions/lib/_get-instance-value.scss

@@ -12,8 +12,8 @@
 
 @function get-instance-value($key, $value, $deep: NULL) {
 	@if $deep == NULL {
-		@return map-fetch($flint__instances, family-instance-exists($key) $value);
+		@return map-fetch($flint__instances, get-family-instance($key) $value);
 	} @else {
-		@return map-fetch($flint__instances, family-instance-exists($key) $value $deep);
+		@return map-fetch($flint__instances, get-family-instance($key) $value $deep);
 	}
 }

data/stylesheets/flint/functions/lib/_string-to-list.scss

@@ -1,14 +1,14 @@
 // Turns string into a flat list
 // -------------------------------------------------------------------------------
 // @param $string [String] : string
+// @param $find [Separator] : item to find which separates substrings (default is single space [" "])
 // -------------------------------------------------------------------------------
 // @return [List] | error
 
-@function string-to-list($string) {
+@function string-to-list($string, $find: " ") {
 	@if is-string($string) {
 		$string-list: ();
 		$space-indexes: ();
-		$find: " ";
 		$length: str-length($string);
 		// Find all spaces and their indices by looking over each character in string
 		@for $i from 1 through $length {

data/stylesheets/flint/mixins/lib/_flint-calculate.scss

@@ -9,7 +9,6 @@
 // -------------------------------------------------------------------------------
 // @output [Styles...]
 
-// Calculates width and margins based on passed arguments
 @mixin calcFlint ($calcKey, $calcSpan, $calcContext, $calcGutter, $calcShift, $i: NULL) {
 
 	@if $i != NULL {
@@ -110,13 +109,13 @@
 
 	} @else if $calcContext != NULL {
 		// Check if context of parent instance exists
-		$exists: family-instance-exists($calcKey);
+		$exists: get-family-instance($calcKey);
 
 		@if $calcShift != NULL {
 			@if $calcGutter == NULL and get-value(settings, gutter) != false {
 				// Check if context is set to auto
 				@if $calcContext == "auto" {
-					// Did it exist?
+					// Does parent exist?
 					@if $exists != false {
 
 						$outputWidth: (calc-width($calcKey, $calcSpan, to-number(get-instance-value($calcKey, span)))) - ((calc-margin($calcKey, $calcSpan, to-number(get-instance-value($calcKey, span))))*2);

data/stylesheets/flint/mixins/lib/_flint-main.scss

@@ -15,13 +15,11 @@
 	@if $key == "foundation" {
 
 		// apply global border-box-sizing if true
-
 		@if get-value(settings, border-box-sizing) == true {
 			$foundation: "existant" !global;
 		}
 		
 		// foundation is now globally existant
-		
 		@if $foundation == "existant" {
 			@at-root *, *:before, *:after {
 	  			-moz-box-sizing: border-box;
@@ -45,7 +43,6 @@
 	{
 
 		// only apply display rule if the key is the default
-
 		@if $key == get-value(settings, default) or $key == "container" {
 
 			display: block;
@@ -62,25 +59,21 @@
 		}
 		
 		// apply individually if foundation is not set globally, but is set to true in config
-		
 		@if get-value(settings, border-box-sizing) == true and $foundation == "nonexistant" {
   			-moz-box-sizing: border-box;
 			-webkit-box-sizing: border-box;
 			box-sizing: border-box;
 
 			// warn to either set a global foundation, or turn border-box-sizing off
-
 			@if global-variable-exists(global-foundation-is-set) == false {
 				@warn "Global foundation is #{$foundation}. To avoid repeated box-sizing incidents, set a global flint(foundation) rule, or turn border-box-sizing to false in your config file.";
 
 				// declare global variable so only a single warning prints out
-
 				$global-foundation-is-set: true !global;
 			}
 		}
 
 		// check if max-width is set
-
 		@if get-value(settings, max-width) == true {
 			max-width: max(get-all-breakpoints()...);
 		} @else if type-of(get-value(settings, max-width)) == number {
@@ -88,7 +81,6 @@
 		}
 
 		// check if center container is set to true
-
 		@if $key == "container" {
 			float: none;
 
@@ -437,7 +429,6 @@
 	} @else if exists($flint, $key) and $span == NULL and $context == NULL or length($key) > 1 {
 
 		// only key-x breakpoint
-
 		@if length($key) == 1 {
 			
 			@if is-highest-breakpoint($key) == true {
@@ -450,22 +441,19 @@
 				}
 			}
 
-			// from key breakpoint to infinity
-
+		// from key breakpoint to infinity
 		} @else if length($key) > 1 and nth($key, 1) == "from" and nth($key, 3) == "to" and nth($key, 4) == "infinity" {
 			@media only screen and ( min-width: calc-breakpoint(from, nth($key, 2), get-index(nth($key, 2))) ) {
 				@content;
 			}
 
-			// from key-x breakpoint to key-y breakpoint
-
+		// from key-x breakpoint to key-y breakpoint
 		} @else if length($key) > 1 and nth($key, 1) == "from" and nth($key, 3) == "to" {
 			@media only screen and ( min-width: calc-breakpoint(from, nth($key, 2), get-index(nth($key, 2))) ) and ( max-width: calc-breakpoint(to, nth($key, 4), get-index(nth($key, 4))) ) {
 				@content;
 			}
 
-			// greater than key-x breakpoint
-
+		// greater than key-x breakpoint
 		} @else if length($key) > 1 and nth($key, 1) == "greater" and nth($key, 2) == "than" {
 			@if get-value(settings, grid) == "fluid" {
 				@media only screen and ( min-width: (calc-breakpoint(to, nth($key, 3), get-index(nth($key, 3))) + 1) ) {
@@ -477,15 +465,13 @@
 				}
 			}
 
-			// (y)px greater than key-x breakpoint
-
+		// (y)px greater than key-x breakpoint
 		} @else if length($key) > 1 and nth($key, 2) == "greater" and nth($key, 3) == "than" {
 			@media only screen and ( min-width: (calc-breakpoint(to, nth($key, 4), get-index(nth($key, 4))) + nth($key, 1)) ) {
 				@content;
 			}
 
-			// less than key-x breakpoint
-
+		// less than key-x breakpoint
 		} @else if length($key) > 1 and nth($key, 1) == "less" and nth($key, 2) == "than" {
 			@if get-value(settings, grid) == "fluid" {
 				@media only screen and ( max-width: (calc-breakpoint(to, nth($key, 3), get-index(nth($key, 3))) - 1) ) {
@@ -497,15 +483,13 @@
 				}
 			}
 
-			// (y)px less than key-x breakpoint
-
+		// (y)px less than key-x breakpoint
 		} @else if length($key) > 1 and nth($key, 2) == "less" and nth($key, 3) == "than" {
 			@media only screen and ( max-width: (calc-breakpoint(to, nth($key, 4), get-index(nth($key, 4))) - nth($key, 1)) ) {
 				@content;
 			}
 
-			// for key-x key-y key-z
-
+		// for key-x key-y key-z
 		} @else if length($key) > 1 and nth($key, 1) == "for" {
 			@for $i from 1 through length($key) {
 				@if exists($flint, nth($key, $i)) {

data/stylesheets/flint/mixins/lib/_print-instance.scss

@@ -25,7 +25,7 @@
 	@each $property, $value in $instance {
 
 		// Check if value is output map
-		@if is_map($value) {
+		@if is-map($value) {
 			@each $mod_property, $mod_value in $value {
 				-flint--output-#{$mod_property}: #{$mod_value};
 			}

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: flint-gs
 version: !ruby/object:Gem::Version
-  version: 1.0.2
+  version: 1.0.3
 platform: ruby
 authors:
 - Ezekiel Gabrielse
@@ -59,8 +59,8 @@ files:
 - stylesheets/flint/functions/lib/_calc-margin.scss
 - stylesheets/flint/functions/lib/_calc-width.scss
 - stylesheets/flint/functions/lib/_exists.scss
-- stylesheets/flint/functions/lib/_family-instance-exists.scss
 - stylesheets/flint/functions/lib/_fluid-width.scss
+- stylesheets/flint/functions/lib/_get-family-instance.scss
 - stylesheets/flint/functions/lib/_get-index.scss
 - stylesheets/flint/functions/lib/_get-instance-value.scss
 - stylesheets/flint/functions/lib/_get-substring.scss