dendron-jekyll 0.3.2

Sign up to get free protection for your applications and to get access to all the features.
Files changed (141) hide show
  1. checksums.yaml +7 -0
  2. data/LICENSE.txt +21 -0
  3. data/README.md +68 -0
  4. data/Rakefile +1 -0
  5. data/_includes/active.html +8 -0
  6. data/_includes/archive-single.html +33 -0
  7. data/_includes/crumbs.html +15 -0
  8. data/_includes/css/custom.scss.liquid +1 -0
  9. data/_includes/css/just-the-docs.scss.liquid +7 -0
  10. data/_includes/documents-collection.html +25 -0
  11. data/_includes/figure +9 -0
  12. data/_includes/head.html +40 -0
  13. data/_includes/head_custom.html +0 -0
  14. data/_includes/js/custom.js +0 -0
  15. data/_includes/nav.html +37 -0
  16. data/_includes/sidebar.html +19 -0
  17. data/_includes/title.html +5 -0
  18. data/_includes/toc +7 -0
  19. data/_includes/toc-mm.html +96 -0
  20. data/_includes/toc.html +16 -0
  21. data/_includes/vendor/anchor_headings.html +100 -0
  22. data/_layouts/about.html +5 -0
  23. data/_layouts/archive.html +30 -0
  24. data/_layouts/default.html +160 -0
  25. data/_layouts/home.html +5 -0
  26. data/_layouts/page.html +5 -0
  27. data/_layouts/post.html +5 -0
  28. data/_layouts/single.html +97 -0
  29. data/_layouts/table_wrappers.html +7 -0
  30. data/_layouts/vendor/compress.html +10 -0
  31. data/_sass/base.scss +108 -0
  32. data/_sass/buttons.scss +118 -0
  33. data/_sass/code.scss +261 -0
  34. data/_sass/color_schemes/dark.scss +17 -0
  35. data/_sass/color_schemes/light.scss +0 -0
  36. data/_sass/content.scss +196 -0
  37. data/_sass/custom/custom.scss +0 -0
  38. data/_sass/labels.scss +37 -0
  39. data/_sass/layout.scss +205 -0
  40. data/_sass/minimal-mistakes/_animations.scss +21 -0
  41. data/_sass/minimal-mistakes/_archive.scss +455 -0
  42. data/_sass/minimal-mistakes/_base.scss +357 -0
  43. data/_sass/minimal-mistakes/_buttons.scss +97 -0
  44. data/_sass/minimal-mistakes/_footer.scss +86 -0
  45. data/_sass/minimal-mistakes/_forms.scss +393 -0
  46. data/_sass/minimal-mistakes/_masthead.scss +93 -0
  47. data/_sass/minimal-mistakes/_mixins.scss +92 -0
  48. data/_sass/minimal-mistakes/_navigation.scss +566 -0
  49. data/_sass/minimal-mistakes/_notices.scss +105 -0
  50. data/_sass/minimal-mistakes/_page.scss +553 -0
  51. data/_sass/minimal-mistakes/_print.scss +252 -0
  52. data/_sass/minimal-mistakes/_reset.scss +187 -0
  53. data/_sass/minimal-mistakes/_search.scss +132 -0
  54. data/_sass/minimal-mistakes/_sidebar.scss +347 -0
  55. data/_sass/minimal-mistakes/_syntax.scss +324 -0
  56. data/_sass/minimal-mistakes/_tables.scss +39 -0
  57. data/_sass/minimal-mistakes/_utilities.scss +593 -0
  58. data/_sass/minimal-mistakes/_variables.scss +169 -0
  59. data/_sass/minimal-mistakes/skins/_air.scss +23 -0
  60. data/_sass/minimal-mistakes/skins/_aqua.scss +30 -0
  61. data/_sass/minimal-mistakes/skins/_contrast.scss +51 -0
  62. data/_sass/minimal-mistakes/skins/_dark.scss +28 -0
  63. data/_sass/minimal-mistakes/skins/_default.scss +5 -0
  64. data/_sass/minimal-mistakes/skins/_dirt.scss +33 -0
  65. data/_sass/minimal-mistakes/skins/_mint.scss +23 -0
  66. data/_sass/minimal-mistakes/skins/_neon.scss +57 -0
  67. data/_sass/minimal-mistakes/skins/_plum.scss +64 -0
  68. data/_sass/minimal-mistakes/skins/_sunrise.scss +44 -0
  69. data/_sass/minimal-mistakes/vendor/breakpoint/_breakpoint.scss +114 -0
  70. data/_sass/minimal-mistakes/vendor/breakpoint/_context.scss +95 -0
  71. data/_sass/minimal-mistakes/vendor/breakpoint/_helpers.scss +151 -0
  72. data/_sass/minimal-mistakes/vendor/breakpoint/_legacy-settings.scss +50 -0
  73. data/_sass/minimal-mistakes/vendor/breakpoint/_no-query.scss +15 -0
  74. data/_sass/minimal-mistakes/vendor/breakpoint/_parsers.scss +215 -0
  75. data/_sass/minimal-mistakes/vendor/breakpoint/_respond-to.scss +82 -0
  76. data/_sass/minimal-mistakes/vendor/breakpoint/_settings.scss +71 -0
  77. data/_sass/minimal-mistakes/vendor/breakpoint/parsers/_double.scss +33 -0
  78. data/_sass/minimal-mistakes/vendor/breakpoint/parsers/_query.scss +82 -0
  79. data/_sass/minimal-mistakes/vendor/breakpoint/parsers/_resolution.scss +31 -0
  80. data/_sass/minimal-mistakes/vendor/breakpoint/parsers/_single.scss +26 -0
  81. data/_sass/minimal-mistakes/vendor/breakpoint/parsers/_triple.scss +36 -0
  82. data/_sass/minimal-mistakes/vendor/breakpoint/parsers/double/_default-pair.scss +21 -0
  83. data/_sass/minimal-mistakes/vendor/breakpoint/parsers/double/_default.scss +22 -0
  84. data/_sass/minimal-mistakes/vendor/breakpoint/parsers/double/_double-string.scss +22 -0
  85. data/_sass/minimal-mistakes/vendor/breakpoint/parsers/resolution/_resolution.scss +60 -0
  86. data/_sass/minimal-mistakes/vendor/breakpoint/parsers/single/_default.scss +13 -0
  87. data/_sass/minimal-mistakes/vendor/breakpoint/parsers/triple/_default.scss +18 -0
  88. data/_sass/minimal-mistakes/vendor/magnific-popup/_magnific-popup.scss +649 -0
  89. data/_sass/minimal-mistakes/vendor/magnific-popup/_settings.scss +46 -0
  90. data/_sass/minimal-mistakes/vendor/susy/_su.scss +4 -0
  91. data/_sass/minimal-mistakes/vendor/susy/_susy-prefix.scss +13 -0
  92. data/_sass/minimal-mistakes/vendor/susy/_susy.scss +5 -0
  93. data/_sass/minimal-mistakes/vendor/susy/plugins/_svg-grid.scss +5 -0
  94. data/_sass/minimal-mistakes/vendor/susy/plugins/svg-grid/_prefix.scss +7 -0
  95. data/_sass/minimal-mistakes/vendor/susy/plugins/svg-grid/_svg-api.scss +114 -0
  96. data/_sass/minimal-mistakes/vendor/susy/plugins/svg-grid/_svg-grid-math.scss +67 -0
  97. data/_sass/minimal-mistakes/vendor/susy/plugins/svg-grid/_svg-settings.scss +14 -0
  98. data/_sass/minimal-mistakes/vendor/susy/plugins/svg-grid/_svg-unprefix.scss +18 -0
  99. data/_sass/minimal-mistakes/vendor/susy/plugins/svg-grid/_svg-utilities.scss +133 -0
  100. data/_sass/minimal-mistakes/vendor/susy/susy/_api.scss +318 -0
  101. data/_sass/minimal-mistakes/vendor/susy/susy/_normalize.scss +261 -0
  102. data/_sass/minimal-mistakes/vendor/susy/susy/_parse.scss +163 -0
  103. data/_sass/minimal-mistakes/vendor/susy/susy/_settings.scss +329 -0
  104. data/_sass/minimal-mistakes/vendor/susy/susy/_su-math.scss +441 -0
  105. data/_sass/minimal-mistakes/vendor/susy/susy/_su-validate.scss +213 -0
  106. data/_sass/minimal-mistakes/vendor/susy/susy/_syntax-helpers.scss +191 -0
  107. data/_sass/minimal-mistakes/vendor/susy/susy/_unprefix.scss +56 -0
  108. data/_sass/minimal-mistakes/vendor/susy/susy/_utilities.scss +167 -0
  109. data/_sass/modules.scss +25 -0
  110. data/_sass/navigation.scss +196 -0
  111. data/_sass/print.scss +40 -0
  112. data/_sass/search.scss +323 -0
  113. data/_sass/support/_functions.scss +9 -0
  114. data/_sass/support/_variables.scss +135 -0
  115. data/_sass/support/mixins/_buttons.scss +27 -0
  116. data/_sass/support/mixins/_layout.scss +34 -0
  117. data/_sass/support/mixins/_typography.scss +86 -0
  118. data/_sass/support/mixins/mixins.scss +3 -0
  119. data/_sass/support/support.scss +3 -0
  120. data/_sass/tables.scss +58 -0
  121. data/_sass/typography.scss +60 -0
  122. data/_sass/utilities/_colors.scss +239 -0
  123. data/_sass/utilities/_layout.scss +95 -0
  124. data/_sass/utilities/_lists.scss +17 -0
  125. data/_sass/utilities/_spacing.scss +165 -0
  126. data/_sass/utilities/_typography.scss +91 -0
  127. data/_sass/utilities/utilities.scss +5 -0
  128. data/_sass/vendor/normalize.scss/README.md +78 -0
  129. data/_sass/vendor/normalize.scss/normalize.scss +427 -0
  130. data/_sass/vendor/normalize.scss/package.json +70 -0
  131. data/assets/css/just-the-docs-dark.scss +3 -0
  132. data/assets/css/just-the-docs-default.scss +8 -0
  133. data/assets/css/just-the-docs-light.scss +3 -0
  134. data/assets/images/just-the-docs.png +0 -0
  135. data/assets/images/search.svg +1 -0
  136. data/assets/js/just-the-docs.js +473 -0
  137. data/assets/js/vendor/lunr.min.js +6 -0
  138. data/assets/js/zzzz-search-data.json +60 -0
  139. data/bin/just-the-docs +16 -0
  140. data/lib/tasks/search.rake +74 -0
  141. metadata +245 -0
@@ -0,0 +1,46 @@
1
+ ////////////////////////
2
+ // Settings //
3
+ ////////////////////////
4
+
5
+ // overlay
6
+ $mfp-overlay-color: #000; // Color of overlay screen
7
+ $mfp-overlay-opacity: 0.8; // Opacity of overlay screen
8
+ $mfp-shadow: 0 0 8px rgba(0, 0, 0, 0.6); // Shadow on image or iframe
9
+
10
+ // spacing
11
+ $mfp-popup-padding-left: 8px; // Padding from left and from right side
12
+ $mfp-popup-padding-left-mobile: 6px; // Same as above, but is applied when width of window is less than 800px
13
+
14
+ $mfp-z-index-base: 1040; // Base z-index of popup
15
+
16
+ // controls
17
+ $mfp-include-arrows: true; // Include styles for nav arrows
18
+ $mfp-controls-opacity: 1; // Opacity of controls
19
+ $mfp-controls-color: #fff; // Color of controls
20
+ $mfp-controls-border-color: #fff; // Border color of controls
21
+ $mfp-inner-close-icon-color: #fff; // Color of close button when inside
22
+ $mfp-controls-text-color: #ccc; // Color of preloader and "1 of X" indicator
23
+ $mfp-controls-text-color-hover: #fff; // Hover color of preloader and "1 of X" indicator
24
+ $mfp-IE7support: true; // Very basic IE7 support
25
+
26
+ // Iframe-type options
27
+ $mfp-include-iframe-type: true; // Enable Iframe-type popups
28
+ $mfp-iframe-padding-top: 40px; // Iframe padding top
29
+ $mfp-iframe-background: #000; // Background color of iframes
30
+ $mfp-iframe-max-width: 900px; // Maximum width of iframes
31
+ $mfp-iframe-ratio: 9/16; // Ratio of iframe (9/16 = widescreen, 3/4 = standard, etc.)
32
+
33
+ // Image-type options
34
+ $mfp-include-image-type: true; // Enable Image-type popups
35
+ $mfp-image-background: #444 !default;
36
+ $mfp-image-padding-top: 40px; // Image padding top
37
+ $mfp-image-padding-bottom: 40px; // Image padding bottom
38
+ $mfp-include-mobile-layout-for-image: true; // Removes paddings from top and bottom
39
+
40
+ // Image caption options
41
+ $mfp-caption-title-color: #f3f3f3; // Caption title color
42
+ $mfp-caption-subtitle-color: #bdbdbd; // Caption subtitle color
43
+ .mfp-counter { font-family: $serif; } // Caption font family
44
+
45
+ // A11y
46
+ $mfp-use-visuallyhidden: false;
@@ -0,0 +1,4 @@
1
+ // Su
2
+ // ==
3
+
4
+ @import 'susy/su';
@@ -0,0 +1,13 @@
1
+ // Susy (Prefixed)
2
+ // ===============
3
+
4
+ $susy-version: 3;
5
+
6
+ @import 'susy/utilities';
7
+ @import 'susy/su-validate';
8
+ @import 'susy/su-math';
9
+ @import 'susy/settings';
10
+ @import 'susy/normalize';
11
+ @import 'susy/parse';
12
+ @import 'susy/syntax-helpers';
13
+ @import 'susy/api';
@@ -0,0 +1,5 @@
1
+ // Susy (Un-Prefixed)
2
+ // ==================
3
+
4
+ @import 'susy-prefix';
5
+ @import 'susy/unprefix';
@@ -0,0 +1,5 @@
1
+ // SVG Grid Background
2
+ // ===================
3
+
4
+ @import 'svg-grid/prefix';
5
+ @import 'svg-grid/svg-unprefix';
@@ -0,0 +1,7 @@
1
+ // Prefixed SVG Plugin
2
+ // ===================
3
+
4
+ @import 'svg-settings';
5
+ @import 'svg-utilities';
6
+ @import 'svg-grid-math';
7
+ @import 'svg-api';
@@ -0,0 +1,114 @@
1
+ /// Plugin: SVG Grid Image
2
+ /// ======================
3
+ /// @group plugin_svg-grid
4
+ /// @see susy-svg-grid
5
+
6
+
7
+
8
+ /// ## Overview
9
+ /// If you want to generate svg-backgrounds
10
+ /// for help visualizing and debugging your grids,
11
+ /// import the SVG Grid Plugin.
12
+ ///
13
+ /// The plugin adds `svg-grid-colors` setting
14
+ /// to your global defaults,
15
+ /// which you can override in `$susy`.
16
+ /// It also provides you with a new function,
17
+ /// `susy-svg-grid()`,
18
+ /// which will return inline svg for use in
19
+ /// backgrounds or generated content.
20
+ ///
21
+ /// This function come with an unprefixed alias by default,
22
+ /// using the `svg-grid` import.
23
+ /// If you only only want prefixed versions of the API,
24
+ /// import the `svg-grid/prefix` partial instead.
25
+ ///
26
+ /// @group plugin_svg-grid
27
+ ///
28
+ /// @example scss - importing the plugin
29
+ /// // The full path to import Susy will depend on your setup…
30
+ ///
31
+ /// // unprefixed
32
+ /// @import 'plugins/svg-grid';
33
+ ///
34
+ /// // prefixed
35
+ /// @import 'plugins/svg-grid/prefix';
36
+ ///
37
+ /// @example scss - generating background grids
38
+ /// .grid {
39
+ /// background: susy-svg-grid() no-repeat scroll;
40
+ /// }
41
+
42
+
43
+
44
+ // SVG Grid
45
+ // --------
46
+ /// Return inline svg-data in to display the grid.
47
+ ///
48
+ /// @group plugin_svg-grid
49
+ ///
50
+ /// @param {Map | List} $grid [$susy] -
51
+ /// Map or shorthand defining the current grid
52
+ /// @param {Color | List | null} $colors [null] -
53
+ /// Column color, or list of colors for column-gradient,
54
+ /// used to override the global `svg-grid-colors` setting
55
+ /// @param {Length | null} $offset [null] -
56
+ /// Manually override the default grid-image offset,
57
+ /// to account for grid edges
58
+ ///
59
+ /// @return {String} -
60
+ /// CSS inline-data SVG string, in `url(<svg>)` format,
61
+ /// for use in image or content properties
62
+ /// @example scss
63
+ /// .grid {
64
+ /// background: susy-svg-grid() no-repeat scroll;
65
+ /// }
66
+ @function susy-svg-grid(
67
+ $grid: $susy,
68
+ $colors: null,
69
+ $offset: null
70
+ ) {
71
+ // Grid parsing & normalizing
72
+ $grid: susy-compile($grid, $context-only: true);
73
+
74
+ // Color and gradient handling
75
+ $gradient: '';
76
+
77
+ @if (not $colors) {
78
+ $colors: susy-get('svg-grid-colors');
79
+ }
80
+
81
+ @if length($colors) > 1 {
82
+ $gradient: _susy-svg-gradient($colors);
83
+ $colors: 'url(%23susy-svg-gradient)';
84
+ } @else {
85
+ $colors: _susy-svg-color($colors);
86
+ }
87
+
88
+ // Get a default image-width
89
+ $span: (
90
+ 'span': map-get($grid, 'columns'),
91
+ 'spread': map-get($grid, 'container-spread'),
92
+ );
93
+ $span: map-merge($grid, $span);
94
+ $image-width: su-call('su-span', $span);
95
+ $image-width: if((type-of($image-width) == 'number'), $image-width, 100%);
96
+
97
+ // SVG construction
98
+ $columns: map-get($grid, 'columns');
99
+ $offset: $offset or _susy-svg-offset($grid);
100
+
101
+ $attrs: 'fill="#{$colors}" width="#{$image-width}"';
102
+ $svg: 'data:image/svg+xml,';
103
+ $svg: $svg + '%3Csvg xmlns="http://www.w3.org/2000/svg" #{$attrs} %3E';
104
+ $svg: $svg + $gradient;
105
+
106
+ @for $column from 1 through length($columns) {
107
+ $width: susy-span(1 narrow at $column, $grid);
108
+ $x: _susy-svg-column-position($column, $grid);
109
+
110
+ $svg: $svg + _susy-svg-rect($x, $width, $offset);
111
+ }
112
+
113
+ @return url('#{$svg}%3C/svg%3E');
114
+ }
@@ -0,0 +1,67 @@
1
+ // SVG Grid Math
2
+ // =============
3
+
4
+
5
+
6
+ // SVG Column Position
7
+ // -------------------
8
+ /// Determine the proper horizontal position
9
+ /// for a column rectangle
10
+ ///
11
+ /// @access private
12
+ ///
13
+ /// @param {Integer} $column -
14
+ /// 1-indexed column location on the grid
15
+ /// @param {Map} $grid -
16
+ /// Normalized settings map representing the current grid
17
+ ///
18
+ /// @return {Length} -
19
+ /// Horizontal position of svg column rectangle,
20
+ /// as distance from the grid edge
21
+ @function _susy-svg-column-position(
22
+ $column,
23
+ $grid
24
+ ) {
25
+ $x: $column - 1;
26
+
27
+ @if ($x > 0) {
28
+ $x: susy-span(first $x wide, $grid);
29
+ }
30
+
31
+ @return $x;
32
+ }
33
+
34
+
35
+
36
+ // SVG Offset
37
+ // ----------
38
+ /// Determine if a grid image needs to be offset,
39
+ /// to account for edge gutters.
40
+ ///
41
+ /// @access private
42
+ ///
43
+ /// @param {Map} $grid -
44
+ /// Normalized settings map representing the current grid
45
+ ///
46
+ /// @return {Length | null} -
47
+ /// Expected distance from container edge to first column,
48
+ /// based on spread values and gutter-widths
49
+ @function _susy-svg-offset(
50
+ $grid
51
+ ) {
52
+ $columns: su-valid-columns(map-get($grid, 'columns'));
53
+ $gutters: su-valid-gutters(map-get($grid, 'gutters'));
54
+ $container: su-valid-spread(map-get($grid, 'container-spread')) + 1;
55
+
56
+ @if ($container == 0) {
57
+ @return null;
58
+ }
59
+
60
+ $gutter: su-call('su-gutter', $grid);
61
+
62
+ @if (type-of($gutter) == 'string') {
63
+ @return 'calc(#{$container} * #{$gutter} / 2)';
64
+ }
65
+
66
+ @return $container * $gutter / 2;
67
+ }
@@ -0,0 +1,14 @@
1
+ // SVG Settings
2
+ // ============
3
+
4
+
5
+ // Susy SVG Defaults
6
+ // =================
7
+ /// This plugin adds the `svg-grid-colors` property
8
+ /// and default value to `$_susy-defaults` —
9
+ /// you can override that value in `$susy`
10
+ /// or any other grid settings map.
11
+ /// @group plugin_svg-grid
12
+ $_susy-defaults: map-merge((
13
+ 'svg-grid-colors': hsla(120, 50%, 50%, 0.5) hsla(120, 50%, 75%, 0.5),
14
+ ), $_susy-defaults);
@@ -0,0 +1,18 @@
1
+ // Unprefix Susy SVG Grid
2
+ // ======================
3
+
4
+
5
+
6
+ // SVG Grid
7
+ // --------
8
+ /// Un-prefixed alias for `susy-svg-grid`
9
+ ///
10
+ /// @group plugin_svg-grid
11
+ /// @alias susy-svg-grid
12
+ @function svg-grid(
13
+ $grid: $susy,
14
+ $colors: susy-get('svg-grid-colors'),
15
+ $offset: null
16
+ ) {
17
+ @return susy-svg-grid($grid, $colors, $offset);
18
+ }
@@ -0,0 +1,133 @@
1
+ // SVG Utilities
2
+ // =============
3
+
4
+
5
+
6
+ // SVG Validate Units
7
+ // ------------------
8
+ /// Make sure a length is supported in svg
9
+ ///
10
+ /// @access private
11
+ ///
12
+ /// @param {Length} $length -
13
+ /// The length to validate
14
+ /// @param {String} $name [null] -
15
+ /// Optional name of length origin,
16
+ /// for error reporting
17
+ ///
18
+ /// @return {Length} -
19
+ /// An svg-validated length, or comparable valid length
20
+ @function _susy-svg-validate-units(
21
+ $length,
22
+ $name: null
23
+ ) {
24
+ $_svg-units: ('em', 'ex', 'px', 'pt', 'pc', 'cm', 'mm', 'in', '%');
25
+ $string: type-of($length) == 'string';
26
+
27
+ @if ($length == 0) or ($string) or index($_svg-units, unit($length)) {
28
+ @return $length;
29
+ }
30
+
31
+ @return _susy-error(
32
+ '`#{unit($length)}` #{$name} units are not supported in SVG',
33
+ '_susy-svg-validate-units');
34
+ }
35
+
36
+
37
+
38
+ // SVG Rect
39
+ // --------
40
+ /// Build a single svg rectangle
41
+ ///
42
+ /// @access private
43
+ ///
44
+ /// @param {Length} $x -
45
+ /// Horizontal position for the rectangle
46
+ /// @param {Length} $width -
47
+ /// Width of the rectangle
48
+ /// @param {Length} $offset [null] -
49
+ /// Offset the rectangle, to account for edge gutters
50
+ ///
51
+ /// @return {String} -
52
+ /// Escaped string representing one svg rectangle
53
+ @function _susy-svg-rect(
54
+ $x,
55
+ $width,
56
+ $offset: null
57
+ ) {
58
+ $x: _susy-svg-validate-units($x);
59
+ $width: _susy-svg-validate-units($width);
60
+ $offset: if($offset == 0, null, $offset);
61
+
62
+ @if (type-of($offset) == 'number') and (type-of($x) == 'number') {
63
+ @if comparable($x, $offset) {
64
+ $x: $x + $offset;
65
+ } @else {
66
+ $x: 'calc(#{$x} + #{$offset})';
67
+ }
68
+ } @else if $offset and ($x != 0) {
69
+ $x: 'calc(#{$x} + #{$offset})';
70
+ } @else if $offset {
71
+ $x: $offset;
72
+ }
73
+
74
+ @return '%3Crect x="#{$x}" width="#{$width}" height="100%"/%3E';
75
+ }
76
+
77
+
78
+
79
+ // SVG Color
80
+ // ---------
81
+ /// Stringify colors, and escape hex symbol
82
+ ///
83
+ /// @access private
84
+ ///
85
+ /// @param {Color} $color -
86
+ /// Color to stringify and escape
87
+ ///
88
+ /// @return {String} -
89
+ /// Escaped string value of color
90
+ @function _susy-svg-color(
91
+ $color
92
+ ) {
93
+ $color: inspect($color); // convert to string
94
+
95
+ @if (str-index($color, '#') == 1) {
96
+ $color: '%23' + str-slice($color, 2);
97
+ }
98
+
99
+ @return $color;
100
+ }
101
+
102
+
103
+
104
+ // SVG Gradient
105
+ // ------------
106
+ /// Create a multi-color svg gradient
107
+ ///
108
+ /// @access private
109
+ ///
110
+ /// @param {List} $colors -
111
+ /// List of colors to be equally spaced from `0%` to `100%`
112
+ /// in each column rectangle
113
+ ///
114
+ /// @return {String} -
115
+ /// Escaped string representing one svg gradient
116
+ /// (`id="susy-svg-gradient"`)
117
+ @function _susy-svg-gradient(
118
+ $colors
119
+ ) {
120
+ $gradient: '%3Cdefs%3E%3ClinearGradient spreadMethod="pad"';
121
+ $gradient: '#{$gradient} id="susy-svg-gradient"';
122
+ $gradient: '#{$gradient} x1="0%" y1="0%" x2="100%" y2="0%"%3E';
123
+
124
+ @for $i from 1 through length($colors) {
125
+ $color: _susy-svg-color(nth($colors, $i));
126
+ $offset: percentage(($i - 1) / (length($colors) - 1));
127
+ $stop: '%3Cstop offset="#{$offset}" style="stop-color:#{$color};" /%3E';
128
+
129
+ $gradient: $gradient + $stop;
130
+ }
131
+
132
+ @return $gradient + '%3C/linearGradient%3E%3C/defs%3E';
133
+ }
@@ -0,0 +1,318 @@
1
+ /// Susy3 API Functions
2
+ /// ===================
3
+ /// These three functions form the core of Susy's
4
+ /// layout-building grid API.
5
+ ///
6
+ /// - Use `span()` and `gutter()` to return any grid-width,
7
+ /// and apply the results wherever you need them:
8
+ /// CSS `width`, `margin`, `padding`, `flex-basis`, `transform`, etc.
9
+ /// - For asymmetrical-fluid grids,
10
+ /// `slice()` can help manage your nesting context.
11
+ ///
12
+ /// All three functions come with an unprefixed alias by default,
13
+ /// using the `susy` import.
14
+ /// Import the `susy-prefix` partial instead,
15
+ /// if you only only want prefixed versions of the API.
16
+ ///
17
+ /// This is a thin syntax-sugar shell around
18
+ /// the "Su" core-math functions: `su-span`, `su-gutter`, and `su-slice`.
19
+ /// If you prefer the more constrained syntax of the math engine,
20
+ /// you are welcome to use those functions instead.
21
+ ///
22
+ /// @group b-api
23
+ /// @see susy-span
24
+ /// @see susy-gutter
25
+ /// @see susy-slice
26
+ /// @see su-span
27
+ /// @see su-gutter
28
+ /// @see su-slice
29
+
30
+
31
+
32
+ /// ## Shorthand
33
+ ///
34
+ /// All functions draw on the same shorthand syntax in two parts,
35
+ /// seperated by the word `of`.
36
+ ///
37
+ /// ### Span Syntax: `<width>` [`<location>` `<spread>`]
38
+ /// The first part describes the
39
+ /// **span** width, location, and spread in any order.
40
+ /// Only the width is required:
41
+ ///
42
+ /// - `span(2)` will return the width of 2 columns.
43
+ /// - `span(3 wide)` will return 3-columns, with an additional gutter.
44
+ /// - location is only needed with asymmetrical grids,
45
+ /// where `span(3 at 2)` will return the width of
46
+ /// specific columns on the grid.
47
+ /// Since these are functions, they will not handle placement for you.
48
+ ///
49
+ /// ### Context Syntax: `[of <columns> <container-spread> <gutters>]`
50
+ /// The second half of Susy's shorthand
51
+ /// describes the grid-**context** –
52
+ /// available columns, container-spread, and optional gutter override –
53
+ /// in any order.
54
+ /// All of these settings have globally-defined defaults:
55
+ ///
56
+ /// - `span(2 of 6)` will set the context to
57
+ /// a slice of 6 columns from the global grid.
58
+ /// More details below.
59
+ /// - `span(2 of 12 wide)` changes the container-spread
60
+ /// as well as the column-context.
61
+ /// - `span(2 of 12 set-gutters 0.5em)`
62
+ /// will override the global gutters setting
63
+ /// for this one calculation.
64
+ ///
65
+ /// A single unitless number for `columns`
66
+ /// will be treated as a slice of the parent grid.
67
+ /// On a grid with `columns: susy-repeat(12, 120px)`,
68
+ /// the shorthand `of 4` will use the parent `120px` column-width.
69
+ /// You can also be more explicit,
70
+ /// and say `of susy-repeat(4, 100px)`.
71
+ /// If you are using asymmetrical grids,
72
+ /// like `columns: (1 1 2 3 5 8)`,
73
+ /// Susy can't slice it for you without knowing which columns you want.
74
+ /// The `slice` function accepts exactly the same syntax as `span`,
75
+ /// but returns a list of columns rather than a width.
76
+ /// Use it in your context like `of slice(first 3)`.
77
+ ///
78
+ /// @group b-api
79
+
80
+
81
+
82
+ // Susy Span
83
+ // ---------
84
+ /// This is the primary function in Susy —
85
+ /// used to return the width of a span across one or more columns,
86
+ /// and any relevant gutters along the way.
87
+ /// With the default settings,
88
+ /// `span(3)` will return the width of 3 columns,
89
+ /// and the 2 intermediate gutters.
90
+ /// This can be used to set the `width` property of grid elements,
91
+ /// or `margin` and `padding`
92
+ /// to push, pull, and pad your elements.
93
+ ///
94
+ /// - This is a thin syntax-sugar shell around
95
+ /// the core-math `su-span()` function.
96
+ /// - The un-prefixed alias `span()` is available by default.
97
+ ///
98
+ /// @group b-api
99
+ /// @see su-span
100
+ /// @see $susy
101
+ ///
102
+ /// @param {list} $span -
103
+ /// Shorthand expression to define the width of the span,
104
+ /// optionally containing:
105
+ /// - a count, length, or column-list span.
106
+ /// - `at $n`, `first`, or `last` location on asymmetrical grids,
107
+ /// where `at 1 == first`,
108
+ /// and `last` will calculate the proper location
109
+ /// based on columns and span.
110
+ /// - `narrow`, `wide`, or `wider` for optionally spreading
111
+ /// across adjacent gutters.
112
+ /// - `of $n <spread>` for available grid columns
113
+ /// and spread of the container.
114
+ /// Span counts like `of 6` are valid
115
+ /// in the context of symmetrical grids,
116
+ /// where Susy can safely infer a slice of the parent columns.
117
+ /// - and `set-gutters $n` to override global gutter settings.
118
+ ///
119
+ /// @param {map} $config [()] -
120
+ /// Optional map of Susy grid configuration settings.
121
+ /// See `$susy` documentation for details.
122
+ ///
123
+ /// @return {length} -
124
+ /// Calculated length value, using the units given,
125
+ /// or converting to `%` for fraction-based grids,
126
+ /// or a full `calc` function when units/fractions
127
+ /// are not comparable outside the browser.
128
+ ///
129
+ /// @example scss - span half the grid
130
+ /// .foo {
131
+ /// // the result is a bit under 50% to account for gutters
132
+ /// width: susy-span(6 of 12);
133
+ /// }
134
+ ///
135
+ /// @example scss - span a specific segment of asymmetrical grid
136
+ /// .foo {
137
+ /// width: susy-span(3 at 3 of (1 2 3 5 8));
138
+ /// }
139
+ @function susy-span(
140
+ $span,
141
+ $config: ()
142
+ ) {
143
+ $output: susy-compile($span, $config);
144
+
145
+ @if map-get($output, 'span') {
146
+ @return su-call('su-span', $output);
147
+ }
148
+
149
+ $actual: '[#{type-of($span)}] `#{inspect($span)}`';
150
+ @return _susy-error(
151
+ 'Unable to determine span value from #{$actual}.',
152
+ 'susy-span');
153
+ }
154
+
155
+
156
+
157
+ // Susy Gutter
158
+ // -----------
159
+ /// The gutter function returns
160
+ /// the width of a single gutter on your grid,
161
+ /// to be applied where you see fit –
162
+ /// on `margins`, `padding`, `transform`, or element `width`.
163
+ ///
164
+ /// - This is a thin syntax-sugar shell around
165
+ /// the core-math `su-gutter()` function.
166
+ /// - The un-prefixed alias `gutter()` is available by default.
167
+ ///
168
+ /// @group b-api
169
+ /// @see su-gutter
170
+ /// @see $susy
171
+ ///
172
+ /// @param {list | number} $context [null] -
173
+ /// Optional context for nested gutters,
174
+ /// including shorthand for
175
+ /// `columns`, `gutters`, and `container-spread`
176
+ /// (additional shorthand will be ignored)
177
+ ///
178
+ /// @param {map} $config [()] -
179
+ /// Optional map of Susy grid configuration settings.
180
+ /// See `$susy` documentation for details.
181
+ ///
182
+ /// @return {length} -
183
+ /// Width of a gutter as `%` of current context,
184
+ /// or in the units defined by `column-width` when available
185
+ ///
186
+ /// @example scss - add gutters before or after an element
187
+ /// .floats {
188
+ /// float: left;
189
+ /// width: span(3 of 6);
190
+ /// margin-left: gutter(of 6);
191
+ /// }
192
+ ///
193
+ /// @example scss - add gutters to padding
194
+ /// .flexbox {
195
+ /// flex: 1 1 span(3 wide of 6 wide);
196
+ /// padding: gutter(of 6) / 2;
197
+ /// }
198
+ ///
199
+ @function susy-gutter(
200
+ $context: susy-get('columns'),
201
+ $config: ()
202
+ ) {
203
+ $context: susy-compile($context, $config, 'context-only');
204
+
205
+ @return su-call('su-gutter', $context);
206
+ }
207
+
208
+
209
+
210
+ // Susy Slice
211
+ // ----------
212
+ /// Working with asymmetrical grids (un-equal column widths)
213
+ /// can be challenging – 
214
+ /// expecially when they involve fluid/fractional elements.
215
+ /// Describing a context `of (15em 6em 6em 6em 15em)` is a lot
216
+ /// to put inside the span or gutter function shorthand.
217
+ /// This slice function returns a sub-slice of asymmetrical columns to use
218
+ /// for a nested context.
219
+ /// `slice(3 at 2)` will give you a subset of the global grid,
220
+ /// spanning 3 columns, starting with the second.
221
+ ///
222
+ /// - This is a thin syntax-sugar shell around
223
+ /// the core-math `su-slice()` function.
224
+ /// - The un-prefixed alias `slice()` is available by default.
225
+ ///
226
+ /// @group b-api
227
+ /// @see su-slice
228
+ /// @see $susy
229
+ ///
230
+ /// @param {list} $span -
231
+ /// Shorthand expression to define the subset span, optionally containing:
232
+ /// - `at $n`, `first`, or `last` location on asymmetrical grids;
233
+ /// - `of $n <spread>` for available grid columns
234
+ /// and spread of the container
235
+ /// - Span-counts like `of 6` are only valid
236
+ /// in the context of symmetrical grids
237
+ /// - Valid spreads include `narrow`, `wide`, or `wider`
238
+ ///
239
+ /// @param {map} $config [()] -
240
+ /// Optional map of Susy grid configuration settings.
241
+ /// See `$susy` documentation for details.
242
+ ///
243
+ /// @return {list} -
244
+ /// Subset list of columns for use for a nested context
245
+ ///
246
+ /// @example scss - Return a nested segment of asymmetrical grid
247
+ /// $context: susy-slice(3 at 3 of (1 2 3 5 8));
248
+ /// /* $context: #{$context}; */
249
+ @function susy-slice(
250
+ $span,
251
+ $config: ()
252
+ ) {
253
+ $span: susy-compile($span, $config);
254
+
255
+ @return su-call('su-slice', $span);
256
+ }
257
+
258
+
259
+
260
+ /// ## Building Grids
261
+ /// The web has come a long way
262
+ /// since the days of double-margin-hacks
263
+ /// and inconsistent subpixel rounding.
264
+ /// In addition to floats and tables,
265
+ /// we can now use much more powerful tools,
266
+ /// like flexbox and CSS grid,
267
+ /// to build more interesting and responsive layouts.
268
+ ///
269
+ /// With Susy3, we hope you'll start moving in that direction.
270
+ /// You can still build classic 12-column Grid Systems,
271
+ /// and we'll help you get there,
272
+ /// but Susy3 is primarily designed for a grid-math-on-demand
273
+ /// approach to layout:
274
+ /// applying our functions only where you really need grid math.
275
+ /// Read the [intro article by OddBird][welcome] for more details.
276
+ ///
277
+ /// [welcome]: http://oddbird.net/2017/06/28/susy3/
278
+ ///
279
+ /// @group b-api
280
+ /// @link http://oddbird.net/2017/06/28/susy3/ Article: Welcome to Susy3
281
+ ///
282
+ /// @example scss - floats
283
+ /// .float {
284
+ /// width: span(3);
285
+ /// margin-right: gutter();
286
+ /// }
287
+ ///
288
+ /// @example scss - flexbox
289
+ /// .flexbox {
290
+ /// flex: 1 1 span(3);
291
+ /// // half a gutter on either side…
292
+ /// padding: 0 gutter() / 2;
293
+ /// }
294
+ ///
295
+ /// @example scss - pushing and pulling
296
+ /// .push-3 {
297
+ /// margin-left: span(3 wide);
298
+ /// }
299
+ ///
300
+ /// .pull-3 {
301
+ /// margin-left: 0 - span(3 wide);
302
+ /// }
303
+ ///
304
+ /// @example scss - building an attribute system
305
+ /// // markup example: <div data-span="last 3"></div>
306
+ /// [data-span] {
307
+ /// float: left;
308
+ ///
309
+ /// &:not([data-span*='last']) {
310
+ /// margin-right: gutter();
311
+ /// }
312
+ /// }
313
+ ///
314
+ /// @for $span from 1 through length(susy-get('columns')) {
315
+ /// [data-span*='#{$span}'] {
316
+ /// width: span($span);
317
+ /// }
318
+ /// }