@ulu/frontend 0.1.0-beta.32 → 0.1.0-beta.33

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (160) hide show
  1. package/CHANGELOG.md +32 -0
  2. package/dist/ulu-frontend.min.css +1 -1
  3. package/dist/ulu-frontend.min.js +11 -11
  4. package/docs-dev/changelog/index.html +77 -8
  5. package/docs-dev/demos/accordion/index.html +8 -8
  6. package/docs-dev/demos/button/index.html +8 -8
  7. package/docs-dev/demos/button-verbose/index.html +8 -8
  8. package/docs-dev/demos/callout/index.html +26 -8
  9. package/docs-dev/demos/captioned-figure/index.html +8 -8
  10. package/docs-dev/demos/card/index.html +29 -33
  11. package/docs-dev/demos/card-grid/index.html +12 -12
  12. package/docs-dev/demos/css-icons/index.html +8 -8
  13. package/docs-dev/demos/data-grid/index.html +8 -8
  14. package/docs-dev/demos/data-table/index.html +33 -33
  15. package/docs-dev/demos/details-group/index.html +8 -8
  16. package/docs-dev/demos/file-save/index.html +8 -8
  17. package/docs-dev/demos/flipcard/index.html +8 -8
  18. package/docs-dev/demos/form-theme/index.html +8 -8
  19. package/docs-dev/demos/index.html +8 -8
  20. package/docs-dev/demos/list-inline/index.html +8 -8
  21. package/docs-dev/demos/list-lines/index.html +8 -8
  22. package/docs-dev/demos/menu-stack/index.html +8 -8
  23. package/docs-dev/demos/modals/index.html +8 -8
  24. package/docs-dev/demos/nav-strip/index.html +8 -8
  25. package/docs-dev/demos/overlay-section/index.html +8 -8
  26. package/docs-dev/demos/popovers/index.html +8 -8
  27. package/docs-dev/demos/print/index.html +8 -8
  28. package/docs-dev/demos/pull-quote/index.html +8 -8
  29. package/docs-dev/demos/rule/index.html +8 -8
  30. package/docs-dev/demos/scrollpoints/index.html +8 -8
  31. package/docs-dev/demos/spoke-spinner/index.html +8 -8
  32. package/docs-dev/demos/sticky-list/index.html +8 -8
  33. package/docs-dev/demos/tabs/index.html +8 -8
  34. package/docs-dev/demos/tag/index.html +8 -8
  35. package/docs-dev/demos/theme-toggle/index.html +8 -8
  36. package/docs-dev/demos/tiles/index.html +8 -8
  37. package/docs-dev/demos/tooltip/index.html +8 -8
  38. package/docs-dev/guide/building-stylesheet/index.html +8 -8
  39. package/docs-dev/guide/developing-ulu-scss-module/index.html +8 -8
  40. package/docs-dev/guide/index.html +8 -8
  41. package/docs-dev/index.html +8 -8
  42. package/docs-dev/javascript/events/index.html +8 -8
  43. package/docs-dev/javascript/index.html +8 -8
  44. package/docs-dev/javascript/settings/index.html +8 -8
  45. package/docs-dev/javascript/ui-breakpoints/index.html +8 -8
  46. package/docs-dev/javascript/ui-collapsible/index.html +8 -8
  47. package/docs-dev/javascript/ui-details-group/index.html +8 -8
  48. package/docs-dev/javascript/ui-dialog/index.html +8 -8
  49. package/docs-dev/javascript/ui-flipcard/index.html +8 -8
  50. package/docs-dev/javascript/ui-grid/index.html +8 -8
  51. package/docs-dev/javascript/ui-modal-builder/index.html +8 -8
  52. package/docs-dev/javascript/ui-overflow-scroller/index.html +8 -8
  53. package/docs-dev/javascript/ui-overflow-scroller-pager/index.html +8 -8
  54. package/docs-dev/javascript/ui-page/index.html +8 -8
  55. package/docs-dev/javascript/ui-popover/index.html +8 -8
  56. package/docs-dev/javascript/ui-print/index.html +8 -8
  57. package/docs-dev/javascript/ui-print-details/index.html +8 -8
  58. package/docs-dev/javascript/ui-programmatic-modal/index.html +8 -8
  59. package/docs-dev/javascript/ui-proxy-click/index.html +8 -8
  60. package/docs-dev/javascript/ui-resizer/index.html +8 -8
  61. package/docs-dev/javascript/ui-scroll-slider/index.html +8 -8
  62. package/docs-dev/javascript/ui-scrollpoint/index.html +8 -8
  63. package/docs-dev/javascript/ui-slider/index.html +8 -8
  64. package/docs-dev/javascript/ui-tabs/index.html +8 -8
  65. package/docs-dev/javascript/ui-theme-toggle/index.html +8 -8
  66. package/docs-dev/javascript/ui-tooltip/index.html +8 -8
  67. package/docs-dev/javascript/utils-class-logger/index.html +8 -8
  68. package/docs-dev/javascript/utils-dom/index.html +8 -8
  69. package/docs-dev/javascript/utils-file-save/index.html +8 -8
  70. package/docs-dev/javascript/utils-floating-ui/index.html +8 -8
  71. package/docs-dev/javascript/utils-id/index.html +8 -8
  72. package/docs-dev/javascript/utils-pause-youtube-video/index.html +8 -8
  73. package/docs-dev/sass/base/color/index.html +8 -8
  74. package/docs-dev/sass/base/elements/index.html +8 -8
  75. package/docs-dev/sass/base/index/index.html +8 -8
  76. package/docs-dev/sass/base/index.html +8 -8
  77. package/docs-dev/sass/base/keyframes/index.html +8 -8
  78. package/docs-dev/sass/base/layout/index.html +8 -8
  79. package/docs-dev/sass/base/normalize/index.html +8 -8
  80. package/docs-dev/sass/base/print/index.html +8 -8
  81. package/docs-dev/sass/base/root/index.html +8 -8
  82. package/docs-dev/sass/base/typography/index.html +8 -8
  83. package/docs-dev/sass/components/accordion/index.html +8 -8
  84. package/docs-dev/sass/components/adaptive-spacing/index.html +8 -8
  85. package/docs-dev/sass/components/badge/index.html +8 -8
  86. package/docs-dev/sass/components/basic-hero/index.html +8 -8
  87. package/docs-dev/sass/components/button/index.html +8 -8
  88. package/docs-dev/sass/components/button-verbose/index.html +42 -37
  89. package/docs-dev/sass/components/callout/index.html +94 -35
  90. package/docs-dev/sass/components/captioned-figure/index.html +8 -8
  91. package/docs-dev/sass/components/card/index.html +8 -8
  92. package/docs-dev/sass/components/card-grid/index.html +8 -8
  93. package/docs-dev/sass/components/css-icon/index.html +8 -8
  94. package/docs-dev/sass/components/data-grid/index.html +8 -8
  95. package/docs-dev/sass/components/data-table/index.html +8 -8
  96. package/docs-dev/sass/components/fill-context/index.html +8 -8
  97. package/docs-dev/sass/components/flipcard/index.html +8 -8
  98. package/docs-dev/sass/components/flipcard-grid/index.html +8 -8
  99. package/docs-dev/sass/components/form-theme/index.html +8 -8
  100. package/docs-dev/sass/components/hero/index.html +8 -8
  101. package/docs-dev/sass/components/horizontal-rule/index.html +8 -8
  102. package/docs-dev/sass/components/image-grid/index.html +8 -8
  103. package/docs-dev/sass/components/index/index.html +8 -8
  104. package/docs-dev/sass/components/index.html +8 -8
  105. package/docs-dev/sass/components/links/index.html +8 -8
  106. package/docs-dev/sass/components/list-inline/index.html +8 -8
  107. package/docs-dev/sass/components/list-lines/index.html +8 -8
  108. package/docs-dev/sass/components/list-ordered/index.html +8 -8
  109. package/docs-dev/sass/components/list-unordered/index.html +8 -8
  110. package/docs-dev/sass/components/menu-stack/index.html +8 -8
  111. package/docs-dev/sass/components/modal/index.html +8 -8
  112. package/docs-dev/sass/components/nav-strip/index.html +8 -8
  113. package/docs-dev/sass/components/overlay-section/index.html +8 -8
  114. package/docs-dev/sass/components/pager/index.html +8 -8
  115. package/docs-dev/sass/components/placeholder-block/index.html +8 -8
  116. package/docs-dev/sass/components/popover/index.html +8 -8
  117. package/docs-dev/sass/components/pull-quote/index.html +8 -8
  118. package/docs-dev/sass/components/ratio-box/index.html +8 -8
  119. package/docs-dev/sass/components/rule/index.html +8 -8
  120. package/docs-dev/sass/components/scroll-slider/index.html +8 -8
  121. package/docs-dev/sass/components/skip-link/index.html +8 -8
  122. package/docs-dev/sass/components/slider/index.html +8 -8
  123. package/docs-dev/sass/components/spoke-spinner/index.html +10 -10
  124. package/docs-dev/sass/components/sticky-list/index.html +8 -8
  125. package/docs-dev/sass/components/tabs/index.html +8 -8
  126. package/docs-dev/sass/components/tag/index.html +10 -10
  127. package/docs-dev/sass/components/tile-button/index.html +8 -8
  128. package/docs-dev/sass/components/tile-grid/index.html +8 -8
  129. package/docs-dev/sass/components/tile-grid-overlay/index.html +8 -8
  130. package/docs-dev/sass/components/vignette/index.html +8 -8
  131. package/docs-dev/sass/components/wysiwyg/index.html +8 -8
  132. package/docs-dev/sass/core/breakpoint/index.html +8 -8
  133. package/docs-dev/sass/core/button/index.html +8 -8
  134. package/docs-dev/sass/core/color/index.html +8 -8
  135. package/docs-dev/sass/core/cssvar/index.html +8 -8
  136. package/docs-dev/sass/core/element/index.html +188 -47
  137. package/docs-dev/sass/core/index.html +8 -8
  138. package/docs-dev/sass/core/layout/index.html +64 -45
  139. package/docs-dev/sass/core/path/index.html +8 -8
  140. package/docs-dev/sass/core/selector/index.html +8 -8
  141. package/docs-dev/sass/core/typography/index.html +8 -8
  142. package/docs-dev/sass/core/units/index.html +8 -8
  143. package/docs-dev/sass/core/utils/index.html +272 -68
  144. package/docs-dev/sass/helpers/color/index.html +8 -8
  145. package/docs-dev/sass/helpers/display/index.html +8 -8
  146. package/docs-dev/sass/helpers/index/index.html +8 -8
  147. package/docs-dev/sass/helpers/index.html +8 -8
  148. package/docs-dev/sass/helpers/print/index.html +8 -8
  149. package/docs-dev/sass/helpers/typography/index.html +8 -8
  150. package/docs-dev/sass/helpers/units/index.html +8 -8
  151. package/docs-dev/sass/helpers/utilities/index.html +8 -8
  152. package/docs-dev/sass/index.html +8 -8
  153. package/js/ui/tooltip.js +2 -1
  154. package/package.json +1 -1
  155. package/scss/_element.scss +91 -0
  156. package/scss/_layout.scss +3 -1
  157. package/scss/_utils.scss +42 -0
  158. package/scss/components/_button-verbose.scss +41 -36
  159. package/scss/components/_callout.scss +113 -53
  160. package/types/ui/tooltip.d.ts.map +1 -1
@@ -243,11 +243,11 @@
243
243
 
244
244
  <li class="nav-tree__item ">
245
245
 
246
- <a class="nav-tree__link " href="/frontend/demos/card-grid/">
246
+ <a class="nav-tree__link " href="/frontend/demos/card/">
247
247
 
248
248
 
249
249
  <span class="nav-tree__text">
250
- Card Grid
250
+ Card
251
251
  </span>
252
252
 
253
253
  </a>
@@ -258,11 +258,11 @@
258
258
 
259
259
  <li class="nav-tree__item ">
260
260
 
261
- <a class="nav-tree__link " href="/frontend/demos/card/">
261
+ <a class="nav-tree__link " href="/frontend/demos/card-grid/">
262
262
 
263
263
 
264
264
  <span class="nav-tree__text">
265
- Card New
265
+ Card Grid
266
266
  </span>
267
267
 
268
268
  </a>
@@ -2729,11 +2729,11 @@
2729
2729
 
2730
2730
  <li class="nav-tree__item ">
2731
2731
 
2732
- <a class="nav-tree__link " href="/frontend/demos/card-grid/">
2732
+ <a class="nav-tree__link " href="/frontend/demos/card/">
2733
2733
 
2734
2734
 
2735
2735
  <span class="nav-tree__text">
2736
- Card Grid
2736
+ Card
2737
2737
  </span>
2738
2738
 
2739
2739
  </a>
@@ -2744,11 +2744,11 @@
2744
2744
 
2745
2745
  <li class="nav-tree__item ">
2746
2746
 
2747
- <a class="nav-tree__link " href="/frontend/demos/card/">
2747
+ <a class="nav-tree__link " href="/frontend/demos/card-grid/">
2748
2748
 
2749
2749
 
2750
2750
  <span class="nav-tree__text">
2751
- Card New
2751
+ Card Grid
2752
2752
  </span>
2753
2753
 
2754
2754
  </a>
@@ -243,11 +243,11 @@
243
243
 
244
244
  <li class="nav-tree__item ">
245
245
 
246
- <a class="nav-tree__link " href="/frontend/demos/card-grid/">
246
+ <a class="nav-tree__link " href="/frontend/demos/card/">
247
247
 
248
248
 
249
249
  <span class="nav-tree__text">
250
- Card Grid
250
+ Card
251
251
  </span>
252
252
 
253
253
  </a>
@@ -258,11 +258,11 @@
258
258
 
259
259
  <li class="nav-tree__item ">
260
260
 
261
- <a class="nav-tree__link " href="/frontend/demos/card/">
261
+ <a class="nav-tree__link " href="/frontend/demos/card-grid/">
262
262
 
263
263
 
264
264
  <span class="nav-tree__text">
265
- Card New
265
+ Card Grid
266
266
  </span>
267
267
 
268
268
  </a>
@@ -2729,11 +2729,11 @@
2729
2729
 
2730
2730
  <li class="nav-tree__item ">
2731
2731
 
2732
- <a class="nav-tree__link " href="/frontend/demos/card-grid/">
2732
+ <a class="nav-tree__link " href="/frontend/demos/card/">
2733
2733
 
2734
2734
 
2735
2735
  <span class="nav-tree__text">
2736
- Card Grid
2736
+ Card
2737
2737
  </span>
2738
2738
 
2739
2739
  </a>
@@ -2744,11 +2744,11 @@
2744
2744
 
2745
2745
  <li class="nav-tree__item ">
2746
2746
 
2747
- <a class="nav-tree__link " href="/frontend/demos/card/">
2747
+ <a class="nav-tree__link " href="/frontend/demos/card-grid/">
2748
2748
 
2749
2749
 
2750
2750
  <span class="nav-tree__text">
2751
- Card New
2751
+ Card Grid
2752
2752
  </span>
2753
2753
 
2754
2754
  </a>
@@ -243,11 +243,11 @@
243
243
 
244
244
  <li class="nav-tree__item ">
245
245
 
246
- <a class="nav-tree__link " href="/frontend/demos/card-grid/">
246
+ <a class="nav-tree__link " href="/frontend/demos/card/">
247
247
 
248
248
 
249
249
  <span class="nav-tree__text">
250
- Card Grid
250
+ Card
251
251
  </span>
252
252
 
253
253
  </a>
@@ -258,11 +258,11 @@
258
258
 
259
259
  <li class="nav-tree__item ">
260
260
 
261
- <a class="nav-tree__link " href="/frontend/demos/card/">
261
+ <a class="nav-tree__link " href="/frontend/demos/card-grid/">
262
262
 
263
263
 
264
264
  <span class="nav-tree__text">
265
- Card New
265
+ Card Grid
266
266
  </span>
267
267
 
268
268
  </a>
@@ -2729,11 +2729,11 @@
2729
2729
 
2730
2730
  <li class="nav-tree__item ">
2731
2731
 
2732
- <a class="nav-tree__link " href="/frontend/demos/card-grid/">
2732
+ <a class="nav-tree__link " href="/frontend/demos/card/">
2733
2733
 
2734
2734
 
2735
2735
  <span class="nav-tree__text">
2736
- Card Grid
2736
+ Card
2737
2737
  </span>
2738
2738
 
2739
2739
  </a>
@@ -2744,11 +2744,11 @@
2744
2744
 
2745
2745
  <li class="nav-tree__item ">
2746
2746
 
2747
- <a class="nav-tree__link " href="/frontend/demos/card/">
2747
+ <a class="nav-tree__link " href="/frontend/demos/card-grid/">
2748
2748
 
2749
2749
 
2750
2750
  <span class="nav-tree__text">
2751
- Card New
2751
+ Card Grid
2752
2752
  </span>
2753
2753
 
2754
2754
  </a>
@@ -243,11 +243,11 @@
243
243
 
244
244
  <li class="nav-tree__item ">
245
245
 
246
- <a class="nav-tree__link " href="/frontend/demos/card-grid/">
246
+ <a class="nav-tree__link " href="/frontend/demos/card/">
247
247
 
248
248
 
249
249
  <span class="nav-tree__text">
250
- Card Grid
250
+ Card
251
251
  </span>
252
252
 
253
253
  </a>
@@ -258,11 +258,11 @@
258
258
 
259
259
  <li class="nav-tree__item ">
260
260
 
261
- <a class="nav-tree__link " href="/frontend/demos/card/">
261
+ <a class="nav-tree__link " href="/frontend/demos/card-grid/">
262
262
 
263
263
 
264
264
  <span class="nav-tree__text">
265
- Card New
265
+ Card Grid
266
266
  </span>
267
267
 
268
268
  </a>
@@ -2729,11 +2729,11 @@
2729
2729
 
2730
2730
  <li class="nav-tree__item ">
2731
2731
 
2732
- <a class="nav-tree__link " href="/frontend/demos/card-grid/">
2732
+ <a class="nav-tree__link " href="/frontend/demos/card/">
2733
2733
 
2734
2734
 
2735
2735
  <span class="nav-tree__text">
2736
- Card Grid
2736
+ Card
2737
2737
  </span>
2738
2738
 
2739
2739
  </a>
@@ -2744,11 +2744,11 @@
2744
2744
 
2745
2745
  <li class="nav-tree__item ">
2746
2746
 
2747
- <a class="nav-tree__link " href="/frontend/demos/card/">
2747
+ <a class="nav-tree__link " href="/frontend/demos/card-grid/">
2748
2748
 
2749
2749
 
2750
2750
  <span class="nav-tree__text">
2751
- Card New
2751
+ Card Grid
2752
2752
  </span>
2753
2753
 
2754
2754
  </a>
@@ -243,11 +243,11 @@
243
243
 
244
244
  <li class="nav-tree__item ">
245
245
 
246
- <a class="nav-tree__link " href="/frontend/demos/card-grid/">
246
+ <a class="nav-tree__link " href="/frontend/demos/card/">
247
247
 
248
248
 
249
249
  <span class="nav-tree__text">
250
- Card Grid
250
+ Card
251
251
  </span>
252
252
 
253
253
  </a>
@@ -258,11 +258,11 @@
258
258
 
259
259
  <li class="nav-tree__item ">
260
260
 
261
- <a class="nav-tree__link " href="/frontend/demos/card/">
261
+ <a class="nav-tree__link " href="/frontend/demos/card-grid/">
262
262
 
263
263
 
264
264
  <span class="nav-tree__text">
265
- Card New
265
+ Card Grid
266
266
  </span>
267
267
 
268
268
  </a>
@@ -2729,11 +2729,11 @@
2729
2729
 
2730
2730
  <li class="nav-tree__item ">
2731
2731
 
2732
- <a class="nav-tree__link " href="/frontend/demos/card-grid/">
2732
+ <a class="nav-tree__link " href="/frontend/demos/card/">
2733
2733
 
2734
2734
 
2735
2735
  <span class="nav-tree__text">
2736
- Card Grid
2736
+ Card
2737
2737
  </span>
2738
2738
 
2739
2739
  </a>
@@ -2744,11 +2744,11 @@
2744
2744
 
2745
2745
  <li class="nav-tree__item ">
2746
2746
 
2747
- <a class="nav-tree__link " href="/frontend/demos/card/">
2747
+ <a class="nav-tree__link " href="/frontend/demos/card-grid/">
2748
2748
 
2749
2749
 
2750
2750
  <span class="nav-tree__text">
2751
- Card New
2751
+ Card Grid
2752
2752
  </span>
2753
2753
 
2754
2754
  </a>
@@ -5097,6 +5097,12 @@
5097
5097
 
5098
5098
  <li><a href="#mixin-hidden-visually">hidden-visually()</a>
5099
5099
  </li>
5100
+
5101
+ <li><a href="#mixin-cap">cap()</a>
5102
+ </li>
5103
+
5104
+ <li><a href="#mixin-cap-appearance">cap-appearance()</a>
5105
+ </li>
5100
5106
  </ol>
5101
5107
  </li>
5102
5108
 
@@ -5166,6 +5172,8 @@
5166
5172
  <span class="pjs-token pjs-string">"ul-list-style-type"</span><span class="pjs-token pjs-punctuation">:</span> disc<span class="pjs-token pjs-punctuation">,</span>
5167
5173
  <span class="pjs-token pjs-string">"ul-list-style-type-2"</span><span class="pjs-token pjs-punctuation">:</span> circle<span class="pjs-token pjs-punctuation">,</span>
5168
5174
  <span class="pjs-token pjs-string">"ul-list-style-type-3"</span><span class="pjs-token pjs-punctuation">:</span> square<span class="pjs-token pjs-punctuation">,</span>
5175
+ <span class="pjs-token pjs-string">"cap-color"</span> <span class="pjs-token pjs-punctuation">:</span> <span class="pjs-token pjs-string">"accent"</span><span class="pjs-token pjs-punctuation">,</span>
5176
+ <span class="pjs-token pjs-string">"cap-size"</span> <span class="pjs-token pjs-punctuation">:</span> 5px
5169
5177
  <span class="pjs-token pjs-punctuation">)</span><span class="pjs-token pjs-punctuation">;</span></code></pre>
5170
5178
  <details>
5171
5179
  <summary>File Information</summary>
@@ -5174,7 +5182,7 @@
5174
5182
  <li><strong>Group:</strong> element</li>
5175
5183
  <li><strong>Type:</strong> variable</li>
5176
5184
  <li><strong>Lines (comments):</strong> 10-40</li>
5177
- <li><strong>Lines (code):</strong> 42-72</li>
5185
+ <li><strong>Lines (code):</strong> 42-74</li>
5178
5186
  </ul>
5179
5187
  </details>
5180
5188
  <h4 id="map-properties" tabindex="-1">Map Properties</h4>
@@ -5381,8 +5389,8 @@
5381
5389
  <li><strong>File:</strong> _element.scss</li>
5382
5390
  <li><strong>Group:</strong> element</li>
5383
5391
  <li><strong>Type:</strong> variable</li>
5384
- <li><strong>Lines (comments):</strong> 74-75</li>
5385
- <li><strong>Lines (code):</strong> 77-80</li>
5392
+ <li><strong>Lines (comments):</strong> 76-77</li>
5393
+ <li><strong>Lines (code):</strong> 79-82</li>
5386
5394
  </ul>
5387
5395
  </details>
5388
5396
  <div class="sassdoc-item-header">
@@ -5404,8 +5412,8 @@
5404
5412
  <li><strong>File:</strong> _element.scss</li>
5405
5413
  <li><strong>Group:</strong> element</li>
5406
5414
  <li><strong>Type:</strong> variable</li>
5407
- <li><strong>Lines (comments):</strong> 82-83</li>
5408
- <li><strong>Lines (code):</strong> 85-90</li>
5415
+ <li><strong>Lines (comments):</strong> 84-85</li>
5416
+ <li><strong>Lines (code):</strong> 87-92</li>
5409
5417
  </ul>
5410
5418
  </details>
5411
5419
  <h2 id="mixins" tabindex="-1">Mixins</h2>
@@ -5422,8 +5430,8 @@
5422
5430
  <li><strong>File:</strong> _element.scss</li>
5423
5431
  <li><strong>Group:</strong> element</li>
5424
5432
  <li><strong>Type:</strong> mixin</li>
5425
- <li><strong>Lines (comments):</strong> 92-94</li>
5426
- <li><strong>Lines (code):</strong> 96-98</li>
5433
+ <li><strong>Lines (comments):</strong> 94-96</li>
5434
+ <li><strong>Lines (code):</strong> 98-100</li>
5427
5435
  </ul>
5428
5436
  </details>
5429
5437
  <h4 id="parameters" tabindex="-1">Parameters</h4>
@@ -5465,8 +5473,8 @@
5465
5473
  <li><strong>File:</strong> _element.scss</li>
5466
5474
  <li><strong>Group:</strong> element</li>
5467
5475
  <li><strong>Type:</strong> mixin</li>
5468
- <li><strong>Lines (comments):</strong> 108-109</li>
5469
- <li><strong>Lines (code):</strong> 111-113</li>
5476
+ <li><strong>Lines (comments):</strong> 110-111</li>
5477
+ <li><strong>Lines (code):</strong> 113-115</li>
5470
5478
  </ul>
5471
5479
  </details>
5472
5480
  <h4 id="parameters-1" tabindex="-1">Parameters</h4>
@@ -5503,8 +5511,8 @@
5503
5511
  <li><strong>File:</strong> _element.scss</li>
5504
5512
  <li><strong>Group:</strong> element</li>
5505
5513
  <li><strong>Type:</strong> mixin</li>
5506
- <li><strong>Lines (comments):</strong> 115-116</li>
5507
- <li><strong>Lines (code):</strong> 118-120</li>
5514
+ <li><strong>Lines (comments):</strong> 117-118</li>
5515
+ <li><strong>Lines (code):</strong> 120-122</li>
5508
5516
  </ul>
5509
5517
  </details>
5510
5518
  <h4 id="parameters-2" tabindex="-1">Parameters</h4>
@@ -5541,8 +5549,8 @@
5541
5549
  <li><strong>File:</strong> _element.scss</li>
5542
5550
  <li><strong>Group:</strong> element</li>
5543
5551
  <li><strong>Type:</strong> mixin</li>
5544
- <li><strong>Lines (comments):</strong> 136-137</li>
5545
- <li><strong>Lines (code):</strong> 139-145</li>
5552
+ <li><strong>Lines (comments):</strong> 138-139</li>
5553
+ <li><strong>Lines (code):</strong> 141-147</li>
5546
5554
  </ul>
5547
5555
  </details>
5548
5556
  <h4 id="parameters-3" tabindex="-1">Parameters</h4>
@@ -5580,8 +5588,8 @@
5580
5588
  <li><strong>File:</strong> _element.scss</li>
5581
5589
  <li><strong>Group:</strong> element</li>
5582
5590
  <li><strong>Type:</strong> mixin</li>
5583
- <li><strong>Lines (comments):</strong> 147-148</li>
5584
- <li><strong>Lines (code):</strong> 150-152</li>
5591
+ <li><strong>Lines (comments):</strong> 149-150</li>
5592
+ <li><strong>Lines (code):</strong> 152-154</li>
5585
5593
  </ul>
5586
5594
  </details>
5587
5595
  <h4 id="parameters-4" tabindex="-1">Parameters</h4>
@@ -5620,8 +5628,8 @@
5620
5628
  <li><strong>File:</strong> _element.scss</li>
5621
5629
  <li><strong>Group:</strong> element</li>
5622
5630
  <li><strong>Type:</strong> mixin</li>
5623
- <li><strong>Lines (comments):</strong> 154-155</li>
5624
- <li><strong>Lines (code):</strong> 157-161</li>
5631
+ <li><strong>Lines (comments):</strong> 156-157</li>
5632
+ <li><strong>Lines (code):</strong> 159-163</li>
5625
5633
  </ul>
5626
5634
  </details>
5627
5635
  <h4 id="parameters-5" tabindex="-1">Parameters</h4>
@@ -5667,8 +5675,8 @@ styling (text-decoration, etc)</li>
5667
5675
  <li><strong>File:</strong> _element.scss</li>
5668
5676
  <li><strong>Group:</strong> element</li>
5669
5677
  <li><strong>Type:</strong> mixin</li>
5670
- <li><strong>Lines (comments):</strong> 163-169</li>
5671
- <li><strong>Lines (code):</strong> 171-184</li>
5678
+ <li><strong>Lines (comments):</strong> 165-171</li>
5679
+ <li><strong>Lines (code):</strong> 173-186</li>
5672
5680
  </ul>
5673
5681
  </details>
5674
5682
  <h4 id="parameters-6" tabindex="-1">Parameters</h4>
@@ -5710,8 +5718,8 @@ styling (text-decoration, etc)</li>
5710
5718
  <li><strong>File:</strong> _element.scss</li>
5711
5719
  <li><strong>Group:</strong> element</li>
5712
5720
  <li><strong>Type:</strong> mixin</li>
5713
- <li><strong>Lines (comments):</strong> 186-188</li>
5714
- <li><strong>Lines (code):</strong> 190-212</li>
5721
+ <li><strong>Lines (comments):</strong> 188-190</li>
5722
+ <li><strong>Lines (code):</strong> 192-214</li>
5715
5723
  </ul>
5716
5724
  </details>
5717
5725
  <h4 id="parameters-7" tabindex="-1">Parameters</h4>
@@ -5753,8 +5761,8 @@ styling (text-decoration, etc)</li>
5753
5761
  <li><strong>File:</strong> _element.scss</li>
5754
5762
  <li><strong>Group:</strong> element</li>
5755
5763
  <li><strong>Type:</strong> mixin</li>
5756
- <li><strong>Lines (comments):</strong> 214-215</li>
5757
- <li><strong>Lines (code):</strong> 217-241</li>
5764
+ <li><strong>Lines (comments):</strong> 216-217</li>
5765
+ <li><strong>Lines (code):</strong> 219-243</li>
5758
5766
  </ul>
5759
5767
  </details>
5760
5768
  <h4 id="parameters-8" tabindex="-1">Parameters</h4>
@@ -5791,8 +5799,8 @@ styling (text-decoration, etc)</li>
5791
5799
  <li><strong>File:</strong> _element.scss</li>
5792
5800
  <li><strong>Group:</strong> element</li>
5793
5801
  <li><strong>Type:</strong> mixin</li>
5794
- <li><strong>Lines (comments):</strong> 243-244</li>
5795
- <li><strong>Lines (code):</strong> 246-266</li>
5802
+ <li><strong>Lines (comments):</strong> 245-246</li>
5803
+ <li><strong>Lines (code):</strong> 248-268</li>
5796
5804
  </ul>
5797
5805
  </details>
5798
5806
  <h4 id="parameters-9" tabindex="-1">Parameters</h4>
@@ -5829,8 +5837,8 @@ styling (text-decoration, etc)</li>
5829
5837
  <li><strong>File:</strong> _element.scss</li>
5830
5838
  <li><strong>Group:</strong> element</li>
5831
5839
  <li><strong>Type:</strong> mixin</li>
5832
- <li><strong>Lines (comments):</strong> 268-273</li>
5833
- <li><strong>Lines (code):</strong> 275-293</li>
5840
+ <li><strong>Lines (comments):</strong> 270-275</li>
5841
+ <li><strong>Lines (code):</strong> 277-295</li>
5834
5842
  </ul>
5835
5843
  </details>
5836
5844
  <h4 id="examples" tabindex="-1">Examples</h4>
@@ -5854,6 +5862,139 @@ styling (text-decoration, etc)</li>
5854
5862
  </tr>
5855
5863
  </tbody>
5856
5864
  </table>
5865
+ <div class="sassdoc-item-header">
5866
+ <h3 id="mixin-cap" tabindex="-1">cap()</h3>
5867
+ <div class="sassdoc-item-header__labels">
5868
+ <span class="tag tag--primary"><strong>Mixin</strong></span>
5869
+ </div>
5870
+ </div>
5871
+ <p>Layout utility to add a colored bar (cap) to an element's edge, positioned over the element and its border</p>
5872
+ <ul>
5873
+ <li>You need to set position (relative, fixed) on parent</li>
5874
+ </ul>
5875
+ <details>
5876
+ <summary>File Information</summary>
5877
+ <ul>
5878
+ <li><strong>File:</strong> _element.scss</li>
5879
+ <li><strong>Group:</strong> element</li>
5880
+ <li><strong>Type:</strong> mixin</li>
5881
+ <li><strong>Lines (comments):</strong> 298-306</li>
5882
+ <li><strong>Lines (code):</strong> 308-331</li>
5883
+ </ul>
5884
+ </details>
5885
+ <h4 id="parameters-11" tabindex="-1">Parameters</h4>
5886
+ <table>
5887
+ <thead>
5888
+ <tr>
5889
+ <th style="text-align:left">Name</th>
5890
+ <th style="text-align:left">Type</th>
5891
+ <th style="text-align:left">Description</th>
5892
+ <th style="text-align:left">Default</th>
5893
+ </tr>
5894
+ </thead>
5895
+ <tbody>
5896
+ <tr>
5897
+ <td style="text-align:left">$side</td>
5898
+ <td style="text-align:left"><code>String</code></td>
5899
+ <td style="text-align:left">The side to place the cap (top, bottom, left, right)</td>
5900
+ <td style="text-align:left"></td>
5901
+ </tr>
5902
+ <tr>
5903
+ <td style="text-align:left">$options</td>
5904
+ <td style="text-align:left"><code>Map</code></td>
5905
+ <td style="text-align:left">Options for the appearance of the cap</td>
5906
+ <td style="text-align:left"></td>
5907
+ </tr>
5908
+ <tr>
5909
+ <td style="text-align:left">$options.color</td>
5910
+ <td style="text-align:left"><code>Color</code></td>
5911
+ <td style="text-align:left">The color for the end cap</td>
5912
+ <td style="text-align:left">$config.cap-color</td>
5913
+ </tr>
5914
+ <tr>
5915
+ <td style="text-align:left">$options.size</td>
5916
+ <td style="text-align:left"><code>Number</code></td>
5917
+ <td style="text-align:left">The width/height of the cap</td>
5918
+ <td style="text-align:left">$config.cap-size</td>
5919
+ </tr>
5920
+ <tr>
5921
+ <td style="text-align:left">$options.offset</td>
5922
+ <td style="text-align:left"><code>Number</code></td>
5923
+ <td style="text-align:left">A positive number of the amount the cap should extend outside the box (to account for border-width)</td>
5924
+ <td style="text-align:left">0</td>
5925
+ </tr>
5926
+ <tr>
5927
+ <td style="text-align:left">$options.border-radius</td>
5928
+ <td style="text-align:left"><code>Number</code></td>
5929
+ <td style="text-align:left">An optional border-radius to apply to the outward-facing edges of the cap (used to match parent)</td>
5930
+ <td style="text-align:left">null</td>
5931
+ </tr>
5932
+ <tr>
5933
+ <td style="text-align:left">$before</td>
5934
+ <td style="text-align:left"><code>Boolean</code></td>
5935
+ <td style="text-align:left">Whether or not to use the ::before element (if not uses :after)</td>
5936
+ <td style="text-align:left">true</td>
5937
+ </tr>
5938
+ </tbody>
5939
+ </table>
5940
+ <h4 id="require-10" tabindex="-1">Require</h4>
5941
+ <ul>
5942
+ <li><a href="/frontend/sass/core/element/#mixin-cap-appearance">cap-appearance()</a></li>
5943
+ <li><a href="/frontend/sass/core/breakpoint/#function-get">get()</a></li>
5944
+ <li><a href="/frontend/sass/core/breakpoint/#variable-config">$config</a></li>
5945
+ </ul>
5946
+ <div class="sassdoc-item-header">
5947
+ <h3 id="mixin-cap-appearance" tabindex="-1">cap-appearance()</h3>
5948
+ <div class="sassdoc-item-header__labels">
5949
+ <span class="tag tag--primary"><strong>Mixin</strong></span>
5950
+ </div>
5951
+ </div>
5952
+ <p>Provides the appearance styles for a given cap</p>
5953
+ <ul>
5954
+ <li>If an option is not provided it won't be output</li>
5955
+ <li>This is used to update the caps styling (states, modifiers, etc)</li>
5956
+ </ul>
5957
+ <details>
5958
+ <summary>File Information</summary>
5959
+ <ul>
5960
+ <li><strong>File:</strong> _element.scss</li>
5961
+ <li><strong>Group:</strong> element</li>
5962
+ <li><strong>Type:</strong> mixin</li>
5963
+ <li><strong>Lines (comments):</strong> 335-340</li>
5964
+ <li><strong>Lines (code):</strong> 342-384</li>
5965
+ </ul>
5966
+ </details>
5967
+ <h4 id="parameters-12" tabindex="-1">Parameters</h4>
5968
+ <table>
5969
+ <thead>
5970
+ <tr>
5971
+ <th style="text-align:left">Name</th>
5972
+ <th style="text-align:left">Type</th>
5973
+ <th style="text-align:left">Description</th>
5974
+ </tr>
5975
+ </thead>
5976
+ <tbody>
5977
+ <tr>
5978
+ <td style="text-align:left">$side</td>
5979
+ <td style="text-align:left"><code>String</code></td>
5980
+ <td style="text-align:left">The side to place the cap (top, bottom, left, right)</td>
5981
+ </tr>
5982
+ <tr>
5983
+ <td style="text-align:left">$options</td>
5984
+ <td style="text-align:left"><code>Map</code></td>
5985
+ <td style="text-align:left">Options for the appearance of the cap (see options from element.cap)</td>
5986
+ </tr>
5987
+ <tr>
5988
+ <td style="text-align:left">$before</td>
5989
+ <td style="text-align:left"><code>Boolean</code></td>
5990
+ <td style="text-align:left">Whether or not to use the ::before element (if not uses :after)</td>
5991
+ </tr>
5992
+ </tbody>
5993
+ </table>
5994
+ <h4 id="require-11" tabindex="-1">Require</h4>
5995
+ <ul>
5996
+ <li><a href="/frontend/sass/core/breakpoint/#function-get">get()</a></li>
5997
+ </ul>
5857
5998
  <h2 id="functions" tabindex="-1">Functions</h2>
5858
5999
  <div class="sassdoc-item-header">
5859
6000
  <h3 id="function-get" tabindex="-1">get()</h3>
@@ -5868,11 +6009,11 @@ styling (text-decoration, etc)</li>
5868
6009
  <li><strong>File:</strong> _element.scss</li>
5869
6010
  <li><strong>Group:</strong> element</li>
5870
6011
  <li><strong>Type:</strong> function</li>
5871
- <li><strong>Lines (comments):</strong> 100-102</li>
5872
- <li><strong>Lines (code):</strong> 104-106</li>
6012
+ <li><strong>Lines (comments):</strong> 102-104</li>
6013
+ <li><strong>Lines (code):</strong> 106-108</li>
5873
6014
  </ul>
5874
6015
  </details>
5875
- <h4 id="parameters-11" tabindex="-1">Parameters</h4>
6016
+ <h4 id="parameters-13" tabindex="-1">Parameters</h4>
5876
6017
  <table>
5877
6018
  <thead>
5878
6019
  <tr>
@@ -5894,7 +6035,7 @@ styling (text-decoration, etc)</li>
5894
6035
  </tr>
5895
6036
  </tbody>
5896
6037
  </table>
5897
- <h4 id="require-10" tabindex="-1">Require</h4>
6038
+ <h4 id="require-12" tabindex="-1">Require</h4>
5898
6039
  <ul>
5899
6040
  <li>require-map-get()</li>
5900
6041
  <li><a href="/frontend/sass/core/breakpoint/#variable-config">$config</a></li>
@@ -5912,11 +6053,11 @@ styling (text-decoration, etc)</li>
5912
6053
  <li><strong>File:</strong> _element.scss</li>
5913
6054
  <li><strong>Group:</strong> element</li>
5914
6055
  <li><strong>Type:</strong> function</li>
5915
- <li><strong>Lines (comments):</strong> 122-123</li>
5916
- <li><strong>Lines (code):</strong> 125-127</li>
6056
+ <li><strong>Lines (comments):</strong> 124-125</li>
6057
+ <li><strong>Lines (code):</strong> 127-129</li>
5917
6058
  </ul>
5918
6059
  </details>
5919
- <h4 id="parameters-12" tabindex="-1">Parameters</h4>
6060
+ <h4 id="parameters-14" tabindex="-1">Parameters</h4>
5920
6061
  <table>
5921
6062
  <thead>
5922
6063
  <tr>
@@ -5933,7 +6074,7 @@ styling (text-decoration, etc)</li>
5933
6074
  </tr>
5934
6075
  </tbody>
5935
6076
  </table>
5936
- <h4 id="require-11" tabindex="-1">Require</h4>
6077
+ <h4 id="require-13" tabindex="-1">Require</h4>
5937
6078
  <ul>
5938
6079
  <li>require-map-get()</li>
5939
6080
  <li><a href="/frontend/sass/core/element/#variable-rule-styles">$rule-styles</a></li>
@@ -5951,11 +6092,11 @@ styling (text-decoration, etc)</li>
5951
6092
  <li><strong>File:</strong> _element.scss</li>
5952
6093
  <li><strong>Group:</strong> element</li>
5953
6094
  <li><strong>Type:</strong> function</li>
5954
- <li><strong>Lines (comments):</strong> 129-130</li>
5955
- <li><strong>Lines (code):</strong> 132-134</li>
6095
+ <li><strong>Lines (comments):</strong> 131-132</li>
6096
+ <li><strong>Lines (code):</strong> 134-136</li>
5956
6097
  </ul>
5957
6098
  </details>
5958
- <h4 id="parameters-13" tabindex="-1">Parameters</h4>
6099
+ <h4 id="parameters-15" tabindex="-1">Parameters</h4>
5959
6100
  <table>
5960
6101
  <thead>
5961
6102
  <tr>
@@ -5972,7 +6113,7 @@ styling (text-decoration, etc)</li>
5972
6113
  </tr>
5973
6114
  </tbody>
5974
6115
  </table>
5975
- <h4 id="require-12" tabindex="-1">Require</h4>
6116
+ <h4 id="require-14" tabindex="-1">Require</h4>
5976
6117
  <ul>
5977
6118
  <li>require-map-get()</li>
5978
6119
  <li><a href="/frontend/sass/core/element/#variable-rule-margins">$rule-margins</a></li>