sugarcss 1.0.0

data/stylesheets/sugar/_functions.scss

@@ -0,0 +1,328 @@
+//
+// Handle nested
+//
+$_s_nested_properties : ();
+$_s_nested_properties_depth : ();
+@function _sugar-handle-nested(
+	$name,
+	$map
+) {
+	@if map-get($_s_nested_properties, $name) {
+		$map : map-merge(map-get($_s_nested_properties, $name), $map);
+	} @else {
+		$_s_nested_properties : map-set($_s_nested_properties, $name, $map) !global;
+	}
+	@return $map;
+}
+@mixin _sugar-handle-nested(
+	$args...
+) {
+	@each $arg in $args {
+		$name : $arg;
+		// up depth
+		$depth : map-get($_s_nested_properties_depth, $name);
+		@if $depth == null or $depth == 0 {
+			$depth : 1;
+		} @else {
+			$depth : $depth + 1;
+		}
+		
+		$_s_nested_properties_depth : map-set($_s_nested_properties_depth, $name, $depth) !global;
+	}
+
+	@content;
+
+	@each $arg in $args {
+		$name : $arg;
+		$reset : false;
+		$depth : map-get($_s_nested_properties_depth, $name);
+		$depth : $depth - 1;
+		$_s_nested_properties_depth : map-set($_s_nested_properties_depth, $name, $depth) !global;
+		@if $depth <= 0 {
+			$reset : true;
+		}
+		@if $reset {
+			$_s_nested_properties : map-set($_s_nested_properties, $name, null) !global;
+		}
+	}
+
+	
+}
+
+//
+// Parse properties
+//
+@function _sugar-parse-properties(
+	$properties,
+	$keywords,
+	$aliases : ()
+) {
+	// default aliases
+	$aliases : map-merge($aliases, (
+		width : w,
+		height : h,
+		color : c,
+		top : t,
+		right : r,
+		bottom : b,
+		left : l
+	));
+
+	// check if is a map or a list
+	@if type-of($properties) == map {
+		$new-map : ();
+
+		// loop on each properties to 
+		@each $prop, $value in $properties {
+
+			// check if exist
+			$in_keywords : map-get($keywords, $prop);
+
+			// if not in keywords, try to get the alias
+			@if $in_keywords == null {
+
+				$alias_found : false;
+				@each $alias_prop, $alias in $aliases {
+					@if $alias_found == false {
+						$al : index($alias, $prop);
+						@if $al or type-of($alias) == string and $prop == $alias {
+							$alias_found : true;
+							$prop : $alias_prop;
+						}
+					}
+				}
+				// check again if now we have a property like this
+				$in_keywords : map-get($keywords, $prop);
+			}
+
+			// if we have found, check the type
+			@if $in_keywords {
+
+				// check explicit values
+				@if type-of($in_keywords) == list {
+					// check if the passed value exist in possible values
+					@if type-of($value) == list and index($in_keywords, length) {
+						$new-map : map-set($new-map, $prop, $value);
+					} @else if type-of($value) == number and index($in_keywords, length) {
+						$new-map : map-set($new-map, $prop, $value);
+					} @else if index($in_keywords, $value) {
+						$new-map : map-set($new-map, $prop, $value);
+					}
+				} @else if type-of($in_keywords) == string {
+					// check the type
+					@if s-is($value, $in_keywords) {
+						$new-map : map-set($new-map, $prop, $value);
+					}
+				} @else {
+					// we do nothing but adding the value like this
+					$new-map : map-set($new-map, $prop, $value);
+				}
+
+			} @else {
+				// add the value to map
+				@if not map-get($new-map, others) {
+					$new-map : map-set($new-map, others, ());
+				}
+				$new-map : map-set($new-map, others, map-merge(map-get($new-map, others), (
+					$prop : $value
+				)));
+			}
+
+		}
+
+		// return new map
+		@return $new-map;
+
+	} @else {
+
+		$map : ();
+		$values : ();
+		$current_prop : null;
+		$first : true;
+		@each $prop in $properties {
+			
+			@if type-of($prop) == string and str-slice($prop,1,1) == '-' {
+				
+				// remove the - at property beginning
+				$prop : str-slice($prop, 2);
+
+				// check if we have a property named like this in map
+				$in_keywords : null;
+
+				@if $keywords {
+					$in_keywords : map-get($keywords, $prop);
+
+					// if not in keywords, try to get the alias
+					@if $in_keywords == null {
+
+						$alias_found : false;
+						@each $alias_prop, $alias in $aliases {
+							@if $alias_found == false {
+								$al : index($alias, $prop);
+								@if $al or type-of($alias) == string and $prop == $alias {
+									$alias_found : true;
+									$prop : $alias_prop;
+								}
+							}
+						}
+						// check again if now we have a property like this
+						$in_keywords : map-get($keywords, $prop);
+					}
+				}
+
+				// if we have a property in map
+				@if $in_keywords or $keywords == null {
+
+					// explicit naming
+					@if $current_prop {
+						@if length($values) == 0 {
+							$values : true
+						} @else if length($values) == 1 {
+							$values : nth($values, 1);
+						}
+						$map : map-set($map, $current_prop, $values);
+					}
+					$first : false;
+					$current_prop : $prop;
+					$values : ();
+				} @else {
+					// we do not have the property in keywords
+					// but it is still a property...
+					// we have to reset the current prop to null
+					// in order to not append values in previous
+					// founded property
+					$first : false;
+					$current_prop : null;
+					$values : ();
+				}
+			} @else {
+
+				@if $first {
+					// check if the type is ok
+					$found : false;
+					@each $name, $type in $keywords {
+						@if $found == false {
+							@if $type == url {
+								@if s-is($prop, url) {
+									$map : map-set($map, $name, $prop);
+									// remove the item from keywords
+									$keywords : map-remove($keywords, $name);
+									// stop searching
+									$found : true;
+								}
+							} @else if $type == number or $type == color or $type == string or $type == list or $type == map {
+								@if type-of($prop) == $type {
+									$map : map-set($map, $name, $prop);
+									// remove the item from keywords
+									$keywords : map-remove($keywords, $name);
+									// stop searching
+									$found : true;
+								}
+							} @else if $type == degree {
+								@if s-is($prop, degree) {
+									$map : map-set($map, $name, $prop);
+									// remove the item from keywords
+									$keywords : map-remove($keywords, $name);
+									// stop searching
+									$found : true;
+								}
+							} @else {
+								@if type-of($prop) == list and index($type, length) {
+									$map : map-set($map, $name, $prop);
+									// remove the item from keywords
+									$keywords : map-remove($keywords, $name);
+									// stop searching
+									$found : true;
+								} @else if index($type, $prop) {
+									$map : map-set($map, $name, $prop);
+									// remove the item from keywords
+									$keywords : map-remove($keywords, $name);
+									// stop searching
+									$found : true;
+								}
+							}
+						}
+					}
+				} @else {
+					$values : append($values, $prop);
+				}
+
+				@if $current_prop {
+					@if length($values) == 0 {
+						$values : true
+					} @else if length($values) == 1 {
+						$values : nth($values, 1);
+					}
+					$map : map-set($map, $current_prop, $values);
+				}
+			}
+		}
+		@if $current_prop {
+			@if length($values) == 0 {
+				$values : true
+			} @else if length($values) == 1 {
+				$values : nth($values, 1);
+			}
+			$map : map-set($map, $current_prop, $values);
+		}
+
+		// return map
+		@return $map;
+
+	}
+}
+
+@function s-is(
+	$value,
+	$type
+) {
+	@if $type == url {
+		@return str-is-url($value);
+	} @else if $type == px {
+		@return type-of($value) == number and not unitless($value) and unit($value) == px;
+	} @else if $type == rem {
+		@return type-of($value) == number and not unitless($value) and unit($value) == rem;
+	} @else if $type == em {
+		@return type-of($value) == number and not unitless($value) and unit($value) == em;
+	} @else if $type == pt {
+		@return type-of($value) == number and not unitless($value) and unit($value) == pt;
+	} @else if $type == percent or $type == '%' {
+		@return type-of($value) == number and not unitless($value) and unit($value) == '%';
+	} @else if $type == vw {
+		@return type-of($value) == number and not unitless($value) and unit($value) == vw;
+	} @else if $type == vh {
+		@return type-of($value) == number and not unitless($value) and unit($value) == vh;
+	} @else if $type == ex {
+		@return type-of($value) == number and not unitless($value) and unit($value) == ex;
+	} @else if $type == ch {
+		@return type-of($value) == number and not unitless($value) and unit($value) == ch;
+	} @else if $type == cm {
+		@return type-of($value) == number and not unitless($value) and unit($value) == cm;
+	} @else if $type == mm {
+		@return type-of($value) == number and not unitless($value) and unit($value) == mm;
+	} @else if $type == in {
+		@return type-of($value) == number and not unitless($value) and unit($value) == in;
+	} @else if $type == pc {
+		@return type-of($value) == number and not unitless($value) and unit($value) == pc;
+	} @else if $type == boolean or $type == bool {
+		@return _is-boolean($value);
+	} @else if $type == function {
+		@return _is-function($value);
+	} @else if $type == null {
+		@return _is-null($value);
+	} @else if $type == number {
+		@return type-of($value) == number;
+	} @else if $type == integer or $type == int {
+		@return round($value) == $value;
+	} @else if $type == string {
+		@return type-of($value) == string;
+	} @else if $type == color {
+		@return type-of($value) == color;
+	} @else if $type == list {
+		@return type-of($value) == list;
+	} @else if $type == map {
+		@return type-of($value) == map;
+	} @else if $type == degree or $type == deg {
+		@return unit($value) == deg;
+	}
+}

data/stylesheets/sugar/_helper-classes.scss

@@ -0,0 +1,109 @@
+//
+// Helper classes
+//
+
+//
+// Pull
+//
+@include s-register-class(pull-left 'helper.pull.left') {
+	float: left;
+}
+@include s-register-class(pull-right 'helper.pull.right') {
+	float: right;
+}
+
+
+//
+// Clear
+//
+@include s-register-class(clear-left 'helper.clear.left') {
+	clear: left;
+}
+@include s-register-class(clear-right 'helper.clear.right') {
+	clear: right;
+}
+@include s-register-class(clear 'helper.clear.both') {
+	clear: both;
+}
+
+
+//
+// Show / hide
+//
+@include s-register-class(show 'helper.display.show') {
+	display : block;
+}
+@include s-register-class(show-inline 'helper.display.show-inline') {
+	display: inline-block;
+}
+@include s-register-class(hidden 'helper.display.hidden') {
+	display: none;
+}
+@include s-register-class(visible 'helper.display.visible') {
+	visibility: visible;
+}
+@include s-register-class(invisible 'helper.display.invisible') {
+	visibility: hidden;
+}
+@include s-register-class(visually-hidden 'helper.display.visually-hidden') {
+	@include s-visually-hidden();
+}
+
+//
+// Text
+//
+@include s-register-class(text-hidden 'helper.text.hidden') {
+	@include s-text-hidden();
+}
+@include s-register-class(text-truncate 'helper.text.truncate') {
+	@include s-text-truncate();
+}
+@include s-register-class(text-left 'helper.text.align.left') {
+	text-align: left;
+}
+@include s-register-class(text-right 'helper.text.align.right') {
+	text-align: right;
+}
+@include s-register-class(text-center 'helper.text.align.center') {
+	text-align: center;
+}
+@include s-register-class(text-justify 'helper.text.align.justify') {
+	text-align: justify;
+}
+@include s-register-class(text-lowercase 'helper.text.transform.lowercase') {
+	text-transform: lowercase;
+}
+@include s-register-class(text-uppercase 'helper.text.transform.uppercase') {
+	text-transform: uppercase;
+}
+@include s-register-class(text-capitalize 'helper.text.transform.capitalize') {
+	text-transform: capitalize;
+}
+
+//
+// Blocks
+//
+@include s-register-class(block-center 'helper.block.center') {
+	display : block;
+	margin-left : auto;
+	margin-right : auto;
+}
+
+//
+// Clearfix
+//
+@include s-register-class(clearfix 'helper.clearfix.default') {
+	@include s-clearfix(micro);
+}
+@include s-register-class(clearfix-float 'helper.clearfix.float') {
+	@include s-clearfix(float);
+}
+@include s-register-class(clearfix-micro 'helper.clearfix.micro') {
+	@include s-clearfix(micro);
+}
+@include s-register-class(clearfix-overflow 'helper.clearfix.overflow') {
+	@include s-clearfix(overflow);
+}
+@include s-register-class(clearfix-facebook 'helper.clearfix.facebook') {
+	@include s-clearfix(facebook);
+}

data/stylesheets/sugar/_helper-functions.scss

@@ -0,0 +1,56 @@
+//
+// Helpers functions
+//
+
+
+//
+// Size
+//
+@function s-size(
+	$size
+) {
+	$sizes : sugar('settings.sizes');
+	$s : map-get($sizes, $size);
+	@if $s {
+		@if type-of($s) == map {
+			@return map-get($s, size);
+		} @else {
+			@if unitless($s) {
+				@return s-rem($s);
+			}
+			@return $s;
+		}	
+	} @else {
+		@if unitless($size) {
+			@return s-rem($size);
+		}
+		@return $size;
+	}
+}
+
+
+//
+// Ratio
+//
+@function s-ratio(
+	$ratio
+) {
+	$ratio : _sugar-parse-properties($ratio, (
+		width : number,
+		height : number
+	));
+	$width : map-get($ratio, width);
+	$height : map-get($ratio, height);
+	@if $width == null or $height == null {
+		@error("missing width or height in s-ratio...");
+	}
+	@return percentage(1 / $width * $height);
+}
+
+
+//
+// Strip units
+//
+@function s-strip-units($number) {
+	@return $number / ($number * 0 + 1);
+}