_functions.scss 4.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188
  1. /* Sass Functions go here */
  2. /// Remove the unit of a length
  3. /// @param {Number} $number - Number to remove unit from
  4. /// @return {Number} - Unitless number
  5. @function strip-unit($number) {
  6. @if type-of($number) == 'number' and not unitless($number) {
  7. @return $number / ($number * 0 + 1);
  8. }
  9. @return $number;
  10. }
  11. // ----
  12. // Sass (v3.3.14)
  13. // Compass (v1.0.0.rc.1)
  14. // ----
  15. @function pow($x, $y) {
  16. $ret: 1;
  17. @if $y > 0 {
  18. @for $i from 1 through $y {
  19. $ret: $ret * $x;
  20. }
  21. }
  22. @else {
  23. @for $i from $y to 0 {
  24. $ret: $ret / $x;
  25. }
  26. }
  27. @return $ret;
  28. }
  29. /**
  30. * Map deep get
  31. * @author Hugo Giraudel
  32. * @access public
  33. * @param {Map} $map - Map
  34. * @param {Arglist} $keys - Key chain
  35. * @return {*} - Desired value
  36. *
  37. * Example:
  38. * $m-breakpoint: map-deep-get($__prefix-default-config, "layouts", "M");
  39. */
  40. @function map-deep-get($map, $keys...) {
  41. @each $key in $keys {
  42. $map: map-get($map, $key);
  43. }
  44. @return $map;
  45. }
  46. /**
  47. * Deep set function to set a value in nested maps
  48. * @author Hugo Giraudel
  49. * @access public
  50. * @param {Map} $map - Map
  51. * @param {List} $keys - Key chaine
  52. * @param {*} $value - Value to assign
  53. * @return {Map}
  54. *
  55. * Example:
  56. * $__prefix-default-config: map-deep-set($__prefix-default-config, "layouts" "M", 650px);
  57. */
  58. @function map-deep-set($map, $keys, $value) {
  59. $maps: ($map);
  60. $result: null;
  61. // If the last key is a map already
  62. // Warn the user we will be overriding it with $value
  63. @if type-of(nth($keys, -1)) == "map" {
  64. @warn "The last key you specified is a map; it will be overrided with `#{$value}`.";
  65. }
  66. // If $keys is a single key
  67. // Just merge and return
  68. @if length($keys) == 1 {
  69. @return map-merge($map, ($keys: $value));
  70. }
  71. // Loop from the first to the second to last key from $keys
  72. // Store the associated map to this key in the $maps list
  73. // If the key doesn't exist, throw an error
  74. @for $i from 1 through length($keys) - 1 {
  75. $current-key: nth($keys, $i);
  76. $current-map: nth($maps, -1);
  77. $current-get: map-get($current-map, $current-key);
  78. @if $current-get == null {
  79. @error "Key `#{$key}` doesn't exist at current level in map.";
  80. }
  81. $maps: append($maps, $current-get);
  82. }
  83. // Loop from the last map to the first one
  84. // Merge it with the previous one
  85. @for $i from length($maps) through 1 {
  86. $current-map: nth($maps, $i);
  87. $current-key: nth($keys, $i);
  88. $current-val: if($i == length($maps), $value, $result);
  89. $result: map-merge($current-map, ($current-key: $current-val));
  90. }
  91. // Return result
  92. @return $result;
  93. }
  94. /**
  95. * jQuery-style extend function
  96. * - Child themes can use this function to `reset` the values in
  97. * config maps without editing the `master` Sass files.
  98. * - src: https://www.sitepoint.com/extra-map-functions-sass/
  99. * - About `map-merge()`:
  100. * - - only takes 2 arguments
  101. * - - is not recursive
  102. * @param {Map} $map - first map
  103. * @param {ArgList} $maps - other maps
  104. * @param {Bool} $deep - recursive mode
  105. * @return {Map}
  106. *
  107. * Examples:
  108. $grid-configuration-default: (
  109. 'columns': 12,
  110. 'layouts': (
  111. 'small': 800px,
  112. 'medium': 1000px,
  113. 'large': 1200px,
  114. ),
  115. );
  116. $grid-configuration-custom: (
  117. 'layouts': (
  118. 'large': 1300px,
  119. 'huge': 1500px
  120. ),
  121. );
  122. $grid-configuration-user: (
  123. 'direction': 'ltr',
  124. 'columns': 16,
  125. 'layouts': (
  126. 'large': 1300px,
  127. 'huge': 1500px
  128. ),
  129. );
  130. // $deep: false
  131. $grid-configuration: map-extend($grid-configuration-default, $grid-configuration-custom, $grid-configuration-user);
  132. // --> ("columns": 16, "layouts": (("large": 1300px, "huge": 1500px)), "direction": "ltr")
  133. // $deep: true
  134. $grid-configuration: map-extend($grid-configuration-default, $grid-configuration-custom, $grid-configuration-user, true);
  135. // --> ("columns": 16, "layouts": (("small": 800px, "medium": 1000px, "large": 1300px, "huge": 1500px)), "direction": "ltr")
  136. */
  137. @function map-extend($map, $maps.../*, $deep */) {
  138. $last: nth($maps, -1);
  139. $deep: $last == true;
  140. $max: if($deep, length($maps) - 1, length($maps));
  141. // Loop through all maps in $maps...
  142. @for $i from 1 through $max {
  143. // Store current map
  144. $current: nth($maps, $i);
  145. // If not in deep mode, simply merge current map with map
  146. @if not $deep {
  147. $map: map-merge($map, $current);
  148. } @else {
  149. // If in deep mode, loop through all tuples in current map
  150. @each $key, $value in $current {
  151. // If value is a nested map and same key from map is a nested map as well
  152. @if type-of($value) == "map" and type-of(map-get($map, $key)) == "map" {
  153. // Recursive extend
  154. $value: map-extend(map-get($map, $key), $value, true);
  155. }
  156. // Merge current tuple with map
  157. $map: map-merge($map, ($key: $value));
  158. }
  159. }
  160. }
  161. @return $map;
  162. }