@ulu/frontend 0.1.0-beta.19 → 0.1.0-beta.20

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 (169) hide show
  1. package/CHANGELOG.md +22 -0
  2. package/dist/ulu-frontend.min.css +1 -1
  3. package/dist/ulu-frontend.min.js +12 -12
  4. package/docs-dev/changelog/index.html +196 -2
  5. package/docs-dev/demos/accordion/index.html +129 -2
  6. package/docs-dev/demos/basic-hero/index.html +111 -0
  7. package/docs-dev/demos/button/index.html +129 -2
  8. package/docs-dev/demos/callout/index.html +129 -2
  9. package/docs-dev/demos/captioned-figure/index.html +129 -2
  10. package/docs-dev/demos/card/index.html +129 -2
  11. package/docs-dev/demos/css-icons/index.html +129 -2
  12. package/docs-dev/demos/data-grid/index.html +129 -2
  13. package/docs-dev/demos/data-table/index.html +154 -27
  14. package/docs-dev/demos/details-group/index.html +129 -2
  15. package/docs-dev/demos/file-save/index.html +129 -2
  16. package/docs-dev/demos/flipcard/index.html +129 -2
  17. package/docs-dev/demos/form-theme/index.html +129 -2
  18. package/docs-dev/demos/hero/index.html +12 -4
  19. package/docs-dev/demos/image-grid/index.html +12 -4
  20. package/docs-dev/demos/index.html +129 -2
  21. package/docs-dev/demos/list-inline/index.html +129 -2
  22. package/docs-dev/demos/list-lines/index.html +129 -2
  23. package/docs-dev/demos/menu-stack/index.html +129 -2
  24. package/docs-dev/demos/modals/index.html +129 -2
  25. package/docs-dev/demos/nav-strip/index.html +129 -2
  26. package/docs-dev/demos/overlay-section/index.html +129 -2
  27. package/docs-dev/demos/popovers/index.html +129 -2
  28. package/docs-dev/demos/print/index.html +129 -2
  29. package/docs-dev/demos/pull-quote/index.html +129 -2
  30. package/docs-dev/demos/rule/index.html +129 -2
  31. package/docs-dev/demos/scroll-slider/index.html +12 -4
  32. package/docs-dev/demos/scrollpoints/index.html +129 -2
  33. package/docs-dev/demos/slider/index.html +12 -4
  34. package/docs-dev/demos/spoke-spinner/index.html +129 -2
  35. package/docs-dev/demos/tabs/index.html +129 -2
  36. package/docs-dev/demos/tag/index.html +129 -2
  37. package/docs-dev/demos/theme-toggle/index.html +5039 -0
  38. package/docs-dev/demos/tile-grid-overlay/index.html +12 -4
  39. package/docs-dev/demos/tiles/index.html +129 -2
  40. package/docs-dev/demos/tooltip/index.html +129 -2
  41. package/docs-dev/guide/building-stylesheet/index.html +129 -2
  42. package/docs-dev/guide/developing-ulu-scss-module/index.html +129 -2
  43. package/docs-dev/guide/index.html +129 -2
  44. package/docs-dev/index.html +129 -2
  45. package/docs-dev/javascript/events/index.html +129 -2
  46. package/docs-dev/javascript/index.html +129 -2
  47. package/docs-dev/javascript/settings/index.html +129 -2
  48. package/docs-dev/javascript/ui-breakpoints/index.html +129 -2
  49. package/docs-dev/javascript/ui-collapsible/index.html +129 -2
  50. package/docs-dev/javascript/ui-details-group/index.html +129 -2
  51. package/docs-dev/javascript/ui-dialog/index.html +129 -2
  52. package/docs-dev/javascript/ui-flipcard/index.html +129 -2
  53. package/docs-dev/javascript/ui-grid/index.html +129 -2
  54. package/docs-dev/javascript/ui-modal-builder/index.html +129 -2
  55. package/docs-dev/javascript/ui-overflow-scroller/index.html +129 -2
  56. package/docs-dev/javascript/ui-overflow-scroller-pager/index.html +129 -2
  57. package/docs-dev/javascript/ui-page/index.html +129 -2
  58. package/docs-dev/javascript/ui-popover/index.html +129 -2
  59. package/docs-dev/javascript/ui-print/index.html +129 -2
  60. package/docs-dev/javascript/ui-print-details/index.html +129 -2
  61. package/docs-dev/javascript/ui-programmatic-modal/index.html +129 -2
  62. package/docs-dev/javascript/ui-proxy-click/index.html +129 -2
  63. package/docs-dev/javascript/ui-resizer/index.html +129 -2
  64. package/docs-dev/javascript/ui-scroll-slider/index.html +129 -2
  65. package/docs-dev/javascript/ui-scrollpoint/index.html +129 -2
  66. package/docs-dev/javascript/ui-slider/index.html +129 -2
  67. package/docs-dev/javascript/ui-tabs/index.html +129 -2
  68. package/docs-dev/javascript/ui-theme-toggle/index.html +5178 -0
  69. package/docs-dev/javascript/ui-tooltip/index.html +129 -2
  70. package/docs-dev/javascript/utils-class-logger/index.html +129 -2
  71. package/docs-dev/javascript/utils-dom/index.html +193 -6
  72. package/docs-dev/javascript/utils-file-save/index.html +129 -2
  73. package/docs-dev/javascript/utils-floating-ui/index.html +129 -2
  74. package/docs-dev/javascript/utils-id/index.html +129 -2
  75. package/docs-dev/javascript/utils-pause-youtube-video/index.html +129 -2
  76. package/docs-dev/sass/base/color/index.html +129 -2
  77. package/docs-dev/sass/base/elements/index.html +129 -2
  78. package/docs-dev/sass/base/index/index.html +129 -2
  79. package/docs-dev/sass/base/index.html +129 -2
  80. package/docs-dev/sass/base/keyframes/index.html +129 -2
  81. package/docs-dev/sass/base/layout/index.html +129 -2
  82. package/docs-dev/sass/base/normalize/index.html +129 -2
  83. package/docs-dev/sass/base/print/index.html +129 -2
  84. package/docs-dev/sass/base/root/index.html +129 -2
  85. package/docs-dev/sass/base/typography/index.html +129 -2
  86. package/docs-dev/sass/components/accordion/index.html +129 -2
  87. package/docs-dev/sass/components/adaptive-spacing/index.html +129 -2
  88. package/docs-dev/sass/components/badge/index.html +129 -2
  89. package/docs-dev/sass/components/basic-hero/index.html +5145 -0
  90. package/docs-dev/sass/components/button/index.html +129 -2
  91. package/docs-dev/sass/components/button-verbose/index.html +129 -2
  92. package/docs-dev/sass/components/callout/index.html +129 -2
  93. package/docs-dev/sass/components/captioned-figure/index.html +129 -2
  94. package/docs-dev/sass/components/card/index.html +129 -2
  95. package/docs-dev/sass/components/card-grid/index.html +129 -2
  96. package/docs-dev/sass/components/css-icon/index.html +129 -2
  97. package/docs-dev/sass/components/data-grid/index.html +129 -2
  98. package/docs-dev/sass/components/data-table/index.html +129 -2
  99. package/docs-dev/sass/components/fill-context/index.html +129 -2
  100. package/docs-dev/sass/components/flipcard/index.html +129 -2
  101. package/docs-dev/sass/components/flipcard-grid/index.html +129 -2
  102. package/docs-dev/sass/components/form-theme/index.html +133 -6
  103. package/docs-dev/sass/components/hero/index.html +129 -2
  104. package/docs-dev/sass/components/horizontal-rule/index.html +129 -2
  105. package/docs-dev/sass/components/image-grid/index.html +129 -2
  106. package/docs-dev/sass/components/index/index.html +140 -12
  107. package/docs-dev/sass/components/index.html +129 -2
  108. package/docs-dev/sass/components/links/index.html +129 -2
  109. package/docs-dev/sass/components/list-inline/index.html +129 -2
  110. package/docs-dev/sass/components/list-lines/index.html +129 -2
  111. package/docs-dev/sass/components/list-ordered/index.html +129 -2
  112. package/docs-dev/sass/components/list-unordered/index.html +129 -2
  113. package/docs-dev/sass/components/menu-stack/index.html +129 -2
  114. package/docs-dev/sass/components/modal/index.html +129 -2
  115. package/docs-dev/sass/components/nav-strip/index.html +129 -2
  116. package/docs-dev/sass/components/overlay-section/index.html +129 -2
  117. package/docs-dev/sass/components/pager/index.html +129 -2
  118. package/docs-dev/sass/components/placeholder-block/index.html +129 -2
  119. package/docs-dev/sass/components/popover/index.html +129 -2
  120. package/docs-dev/sass/components/pull-quote/index.html +129 -2
  121. package/docs-dev/sass/components/ratio-box/index.html +129 -2
  122. package/docs-dev/sass/components/rule/index.html +129 -2
  123. package/docs-dev/sass/components/scroll-slider/index.html +129 -2
  124. package/docs-dev/sass/components/skip-link/index.html +129 -2
  125. package/docs-dev/sass/components/slider/index.html +129 -2
  126. package/docs-dev/sass/components/spoke-spinner/index.html +129 -2
  127. package/docs-dev/sass/components/tabs/index.html +129 -2
  128. package/docs-dev/sass/components/tag/index.html +129 -2
  129. package/docs-dev/sass/components/tile-button/index.html +129 -2
  130. package/docs-dev/sass/components/tile-grid/index.html +129 -2
  131. package/docs-dev/sass/components/tile-grid-overlay/index.html +129 -2
  132. package/docs-dev/sass/components/vignette/index.html +129 -2
  133. package/docs-dev/sass/components/wysiwyg/index.html +129 -2
  134. package/docs-dev/sass/core/breakpoint/index.html +129 -2
  135. package/docs-dev/sass/core/button/index.html +129 -2
  136. package/docs-dev/sass/core/color/index.html +129 -2
  137. package/docs-dev/sass/core/cssvar/index.html +129 -2
  138. package/docs-dev/sass/core/element/index.html +129 -2
  139. package/docs-dev/sass/core/index.html +129 -2
  140. package/docs-dev/sass/core/layout/index.html +129 -2
  141. package/docs-dev/sass/core/path/index.html +129 -2
  142. package/docs-dev/sass/core/selector/index.html +129 -2
  143. package/docs-dev/sass/core/typography/index.html +129 -2
  144. package/docs-dev/sass/core/units/index.html +129 -2
  145. package/docs-dev/sass/core/utils/index.html +129 -2
  146. package/docs-dev/sass/helpers/color/index.html +129 -2
  147. package/docs-dev/sass/helpers/display/index.html +129 -2
  148. package/docs-dev/sass/helpers/index/index.html +129 -2
  149. package/docs-dev/sass/helpers/index.html +129 -2
  150. package/docs-dev/sass/helpers/print/index.html +129 -2
  151. package/docs-dev/sass/helpers/typography/index.html +129 -2
  152. package/docs-dev/sass/helpers/units/index.html +129 -2
  153. package/docs-dev/sass/helpers/utilities/index.html +129 -2
  154. package/docs-dev/sass/index.html +129 -2
  155. package/js/ui/details-group.js +1 -1
  156. package/js/ui/theme-toggle.js +330 -89
  157. package/js/utils/dom.js +43 -1
  158. package/package.json +3 -2
  159. package/scss/components/_basic-hero.scss +112 -0
  160. package/scss/components/_form-theme.scss +2 -2
  161. package/scss/components/_index.scss +6 -0
  162. package/types/ui/details-group.d.ts +43 -0
  163. package/types/ui/details-group.d.ts.map +1 -0
  164. package/types/ui/index.d.ts +1 -0
  165. package/types/ui/programmatic-modal.d.ts.map +1 -1
  166. package/types/ui/theme-toggle.d.ts +58 -7
  167. package/types/ui/theme-toggle.d.ts.map +1 -1
  168. package/types/utils/dom.d.ts +19 -1
  169. package/types/utils/dom.d.ts.map +1 -1
package/docs-dev/changelog/index.html CHANGED
@@ -31,7 +31,7 @@
31
31
 
32
32
 
33
33
  </head>
34
- <body class="page theme-light" data-site-theme="">
34
+ <body class="page theme-light">
35
35
 
36
36
 
37
37
 
@@ -53,7 +53,14 @@
53
53
  <nav class="header__nav">
54
54
  <h2 class="hidden-visually">Main Menu</h2>
55
55
  <div class="header__nav-links">
56
- <button class="button button--small button--icon button--icon-small" data-site-theme-toggle=""><span class="fas fa-moon" data-site-theme-toggle-icon=""></span></button>
56
+ <button class="button button--small button--icon button--icon-small" data-ulu-theme-toggle='{
57
+ "savePreference" : true,
58
+ "checkMediaQuery" : true,
59
+ "group" : "page"
60
+ }'>
61
+ <span class="hidden-visually">Toggle Theme to <span data-ulu-theme-toggle-label="">Dark</span></span>
62
+ <span class="fas fa-moon" data-ulu-theme-toggle-icon=""></span>
63
+ </button>
57
64
  <a class="button button--small button--icon button--icon-small" href="https://www.npmjs.com/package/@ulu/frontend" aria-label="View on Github">
58
65
  <span class="fab fa-github" aria-hidden="true"></span>
59
66
  </a>
@@ -159,6 +166,21 @@
159
166
  </li>
160
167
 
161
168
 
169
+ <li class="nav-tree__item ">
170
+
171
+ <a class="nav-tree__link " href="/frontend/demos/basic-hero/">
172
+
173
+
174
+ <span class="nav-tree__text">
175
+ Basic Hero
176
+ </span>
177
+
178
+ </a>
179
+
180
+
181
+ </li>
182
+
183
+
162
184
  <li class="nav-tree__item ">
163
185
 
164
186
  <a class="nav-tree__link " href="/frontend/demos/button/">
@@ -594,6 +616,21 @@
594
616
  </li>
595
617
 
596
618
 
619
+ <li class="nav-tree__item ">
620
+
621
+ <a class="nav-tree__link " href="/frontend/demos/theme-toggle/">
622
+
623
+
624
+ <span class="nav-tree__text">
625
+ Theme Toggle
626
+ </span>
627
+
628
+ </a>
629
+
630
+
631
+ </li>
632
+
633
+
597
634
  <li class="nav-tree__item ">
598
635
 
599
636
  <a class="nav-tree__link " href="/frontend/demos/tile-grid-overlay/">
@@ -1133,6 +1170,21 @@
1133
1170
  </li>
1134
1171
 
1135
1172
 
1173
+ <li class="nav-tree__item ">
1174
+
1175
+ <a class="nav-tree__link " href="/frontend/sass/components/basic-hero/">
1176
+
1177
+
1178
+ <span class="nav-tree__text">
1179
+ Basic-hero
1180
+ </span>
1181
+
1182
+ </a>
1183
+
1184
+
1185
+ </li>
1186
+
1187
+
1136
1188
  <li class="nav-tree__item ">
1137
1189
 
1138
1190
  <a class="nav-tree__link " href="/frontend/sass/components/button/">
@@ -2296,6 +2348,21 @@
2296
2348
  </li>
2297
2349
 
2298
2350
 
2351
+ <li class="nav-tree__item ">
2352
+
2353
+ <a class="nav-tree__link " href="/frontend/javascript/ui-theme-toggle/">
2354
+
2355
+
2356
+ <span class="nav-tree__text">
2357
+ ui/theme-toggle
2358
+ </span>
2359
+
2360
+ </a>
2361
+
2362
+
2363
+ </li>
2364
+
2365
+
2299
2366
  <li class="nav-tree__item ">
2300
2367
 
2301
2368
  <a class="nav-tree__link " href="/frontend/javascript/ui-tooltip/">
@@ -2525,6 +2592,21 @@
2525
2592
  </li>
2526
2593
 
2527
2594
 
2595
+ <li class="nav-tree__item ">
2596
+
2597
+ <a class="nav-tree__link " href="/frontend/demos/basic-hero/">
2598
+
2599
+
2600
+ <span class="nav-tree__text">
2601
+ Basic Hero
2602
+ </span>
2603
+
2604
+ </a>
2605
+
2606
+
2607
+ </li>
2608
+
2609
+
2528
2610
  <li class="nav-tree__item ">
2529
2611
 
2530
2612
  <a class="nav-tree__link " href="/frontend/demos/button/">
@@ -2960,6 +3042,21 @@
2960
3042
  </li>
2961
3043
 
2962
3044
 
3045
+ <li class="nav-tree__item ">
3046
+
3047
+ <a class="nav-tree__link " href="/frontend/demos/theme-toggle/">
3048
+
3049
+
3050
+ <span class="nav-tree__text">
3051
+ Theme Toggle
3052
+ </span>
3053
+
3054
+ </a>
3055
+
3056
+
3057
+ </li>
3058
+
3059
+
2963
3060
  <li class="nav-tree__item ">
2964
3061
 
2965
3062
  <a class="nav-tree__link " href="/frontend/demos/tile-grid-overlay/">
@@ -3499,6 +3596,21 @@
3499
3596
  </li>
3500
3597
 
3501
3598
 
3599
+ <li class="nav-tree__item ">
3600
+
3601
+ <a class="nav-tree__link " href="/frontend/sass/components/basic-hero/">
3602
+
3603
+
3604
+ <span class="nav-tree__text">
3605
+ Basic-hero
3606
+ </span>
3607
+
3608
+ </a>
3609
+
3610
+
3611
+ </li>
3612
+
3613
+
3502
3614
  <li class="nav-tree__item ">
3503
3615
 
3504
3616
  <a class="nav-tree__link " href="/frontend/sass/components/button/">
@@ -4662,6 +4774,21 @@
4662
4774
  </li>
4663
4775
 
4664
4776
 
4777
+ <li class="nav-tree__item ">
4778
+
4779
+ <a class="nav-tree__link " href="/frontend/javascript/ui-theme-toggle/">
4780
+
4781
+
4782
+ <span class="nav-tree__text">
4783
+ ui/theme-toggle
4784
+ </span>
4785
+
4786
+ </a>
4787
+
4788
+
4789
+ </li>
4790
+
4791
+
4665
4792
  <li class="nav-tree__item ">
4666
4793
 
4667
4794
  <a class="nav-tree__link " href="/frontend/javascript/ui-tooltip/">
@@ -4799,6 +4926,15 @@
4799
4926
  <div class="toc">
4800
4927
  <ol>
4801
4928
 
4929
+ <li><a href="#version-0.1.0-beta.21-(unpublished)">Version 0.1.0-beta.21 (unpublished)</a>
4930
+ </li>
4931
+
4932
+ <li><a href="#version-0.1.0-beta.20-(unpublished)">Version 0.1.0-beta.20 (unpublished)</a>
4933
+ </li>
4934
+
4935
+ <li><a href="#version-0.1.0-beta.19">Version 0.1.0-beta.19</a>
4936
+ </li>
4937
+
4802
4938
  <li><a href="#version-0.1.0-beta.18">Version 0.1.0-beta.18</a>
4803
4939
  </li>
4804
4940
 
@@ -4910,6 +5046,64 @@
4910
5046
 
4911
5047
  <div class="changelog">
4912
5048
  <h1 id="change-log" tabindex="-1">Change Log</h1>
5049
+ <h2 id="version-0.1.0-beta.21-(unpublished)" tabindex="-1">Version 0.1.0-beta.21 (unpublished)</h2>
5050
+ <ul>
5051
+ <li>scss/components/basic-hero <strong>new</strong>
5052
+ <ul>
5053
+ <li>Simple hero or header styling</li>
5054
+ </ul>
5055
+ </li>
5056
+ <li>js/ui/theme-toggle.js
5057
+ <ul>
5058
+ <li>inverted the default icons so that the icon reflects the theme it will trigger</li>
5059
+ </ul>
5060
+ </li>
5061
+ </ul>
5062
+ <h2 id="version-0.1.0-beta.20-(unpublished)" tabindex="-1">Version 0.1.0-beta.20 (unpublished)</h2>
5063
+ <ul>
5064
+ <li>js/ui/theme-toggle.js (refactored to allow)
5065
+ <ul>
5066
+ <li>Multiple instances of theme toggles</li>
5067
+ <li>Remote theme toggles (other toggles buttons that follow/match main toggle)
5068
+ <ul>
5069
+ <li>If the toggle button is used in more than one place in UI</li>
5070
+ <li>Toggle and remote linked via 'group' option</li>
5071
+ </ul>
5072
+ </li>
5073
+ <li>Allow targeting multiple containers to toggle theme on</li>
5074
+ <li>New options/API structure
5075
+ <ul>
5076
+ <li>Now accepts themes object with settings on what it should toggle</li>
5077
+ </ul>
5078
+ </li>
5079
+ <li>Allow callback for customizing behavior when changing state</li>
5080
+ <li>Add demo/tests</li>
5081
+ </ul>
5082
+ </li>
5083
+ <li>js/utils/dom.js
5084
+ <ul>
5085
+ <li>Add getElements() (matches getElement) but for multiple elements</li>
5086
+ <li>Add resolveClasses() to allow class options to be string or array form
5087
+ <ul>
5088
+ <li>So that scripts using can easily resolve classes to consistent type for use in element.classList, etc</li>
5089
+ </ul>
5090
+ </li>
5091
+ </ul>
5092
+ </li>
5093
+ <li>js/ui/details-group.js
5094
+ <ul>
5095
+ <li>Fix error in event pageModified (caused by passing event object to setup)</li>
5096
+ </ul>
5097
+ </li>
5098
+ </ul>
5099
+ <h2 id="version-0.1.0-beta.19" tabindex="-1">Version 0.1.0-beta.19</h2>
5100
+ <ul>
5101
+ <li>js/ui/details-group.js
5102
+ <ul>
5103
+ <li>Added new module to manage groups of details (just one open at time right now)</li>
5104
+ </ul>
5105
+ </li>
5106
+ </ul>
4913
5107
  <h2 id="version-0.1.0-beta.18" tabindex="-1">Version 0.1.0-beta.18</h2>
4914
5108
  <ul>
4915
5109
  <li>scss/components/_button-verbose.scss
package/docs-dev/demos/accordion/index.html CHANGED
@@ -31,7 +31,7 @@
31
31
 
32
32
 
33
33
  </head>
34
- <body class="page theme-light" data-site-theme="">
34
+ <body class="page theme-light">
35
35
 
36
36
 
37
37
 
@@ -53,7 +53,14 @@
53
53
  <nav class="header__nav">
54
54
  <h2 class="hidden-visually">Main Menu</h2>
55
55
  <div class="header__nav-links">
56
- <button class="button button--small button--icon button--icon-small" data-site-theme-toggle=""><span class="fas fa-moon" data-site-theme-toggle-icon=""></span></button>
56
+ <button class="button button--small button--icon button--icon-small" data-ulu-theme-toggle='{
57
+ "savePreference" : true,
58
+ "checkMediaQuery" : true,
59
+ "group" : "page"
60
+ }'>
61
+ <span class="hidden-visually">Toggle Theme to <span data-ulu-theme-toggle-label="">Dark</span></span>
62
+ <span class="fas fa-moon" data-ulu-theme-toggle-icon=""></span>
63
+ </button>
57
64
  <a class="button button--small button--icon button--icon-small" href="https://www.npmjs.com/package/@ulu/frontend" aria-label="View on Github">
58
65
  <span class="fab fa-github" aria-hidden="true"></span>
59
66
  </a>
@@ -159,6 +166,21 @@
159
166
  </li>
160
167
 
161
168
 
169
+ <li class="nav-tree__item ">
170
+
171
+ <a class="nav-tree__link " href="/frontend/demos/basic-hero/">
172
+
173
+
174
+ <span class="nav-tree__text">
175
+ Basic Hero
176
+ </span>
177
+
178
+ </a>
179
+
180
+
181
+ </li>
182
+
183
+
162
184
  <li class="nav-tree__item ">
163
185
 
164
186
  <a class="nav-tree__link " href="/frontend/demos/button/">
@@ -594,6 +616,21 @@
594
616
  </li>
595
617
 
596
618
 
619
+ <li class="nav-tree__item ">
620
+
621
+ <a class="nav-tree__link " href="/frontend/demos/theme-toggle/">
622
+
623
+
624
+ <span class="nav-tree__text">
625
+ Theme Toggle
626
+ </span>
627
+
628
+ </a>
629
+
630
+
631
+ </li>
632
+
633
+
597
634
  <li class="nav-tree__item ">
598
635
 
599
636
  <a class="nav-tree__link " href="/frontend/demos/tile-grid-overlay/">
@@ -1133,6 +1170,21 @@
1133
1170
  </li>
1134
1171
 
1135
1172
 
1173
+ <li class="nav-tree__item ">
1174
+
1175
+ <a class="nav-tree__link " href="/frontend/sass/components/basic-hero/">
1176
+
1177
+
1178
+ <span class="nav-tree__text">
1179
+ Basic-hero
1180
+ </span>
1181
+
1182
+ </a>
1183
+
1184
+
1185
+ </li>
1186
+
1187
+
1136
1188
  <li class="nav-tree__item ">
1137
1189
 
1138
1190
  <a class="nav-tree__link " href="/frontend/sass/components/button/">
@@ -2296,6 +2348,21 @@
2296
2348
  </li>
2297
2349
 
2298
2350
 
2351
+ <li class="nav-tree__item ">
2352
+
2353
+ <a class="nav-tree__link " href="/frontend/javascript/ui-theme-toggle/">
2354
+
2355
+
2356
+ <span class="nav-tree__text">
2357
+ ui/theme-toggle
2358
+ </span>
2359
+
2360
+ </a>
2361
+
2362
+
2363
+ </li>
2364
+
2365
+
2299
2366
  <li class="nav-tree__item ">
2300
2367
 
2301
2368
  <a class="nav-tree__link " href="/frontend/javascript/ui-tooltip/">
@@ -2525,6 +2592,21 @@
2525
2592
  </li>
2526
2593
 
2527
2594
 
2595
+ <li class="nav-tree__item ">
2596
+
2597
+ <a class="nav-tree__link " href="/frontend/demos/basic-hero/">
2598
+
2599
+
2600
+ <span class="nav-tree__text">
2601
+ Basic Hero
2602
+ </span>
2603
+
2604
+ </a>
2605
+
2606
+
2607
+ </li>
2608
+
2609
+
2528
2610
  <li class="nav-tree__item ">
2529
2611
 
2530
2612
  <a class="nav-tree__link " href="/frontend/demos/button/">
@@ -2960,6 +3042,21 @@
2960
3042
  </li>
2961
3043
 
2962
3044
 
3045
+ <li class="nav-tree__item ">
3046
+
3047
+ <a class="nav-tree__link " href="/frontend/demos/theme-toggle/">
3048
+
3049
+
3050
+ <span class="nav-tree__text">
3051
+ Theme Toggle
3052
+ </span>
3053
+
3054
+ </a>
3055
+
3056
+
3057
+ </li>
3058
+
3059
+
2963
3060
  <li class="nav-tree__item ">
2964
3061
 
2965
3062
  <a class="nav-tree__link " href="/frontend/demos/tile-grid-overlay/">
@@ -3499,6 +3596,21 @@
3499
3596
  </li>
3500
3597
 
3501
3598
 
3599
+ <li class="nav-tree__item ">
3600
+
3601
+ <a class="nav-tree__link " href="/frontend/sass/components/basic-hero/">
3602
+
3603
+
3604
+ <span class="nav-tree__text">
3605
+ Basic-hero
3606
+ </span>
3607
+
3608
+ </a>
3609
+
3610
+
3611
+ </li>
3612
+
3613
+
3502
3614
  <li class="nav-tree__item ">
3503
3615
 
3504
3616
  <a class="nav-tree__link " href="/frontend/sass/components/button/">
@@ -4662,6 +4774,21 @@
4662
4774
  </li>
4663
4775
 
4664
4776
 
4777
+ <li class="nav-tree__item ">
4778
+
4779
+ <a class="nav-tree__link " href="/frontend/javascript/ui-theme-toggle/">
4780
+
4781
+
4782
+ <span class="nav-tree__text">
4783
+ ui/theme-toggle
4784
+ </span>
4785
+
4786
+ </a>
4787
+
4788
+
4789
+ </li>
4790
+
4791
+
4665
4792
  <li class="nav-tree__item ">
4666
4793
 
4667
4794
  <a class="nav-tree__link " href="/frontend/javascript/ui-tooltip/">
package/docs-dev/demos/basic-hero/index.html ADDED
@@ -0,0 +1,111 @@
1
+ <!doctype html>
2
+ <html lang="en" class="fullscreen-layout">
3
+ <head>
4
+ <meta charset="utf-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>
7
+ Basic Hero
8
+ </title>
9
+ <meta name="description" content="Modular Sass Theming Library">
10
+ <meta name="generator" content="Eleventy v3.0.0">
11
+
12
+ <link rel="apple-touch-icon" sizes="180x180" href="/frontend/assets/favicons/apple-touch-icon.png">
13
+ <link rel="icon" type="image/png" sizes="32x32" href="/frontend/assets/favicons/favicon-32x32.png">
14
+ <link rel="icon" type="image/png" sizes="16x16" href="/frontend/assets/favicons/favicon-16x16.png">
15
+ <link rel="manifest" href="/frontend/assets/favicons/site.webmanifest">
16
+ <link rel="mask-icon" href="/frontend/assets/favicons/safari-pinned-tab.svg" color="#8455bd">
17
+ <link rel="shortcut icon" href="/frontend/assets/favicons/favicon.ico">
18
+ <meta name="msapplication-TileColor" content="#603cba">
19
+ <meta name="msapplication-config" content="/assets/favicons/browserconfig.xml">
20
+ <meta name="theme-color" content="#ffffff">
21
+
22
+
23
+
24
+ <link rel="stylesheet" href="/frontend/assets/fonts/inter/inter.css">
25
+
26
+
27
+
28
+
29
+
30
+
31
+
32
+
33
+ </head>
34
+ <body class="page theme-light">
35
+ <header class="page__header header">
36
+ <div class="header__main">
37
+ <a class="header__logo" href="/frontend/">
38
+ <div class="logo">
39
+ <span class="logo__main">Ulu</span>
40
+ <span class="logo__subtitle">Frontend</span>
41
+ </div>
42
+ </a>
43
+ <button class="button button--small button--icon button--secondary margin-left-auto" data-ulu-theme-toggle='{
44
+ "savePreference" : true,
45
+ "checkMediaQuery" : true,
46
+ "group" : "page"
47
+ }'>
48
+ <span class="hidden-visually">Toggle Theme to <span data-ulu-theme-toggle-label="">Dark</span></span>
49
+ <span class="fas fa-moon" data-ulu-theme-toggle-icon=""></span>
50
+ </button>
51
+ <a class="button button--small button--icon button--secondary" href="../" aria-label="Exit">
52
+ <span class="css-icon css-icon--close" aria-hidden="true"></span>
53
+ </a>
54
+ </div>
55
+ </header>
56
+ <main id="main" class="page__body">
57
+
58
+ <div class="page__content-header">
59
+ <div class="container">
60
+ <div class="type-max-width">
61
+ <h1 class="page__title h1">Basic Hero</h1>
62
+
63
+ </div>
64
+ </div>
65
+ </div>
66
+ <div class="fullscreen-demo-header container padding-top padding-bottom">
67
+ <h2 class="h2 no-margin">Testing Normal Layout</h2>
68
+ </div>
69
+ <div class="theme-light">
70
+ <div class="basic-hero">
71
+ <div class="basic-hero__content container">
72
+ <div class="basic-hero__content-main">
73
+ <h1 class="h1">
74
+ This is the Title it is Multiple Lines Long When On Small Screens
75
+ </h1>
76
+ </div>
77
+ <div class="basic-hero__content-media">
78
+ <img src="/frontend/assets/placeholder/image-1.jpg">
79
+ </div>
80
+ </div>
81
+ </div>
82
+ </div>
83
+ <div class="fullscreen-demo-header container padding-top padding-bottom">
84
+ <h2 class="h2 no-margin">Testing Center Layout</h2>
85
+ </div>
86
+ <div class="theme-light">
87
+ <div class="basic-hero basic-hero--center">
88
+ <div class="basic-hero__content container">
89
+ <div class="basic-hero__content-main">
90
+ <h1 class="h1">
91
+ This is the Title it is Multiple Lines Long When On Small Screens
92
+ </h1>
93
+ </div>
94
+ <div class="basic-hero__content-media">
95
+ <img src="/frontend/assets/placeholder/image-1.jpg">
96
+ </div>
97
+ </div>
98
+ </div>
99
+ </div>
100
+
101
+ </main>
102
+ <footer></footer>
103
+
104
+
105
+ <script src="http://localhost:5173/@vite/client" type="module"></script>
106
+ <script src="http://localhost:5173/docs-src/src/main.js" type="module"></script>
107
+
108
+
109
+
110
+ </body>
111
+ </html>