doggystyle 0.1.0

data/core/functions/maps/_map-deep-set.scss

@@ -0,0 +1,34 @@
+/// Update a key deeply nested
+///
+/// @author Hugo Giraudel
+///
+/// @link http://www.sitepoint.com/extra-map-functions-sass
+///
+/// @access public
+///
+/// @param {map} $map - Map to update
+///
+/// @param {arglist} $keys - Keys to access to value to update
+///
+/// @param {*} $value - New value (last member of `$keys`)
+///
+/// @return {map} - Updated map
+
+@function map-deep-set($map, $keys.../*, $value */) {
+  $map-list: ($map,);
+  $result: null;
+
+  @if length($keys) == 2 {
+    @return map-merge($map, (nth($keys, 1): nth($keys, -1)));
+  }
+
+  @for $i from 1 through length($keys) - 2 {
+    $map-list: append($map-list, map-get(nth($map-list, -1), nth($keys, $i)));
+  }
+
+  @for $i from length($map-list) through 1 {
+    $result: map-merge(nth($map-list, $i), (nth($keys, $i): if($i == length($map-list), nth($keys, -1), $result)));
+  }
+
+  @return $result;
+}

data/core/functions/maps/_map-depth.scss

@@ -0,0 +1,23 @@
+/// Compute the maximum depth of a map
+///
+/// @author Hugo Giraudel
+///
+/// @link http://www.sitepoint.com/extra-map-functions-sass
+///
+/// @access public
+///
+/// @param {map} $map
+///
+/// @return {number} max depth of `$map`
+
+@function map-depth($map) {
+  $level: 1;
+
+  @each $key, $value in $map {
+    @if type-of($value) == "map" {
+      $level: max(map-depth($value) + 1, $level);
+    }
+  }
+
+  @return $level;
+}

data/core/functions/maps/_map-extend.scss

@@ -0,0 +1,47 @@
+/// jQuery-style extend function
+///
+/// @author Hugo Giraudel
+///
+/// @link http://www.sitepoint.com/extra-map-functions-sass
+///
+/// @access public
+///
+/// @param {map} $map - first map
+///
+/// @param {arglist} $maps - other maps
+///
+/// @param {bool} $deep - recursive mode
+///
+/// @return {map}
+
+@function map-extend($map, $maps.../*, $deep */) {
+  $last: nth($maps, -1);
+  $deep: $last == true;
+  $max: if($deep, length($maps) - 1, length($maps));
+
+  // Loop through all maps in $maps...
+  @for $i from 1 through $max {
+    // Store current map
+    $current: nth($maps, $i);
+
+    // If not in deep mode, simply merge current map with map
+    @if not $deep {
+      $map: map-merge($map, $current);
+    } @else {
+      // If in deep mode, loop through all tuples in current map
+      @each $key, $value in $current {
+
+        // If value is a nested map and same key from map is a nested map as well
+        @if type-of($value) == "map" and type-of(map-get($map, $key)) == "map" {
+          // Recursive extend
+          $value: map-extend(map-get($map, $key), $value, true);
+        }
+
+        // Merge current tuple with map
+        $map: map-merge($map, ($key: $value));
+      }
+    }
+  }
+
+  @return $map;
+}

data/core/functions/maps/_map-has-keys.scss

@@ -0,0 +1,23 @@
+/// Test if map got all `$keys` at first level
+///
+/// @author Hugo Giraudel
+///
+/// @link http://www.sitepoint.com/extra-map-functions-sass
+///
+/// @access public
+///
+/// @param {map} $map - Map
+///
+/// @param {arglist} $keys - Keys to test
+///
+/// @return {bool}
+
+@function map-has-keys($map, $keys...) {
+  @each $key in $keys {
+    @if not map-has-key($map, $key) {
+      @return false;
+    }
+  }
+
+  @return true;
+}

data/core/functions/maps/_map-has-nested-keys.scss

@@ -0,0 +1,24 @@
+/// Test if map got all `$keys` nested with each others
+///
+/// @author Hugo Giraudel
+///
+/// @link http://www.sitepoint.com/extra-map-functions-sass
+///
+/// @access public
+///
+/// @param {map} $map - Map
+///
+/// @param {arglist} $keys - Keys to test
+///
+/// @return {bool}
+
+@function map-has-nested-keys($map, $keys...) {
+  @each $key in $keys {
+    @if not map-has-key($map, $key) {
+      @return false;
+    }
+    $map: map-get($map, $key);
+  }
+
+  @return true;
+}

data/core/functions/maps/_map-set.scss

@@ -0,0 +1,4 @@
+/// A quick was of adding a key and value to the end of a map
+@function map-set($map, $key, $value) {
+  @return map-merge($map, ($key: $value));
+}

data/core/functions/maps/_map-zip.scss

@@ -0,0 +1,50 @@
+/// An equivalent of `zip` function but for maps.
+/// I wrote my own version of this before realising Hugo had done something similar. 
+/// I have kept the name, but used my own.
+///
+/// @author Mark Notton
+///
+/// @link http://www.sitepoint.com/extra-map-functions-sass
+/// @link http://sass-lang.com/documentation/Sass/Script/Functions.html#zip-instance_method
+///
+/// @access public
+///
+/// @param {list} $list1 - Keys for map
+///
+/// @param {list} $list2 - Values for map
+///
+/// @param {bool} $swappable - Swap variables around so list1 has the most values. Default is true.
+///
+/// @return {map} Freshly created map
+
+@function map-zip($list1, $list2, $swappable:true) {
+  
+  $map : ();
+  
+  $list1-size : length($list1);
+  $list2-size : length($list2);
+
+  $count : if($list1-size < $list2-size, $list1-size, $list2-size);
+
+  
+  @if ($list1-size < $list2-size and $swappable) {
+    $temp : $list1;
+    $list1 : $list2;
+    $list2 : $temp;
+    @if $warnings { @warn(($list2-size - $list1-size)+' value'+ if($list2-size - $list1-size != 1, 's', '') +' has not been added to the map because the list sizes did not match.'); }
+  } 
+
+  @if $warnings {
+    @if ($list1-size < $list2-size) { 
+      @warn('The second list had '+($list2-size - $list1-size)+' more value'+ if($list2-size - $list1-size != 1, 's', '') +' than the first list');
+    } @elseif ($list1-size > $list2-size) {
+      @warn('The first list had '+($list1-size - $list2-size)+' more value'+ if($list1-size - $list2-size != 1, 's', '') +' than the second list');
+    }
+  }
+
+  @for $i from 1 through $count {
+    $map : map-set($map, nth($list1, $i), nth($list2, $i));
+  }
+
+  @return $map;
+}

data/core/functions/numbers/_add-unit.scss

@@ -0,0 +1,54 @@
+/// Adds a default unit if one is not used.
+/// 
+/// @author Mark Notton
+/// 
+/// @param {number} $value
+///
+/// @param {string} $unit - If a value is unitless add the default unit.
+///
+/// @param {bool} $convert - If the value already has a unit, and a different unit was specifically 
+///   supplied, this boolean desides wether to replace the unit.
+///
+/// @require {variable} default-unit
+/// @require {variable} $relative-lengths
+/// @require {variable} $abolute-lengths
+/// @require {function} is-unit
+/// @require {function} is-number
+/// @require {function} strip
+///
+/// @example scss - Usage
+///   addUnit(50)
+///   addUnit(50px)
+///   addUnit(50, %)
+///   addUnit(50px, %)
+///
+/// @example scss - Output
+///   50px
+///   50px
+///   50%
+///   50%
+
+// @function addUnit($value, $unit:$default-unit) {
+//   @if is-number($value) and unitless($value) {
+//     @return strip($value) + $unit;
+//   } @else {
+//     @return $value;
+//   }
+// }
+
+@function addUnit($value, $unit:null, $replace:false) {
+  @if is-number($value) {
+    @if unitless($value) {
+      @return $value + if($unit == null, $default-unit, $unit);
+    }
+    @elseif is-unit($value) {
+      @if $replace and $unit != null {
+        @return strip($value) + $unit;
+      } @else {
+        @return $value;
+      }
+    }
+  } @else {
+    @return $value;
+  }
+}

data/core/functions/numbers/_pad.scss

@@ -0,0 +1,16 @@
+/// Padding is generated relative to the default text size.
+/// Using this globally allows gutters, padding, margins, etc to be consistant throughout.
+///
+/// @param {Number} $size
+///   Enter the amount of times you want to multiply the default padding variable
+///
+/// @require {Variable} $padding
+///   Can be found in the yello/_settings.scss file. May be overwritten in the project _variables.scss file
+///
+/// @example scss - Usage
+///   margin:0 pad(3);
+///
+/// @return {Number} with units
+@function pad($size:1) {
+  @return if($size == 0, to-number(addUnit($padding/2, px)), to-number(addUnit($padding*$size, px)));
+}

data/core/functions/numbers/_spacer.scss

@@ -0,0 +1,16 @@
+/// Padding is generated relative to the default text size.
+/// Using this globally allows gutters, padding, margins, etc to be consistant throughout.
+///
+/// @param {Number} $size
+///   Enter the amount of times you want to multiply the default padding variable
+///
+/// @require {Variable} $padding
+///   Can be found in the yello/_settings.scss file. May be overwritten in the project _variables.scss file 
+///
+/// @example scss - Usage
+///   margin:0 pad(3);
+///
+/// @return {Number} with units
+@function spacer($size:1) {
+  @return if($size == 0, to-number(addUnit($spacing/2, vh)), to-number(addUnit($spacing*$size, vh)));
+}

data/core/functions/numbers/_strip.scss

@@ -0,0 +1,29 @@
+/// Strips any units from a number
+///
+/// @author Hugo Giraudel
+/// 
+/// @link https://css-tricks.com/snippets/sass/strip-unit-function/
+///
+/// @param {string} $number
+///
+/// @return {number}
+///
+/// @require {function} is-number
+/// @require {function} to-number
+///
+/// @example scss - Usage
+///   strip(50px)
+///
+/// @example scss - Output
+///   50
+
+@function strip($number) {
+  @if not is-number($number) {
+    $number : to-number($number);
+  }
+  @if is-number($number) and not unitless($number) {
+    @return ($number / ($number * 0 + 1));
+  }
+
+  @return $number;
+}

data/core/functions/numbers/_units.scss

@@ -0,0 +1,17 @@
+/// Return a unit of measurment with a function to avoid the messy '#{xx}' interpolation syntax when concatonating variables or numbers with units
+///
+/// @example scss - Usage
+///   height:$someNumber + px;
+///
+/// @return {String}
+@function cm() { @return #{cm} }
+@function em() { @return #{em} }
+@function ex() { @return #{ex} }
+@function in() { @return #{in} }
+@function mm() { @return #{mm} }
+@function pc() { @return #{pc} }
+@function pt() { @return #{pt} }
+@function px() { @return #{px} }
+@function vh() { @return #{vh} }
+@function vw() { @return #{vw} }
+@function vmin() { @return #{vmin} }

data/core/functions/svg/_dots.scss

@@ -0,0 +1,84 @@
+/// Create a svg background image with dots. 
+///
+/// @author Mark Notton
+///
+/// @access public
+///
+/// @param {list} $settings
+///   In any order and without comma delimination, add any of the follwing settings
+///   {color} -  The first instance of a colour will be used for top left and bottom right dots. Default is black.
+///              The second instance will be used for bottom left and top right dots. Default is null.
+///   {number} - The first instance of a number will be used for dot size. In 'px'; Default is 4px.
+///              The second instance of a number will be used for dot spacing. In 'px'; Default is 0px.
+///
+/// @todo Add the ability to chose a direction by degrees
+/// @todo Add the option to choose a shape, eg: circles
+///
+/// @require {function} is-colour
+/// @require {function} is-number
+/// @require {function} colour
+/// @require {function} svg
+/// @require {function} strip
+/// @require {function} first
+/// @require {function} second
+///
+/// @example scss - Usage
+///   Red dots at 8px in width and height. Alternative dots don't exist:
+///   background:dots(red 8);
+///
+///   Red dots at 4px in width and height. Alternative dots are the same, but green:
+///   background:dots(red green); 
+///
+///   Red dots at 10px in width and height. Alternative dots are the same, but green. All dots are spaced 5px apart:
+///   background:dots(red green 10 5); 
+///
+/// @return {String}
+
+@function dots($settings:null) {
+  
+  $size : null;
+  $spacing : 0;
+  $colours : ();
+  $colour1 : black;
+  $colour2 : null;
+
+  @each $setting in $settings {
+
+    @if is-colour($setting) and length($colours) <= 1 {
+      $colours : append($colours, $setting);
+    }
+    @elseif is-number($setting) {
+      @if $size == null {
+        $size : strip($setting);
+      }
+      @else {
+        $spacing : strip($setting);
+      }
+    }
+  }
+
+  @if $size == null { 
+    $size : 4;
+  }
+  
+  @if length($colours) == 1 {
+    $colour1 : colour(first($colours), true);
+  }
+  @elseif length($colours) == 2 {
+    $colour1 : colour(first($colours), true);
+    $colour2 : colour(second($colours), true);
+  }
+
+  $dots : "<svg xmlns='http://www.w3.org/2000/svg' width='"+($size*2 + $spacing*2)+"' height='"+($size*2 + $spacing*2)+"' viewBox='0 0 "+($size*2 + $spacing*2)+" "+($size*2 + $spacing*2)+"'>";
+  $dots : $dots + "<rect fill='"+$colour1+"' y='0' x='0' width='"+$size+"' height='"+$size+"'/>";
+  $dots : $dots + "<rect fill='"+$colour1+"' y='"+($size + $spacing)+"' x='"+($size + $spacing)+"' width='"+$size+"' height='"+$size+"'/>";
+  
+  @if length($colours) > 1 {
+    $dots : $dots + "<rect fill='"+$colour2+"' y='"+($size + $spacing)+"' x='0' width='"+$size+"' height='"+$size+"'/>";
+    $dots : $dots + "<rect fill='"+$colour2+"' y='0' x='"+($size + $spacing)+"' width='"+$size+"' height='"+$size+"'/>";
+  }
+
+  $dots : $dots + "</svg>";
+
+  @return svg($dots); 
+}

data/core/functions/svg/_fake-radius.scss

@@ -0,0 +1,131 @@
+/// Create a set of border-radius svg sprites with advance settings
+///
+/// @author Mark Notton
+///
+/// @access public
+
+@mixin fake-radius($settings...) {
+
+  /*$count : 0;
+  
+  $corner-settings: (
+    top-left : (
+      color : null,
+      width : null,
+      height : null
+    ),
+    top-right : (
+      color : null,
+      width : null,
+      height : null
+    ),
+    bottom-left : (
+      color : null,
+      width : null,
+      height : null
+    ),
+    bottom-right : (
+      color : null,
+      width : null,
+      height : null
+    ),
+  );
+
+  $corners : to-list($corner-settings, keys);
+
+  @debug $corners;
+
+  @each $settings in _arglist-to-list($settings...) {
+    $count : $count + 1; 
+
+    @each $setting in $settings {
+
+      // If the settings contains one of the corners types, only focus on that one corner for the remaining settings.
+      @if is-string($setting) and contains($corners, $setting) {
+        $corner : $setting;
+        
+        @each $setting in $settings {
+          @if is-colour($setting) and map-deep-get($corner-settings, $corner, color) == null {
+            $corner-settings : map-deep-set($corner-settings, $corner, color, colour($setting, true));
+          }
+          @elseif is-number($setting) {
+            @if map-deep-get($corner-settings, $corner, width) == null {
+              $corner-settings : map-deep-set($corner-settings, $corner, width, $setting);
+            } @else {
+              $corner-settings : map-deep-set($corner-settings, $corner, height, $setting);
+            }
+          }
+        }
+
+        // Default colour if not supplied
+        @if map-deep-get($corner-settings, $corner, color) == null {
+          $corner-settings : map-deep-set($corner-settings, $corner, color, colour(red, true));
+        }
+        
+        // If not units were found at all, revert the width back to a default radius setting
+        @if map-deep-get($corner-settings, $corner, width) == null {
+          $corner-settings : map-deep-set($corner-settings, $corner, width, $border-radius);
+        }
+
+        // If a second unit was not supplied, the height would be set to null. As a fallback, set height to width
+        @if map-deep-get($corner-settings, $corner, height) == null {
+          $corner-settings : map-deep-set($corner-settings, $corner, height, map-deep-get($corner-settings, $corner, width));
+        }
+
+      }
+      @else {
+        
+      
+      }
+    }
+  
+  }
+  @debug $corner-settings;*/
+
+  $colour : _hash-fix(#ffffff);
+  $size : $border-radius;
+  $sudo : before;
+
+  @each $settings in _arglist-to-list($settings...) {
+    @each $setting in $settings {
+      @if is-colour($setting) {
+        $colour : _hash-fix($setting);
+      }
+      @if is-string($setting) and _sudo($setting) {
+        $sudo : $setting;
+      }
+      @elseif is-number($setting) {
+        @if is-percentage($setting) {
+          $size : addUnit(_min-max-number(strip($setting))/2, %);
+        } @else {
+          $size : strip($setting);
+        }
+      }
+    }
+  }
+
+  $svg : "<svg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='100%' height='100%'>";
+  $svg : $svg + "<def>";
+  $svg : $svg + "<symbol id='corner' viewBox='0 0 10 10'>";
+  $svg : $svg + "<path d='M10,0H0v9.9C0,4.1,4.7,0,10,0z'/>";
+  $svg : $svg + "</symbol>";
+  $svg : $svg + "</def>";
+  $svg : $svg + "<path d='M10,0H0v9.9C0,4.1,4.7,0,10,0z'/>";
+  $svg : $svg + "<use x='0' y='0%' width='"+$size+"' height='"+$size+"' fill='"+$colour+"' xlink:href='%23corner' />";
+  $svg : $svg + "<use x='-100%' y='0%' width='"+$size+"' height='"+$size+"' fill='"+$colour+"' transform='scale(-1,1)' xlink:href='%23corner' />";
+  $svg : $svg + "<use x='0%' y='-100%' width='"+$size+"' height='"+$size+"' fill='"+$colour+"' transform='scale(1,-1)' xlink:href='%23corner' />";
+  $svg : $svg + "<use x='-100%' y='-100%' width='"+$size+"' height='"+$size+"' fill='"+$colour+"' transform='scale(-1,-1)' xlink:href='%23corner' />";
+  $svg : $svg + "</svg>";
+
+
+  &#{_sudo($sudo)} { 
+    @extend %sudo, %nopointerevent; 
+    background-image:svg($svg); z-index:1;
+    @content;
+  }
+}
+
+
+
+   // xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:a="http://ns.adobe.com/AdobeSVGViewerExtensions/3.0/"
+