publishing_platform_publishing_components 0.1.0

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 (259) hide show
  1. checksums.yaml +7 -0
  2. data/LICENSE +22 -0
  3. data/README.md +2 -0
  4. data/Rakefile +41 -0
  5. data/app/assets/builds/gemkeep +0 -0
  6. data/app/assets/config/publishing_platform_publishing_components_manifest.js +2 -0
  7. data/app/assets/images/publishing_platform_publishing_components/gemkeep +0 -0
  8. data/app/assets/stylesheets/publishing_platform_publishing_components/_all_components.scss +3 -0
  9. data/app/assets/stylesheets/publishing_platform_publishing_components/components/_attachment.scss +117 -0
  10. data/app/assets/stylesheets/publishing_platform_publishing_components/components/_summary-list.scss +169 -0
  11. data/app/controllers/publishing_platform_publishing_components/application_controller.rb +4 -0
  12. data/app/helpers/publishing_platform_publishing_components/application_helper.rb +4 -0
  13. data/app/models/publishing_platform_publishing_components/component_doc.rb +90 -0
  14. data/app/models/publishing_platform_publishing_components/component_docs.rb +57 -0
  15. data/app/models/publishing_platform_publishing_components/component_example.rb +104 -0
  16. data/app/models/publishing_platform_publishing_components/shared_accessibility_criteria.rb +37 -0
  17. data/app/views/publishing_platform_publishing_components/component_doc/_component_output.html.erb +15 -0
  18. data/app/views/publishing_platform_publishing_components/components/_attachment.html.erb +91 -0
  19. data/app/views/publishing_platform_publishing_components/components/_error_summary.html.erb +38 -0
  20. data/app/views/publishing_platform_publishing_components/components/_summary_list.html.erb +135 -0
  21. data/app/views/publishing_platform_publishing_components/components/attachment/_thumbnail_document.html.erb +3 -0
  22. data/app/views/publishing_platform_publishing_components/components/attachment/_thumbnail_external.html.erb +3 -0
  23. data/app/views/publishing_platform_publishing_components/components/attachment/_thumbnail_generic.html.erb +4 -0
  24. data/app/views/publishing_platform_publishing_components/components/attachment/_thumbnail_html.html.erb +3 -0
  25. data/app/views/publishing_platform_publishing_components/components/attachment/_thumbnail_pdf.html.erb +3 -0
  26. data/app/views/publishing_platform_publishing_components/components/attachment/_thumbnail_spreadsheet.html.erb +5 -0
  27. data/app/views/publishing_platform_publishing_components/components/docs/attachment.yml +104 -0
  28. data/app/views/publishing_platform_publishing_components/components/docs/error_summary.yml +51 -0
  29. data/app/views/publishing_platform_publishing_components/components/docs/summary_list.yml +137 -0
  30. data/config/initializers/assets.rb +24 -0
  31. data/config/routes.rb +2 -0
  32. data/lib/publishing_platform_publishing_components/config.rb +25 -0
  33. data/lib/publishing_platform_publishing_components/engine.rb +5 -0
  34. data/lib/publishing_platform_publishing_components/presenters/attachment_helper.rb +176 -0
  35. data/lib/publishing_platform_publishing_components/presenters/component_wrapper_helper.rb +290 -0
  36. data/lib/publishing_platform_publishing_components/presenters/shared_helper.rb +24 -0
  37. data/lib/publishing_platform_publishing_components/version.rb +3 -0
  38. data/lib/publishing_platform_publishing_components.rb +10 -0
  39. data/lib/tasks/publishing_platform_publishing_components_tasks.rake +4 -0
  40. data/node_modules/bootstrap/LICENSE +21 -0
  41. data/node_modules/bootstrap/README.md +246 -0
  42. data/node_modules/bootstrap/dist/css/bootstrap-grid.css +4085 -0
  43. data/node_modules/bootstrap/dist/css/bootstrap-grid.css.map +1 -0
  44. data/node_modules/bootstrap/dist/css/bootstrap-grid.min.css +6 -0
  45. data/node_modules/bootstrap/dist/css/bootstrap-grid.min.css.map +1 -0
  46. data/node_modules/bootstrap/dist/css/bootstrap-grid.rtl.css +4084 -0
  47. data/node_modules/bootstrap/dist/css/bootstrap-grid.rtl.css.map +1 -0
  48. data/node_modules/bootstrap/dist/css/bootstrap-grid.rtl.min.css +6 -0
  49. data/node_modules/bootstrap/dist/css/bootstrap-grid.rtl.min.css.map +1 -0
  50. data/node_modules/bootstrap/dist/css/bootstrap-reboot.css +601 -0
  51. data/node_modules/bootstrap/dist/css/bootstrap-reboot.css.map +1 -0
  52. data/node_modules/bootstrap/dist/css/bootstrap-reboot.min.css +6 -0
  53. data/node_modules/bootstrap/dist/css/bootstrap-reboot.min.css.map +1 -0
  54. data/node_modules/bootstrap/dist/css/bootstrap-reboot.rtl.css +598 -0
  55. data/node_modules/bootstrap/dist/css/bootstrap-reboot.rtl.css.map +1 -0
  56. data/node_modules/bootstrap/dist/css/bootstrap-reboot.rtl.min.css +6 -0
  57. data/node_modules/bootstrap/dist/css/bootstrap-reboot.rtl.min.css.map +1 -0
  58. data/node_modules/bootstrap/dist/css/bootstrap-utilities.css +5406 -0
  59. data/node_modules/bootstrap/dist/css/bootstrap-utilities.css.map +1 -0
  60. data/node_modules/bootstrap/dist/css/bootstrap-utilities.min.css +6 -0
  61. data/node_modules/bootstrap/dist/css/bootstrap-utilities.min.css.map +1 -0
  62. data/node_modules/bootstrap/dist/css/bootstrap-utilities.rtl.css +5397 -0
  63. data/node_modules/bootstrap/dist/css/bootstrap-utilities.rtl.css.map +1 -0
  64. data/node_modules/bootstrap/dist/css/bootstrap-utilities.rtl.min.css +6 -0
  65. data/node_modules/bootstrap/dist/css/bootstrap-utilities.rtl.min.css.map +1 -0
  66. data/node_modules/bootstrap/dist/css/bootstrap.css +12048 -0
  67. data/node_modules/bootstrap/dist/css/bootstrap.css.map +1 -0
  68. data/node_modules/bootstrap/dist/css/bootstrap.min.css +6 -0
  69. data/node_modules/bootstrap/dist/css/bootstrap.min.css.map +1 -0
  70. data/node_modules/bootstrap/dist/css/bootstrap.rtl.css +12021 -0
  71. data/node_modules/bootstrap/dist/css/bootstrap.rtl.css.map +1 -0
  72. data/node_modules/bootstrap/dist/css/bootstrap.rtl.min.css +6 -0
  73. data/node_modules/bootstrap/dist/css/bootstrap.rtl.min.css.map +1 -0
  74. data/node_modules/bootstrap/dist/js/bootstrap.bundle.js +6312 -0
  75. data/node_modules/bootstrap/dist/js/bootstrap.bundle.js.map +1 -0
  76. data/node_modules/bootstrap/dist/js/bootstrap.bundle.min.js +7 -0
  77. data/node_modules/bootstrap/dist/js/bootstrap.bundle.min.js.map +1 -0
  78. data/node_modules/bootstrap/dist/js/bootstrap.esm.js +4447 -0
  79. data/node_modules/bootstrap/dist/js/bootstrap.esm.js.map +1 -0
  80. data/node_modules/bootstrap/dist/js/bootstrap.esm.min.js +7 -0
  81. data/node_modules/bootstrap/dist/js/bootstrap.esm.min.js.map +1 -0
  82. data/node_modules/bootstrap/dist/js/bootstrap.js +4494 -0
  83. data/node_modules/bootstrap/dist/js/bootstrap.js.map +1 -0
  84. data/node_modules/bootstrap/dist/js/bootstrap.min.js +7 -0
  85. data/node_modules/bootstrap/dist/js/bootstrap.min.js.map +1 -0
  86. data/node_modules/bootstrap/js/dist/alert.js +90 -0
  87. data/node_modules/bootstrap/js/dist/alert.js.map +1 -0
  88. data/node_modules/bootstrap/js/dist/base-component.js +86 -0
  89. data/node_modules/bootstrap/js/dist/base-component.js.map +1 -0
  90. data/node_modules/bootstrap/js/dist/button.js +79 -0
  91. data/node_modules/bootstrap/js/dist/button.js.map +1 -0
  92. data/node_modules/bootstrap/js/dist/carousel.js +388 -0
  93. data/node_modules/bootstrap/js/dist/carousel.js.map +1 -0
  94. data/node_modules/bootstrap/js/dist/collapse.js +249 -0
  95. data/node_modules/bootstrap/js/dist/collapse.js.map +1 -0
  96. data/node_modules/bootstrap/js/dist/dom/data.js +63 -0
  97. data/node_modules/bootstrap/js/dist/dom/data.js.map +1 -0
  98. data/node_modules/bootstrap/js/dist/dom/event-handler.js +237 -0
  99. data/node_modules/bootstrap/js/dist/dom/event-handler.js.map +1 -0
  100. data/node_modules/bootstrap/js/dist/dom/manipulator.js +72 -0
  101. data/node_modules/bootstrap/js/dist/dom/manipulator.js.map +1 -0
  102. data/node_modules/bootstrap/js/dist/dom/selector-engine.js +104 -0
  103. data/node_modules/bootstrap/js/dist/dom/selector-engine.js.map +1 -0
  104. data/node_modules/bootstrap/js/dist/dropdown.js +402 -0
  105. data/node_modules/bootstrap/js/dist/dropdown.js.map +1 -0
  106. data/node_modules/bootstrap/js/dist/modal.js +320 -0
  107. data/node_modules/bootstrap/js/dist/modal.js.map +1 -0
  108. data/node_modules/bootstrap/js/dist/offcanvas.js +246 -0
  109. data/node_modules/bootstrap/js/dist/offcanvas.js.map +1 -0
  110. data/node_modules/bootstrap/js/dist/popover.js +96 -0
  111. data/node_modules/bootstrap/js/dist/popover.js.map +1 -0
  112. data/node_modules/bootstrap/js/dist/scrollspy.js +275 -0
  113. data/node_modules/bootstrap/js/dist/scrollspy.js.map +1 -0
  114. data/node_modules/bootstrap/js/dist/tab.js +285 -0
  115. data/node_modules/bootstrap/js/dist/tab.js.map +1 -0
  116. data/node_modules/bootstrap/js/dist/toast.js +198 -0
  117. data/node_modules/bootstrap/js/dist/toast.js.map +1 -0
  118. data/node_modules/bootstrap/js/dist/tooltip.js +546 -0
  119. data/node_modules/bootstrap/js/dist/tooltip.js.map +1 -0
  120. data/node_modules/bootstrap/js/dist/util/backdrop.js +139 -0
  121. data/node_modules/bootstrap/js/dist/util/backdrop.js.map +1 -0
  122. data/node_modules/bootstrap/js/dist/util/component-functions.js +42 -0
  123. data/node_modules/bootstrap/js/dist/util/component-functions.js.map +1 -0
  124. data/node_modules/bootstrap/js/dist/util/config.js +68 -0
  125. data/node_modules/bootstrap/js/dist/util/config.js.map +1 -0
  126. data/node_modules/bootstrap/js/dist/util/focustrap.js +113 -0
  127. data/node_modules/bootstrap/js/dist/util/focustrap.js.map +1 -0
  128. data/node_modules/bootstrap/js/dist/util/index.js +281 -0
  129. data/node_modules/bootstrap/js/dist/util/index.js.map +1 -0
  130. data/node_modules/bootstrap/js/dist/util/sanitizer.js +113 -0
  131. data/node_modules/bootstrap/js/dist/util/sanitizer.js.map +1 -0
  132. data/node_modules/bootstrap/js/dist/util/scrollbar.js +113 -0
  133. data/node_modules/bootstrap/js/dist/util/scrollbar.js.map +1 -0
  134. data/node_modules/bootstrap/js/dist/util/swipe.js +135 -0
  135. data/node_modules/bootstrap/js/dist/util/swipe.js.map +1 -0
  136. data/node_modules/bootstrap/js/dist/util/template-factory.js +151 -0
  137. data/node_modules/bootstrap/js/dist/util/template-factory.js.map +1 -0
  138. data/node_modules/bootstrap/js/index.esm.js +19 -0
  139. data/node_modules/bootstrap/js/index.umd.js +34 -0
  140. data/node_modules/bootstrap/js/src/alert.js +87 -0
  141. data/node_modules/bootstrap/js/src/base-component.js +86 -0
  142. data/node_modules/bootstrap/js/src/button.js +72 -0
  143. data/node_modules/bootstrap/js/src/carousel.js +474 -0
  144. data/node_modules/bootstrap/js/src/collapse.js +297 -0
  145. data/node_modules/bootstrap/js/src/dom/data.js +55 -0
  146. data/node_modules/bootstrap/js/src/dom/event-handler.js +317 -0
  147. data/node_modules/bootstrap/js/src/dom/manipulator.js +71 -0
  148. data/node_modules/bootstrap/js/src/dom/selector-engine.js +126 -0
  149. data/node_modules/bootstrap/js/src/dropdown.js +455 -0
  150. data/node_modules/bootstrap/js/src/modal.js +378 -0
  151. data/node_modules/bootstrap/js/src/offcanvas.js +282 -0
  152. data/node_modules/bootstrap/js/src/popover.js +97 -0
  153. data/node_modules/bootstrap/js/src/scrollspy.js +296 -0
  154. data/node_modules/bootstrap/js/src/tab.js +315 -0
  155. data/node_modules/bootstrap/js/src/toast.js +224 -0
  156. data/node_modules/bootstrap/js/src/tooltip.js +633 -0
  157. data/node_modules/bootstrap/js/src/util/backdrop.js +151 -0
  158. data/node_modules/bootstrap/js/src/util/component-functions.js +35 -0
  159. data/node_modules/bootstrap/js/src/util/config.js +65 -0
  160. data/node_modules/bootstrap/js/src/util/focustrap.js +115 -0
  161. data/node_modules/bootstrap/js/src/util/index.js +306 -0
  162. data/node_modules/bootstrap/js/src/util/sanitizer.js +116 -0
  163. data/node_modules/bootstrap/js/src/util/scrollbar.js +114 -0
  164. data/node_modules/bootstrap/js/src/util/swipe.js +146 -0
  165. data/node_modules/bootstrap/js/src/util/template-factory.js +160 -0
  166. data/node_modules/bootstrap/package.json +210 -0
  167. data/node_modules/bootstrap/scss/_accordion.scss +153 -0
  168. data/node_modules/bootstrap/scss/_alert.scss +68 -0
  169. data/node_modules/bootstrap/scss/_badge.scss +38 -0
  170. data/node_modules/bootstrap/scss/_breadcrumb.scss +40 -0
  171. data/node_modules/bootstrap/scss/_button-group.scss +147 -0
  172. data/node_modules/bootstrap/scss/_buttons.scss +216 -0
  173. data/node_modules/bootstrap/scss/_card.scss +238 -0
  174. data/node_modules/bootstrap/scss/_carousel.scss +226 -0
  175. data/node_modules/bootstrap/scss/_close.scss +66 -0
  176. data/node_modules/bootstrap/scss/_containers.scss +41 -0
  177. data/node_modules/bootstrap/scss/_dropdown.scss +250 -0
  178. data/node_modules/bootstrap/scss/_forms.scss +9 -0
  179. data/node_modules/bootstrap/scss/_functions.scss +302 -0
  180. data/node_modules/bootstrap/scss/_grid.scss +39 -0
  181. data/node_modules/bootstrap/scss/_helpers.scss +12 -0
  182. data/node_modules/bootstrap/scss/_images.scss +42 -0
  183. data/node_modules/bootstrap/scss/_list-group.scss +199 -0
  184. data/node_modules/bootstrap/scss/_maps.scss +174 -0
  185. data/node_modules/bootstrap/scss/_mixins.scss +42 -0
  186. data/node_modules/bootstrap/scss/_modal.scss +240 -0
  187. data/node_modules/bootstrap/scss/_nav.scss +197 -0
  188. data/node_modules/bootstrap/scss/_navbar.scss +289 -0
  189. data/node_modules/bootstrap/scss/_offcanvas.scss +147 -0
  190. data/node_modules/bootstrap/scss/_pagination.scss +109 -0
  191. data/node_modules/bootstrap/scss/_placeholders.scss +51 -0
  192. data/node_modules/bootstrap/scss/_popover.scss +196 -0
  193. data/node_modules/bootstrap/scss/_progress.scss +68 -0
  194. data/node_modules/bootstrap/scss/_reboot.scss +617 -0
  195. data/node_modules/bootstrap/scss/_root.scss +187 -0
  196. data/node_modules/bootstrap/scss/_spinners.scss +86 -0
  197. data/node_modules/bootstrap/scss/_tables.scss +171 -0
  198. data/node_modules/bootstrap/scss/_toasts.scss +73 -0
  199. data/node_modules/bootstrap/scss/_tooltip.scss +119 -0
  200. data/node_modules/bootstrap/scss/_transitions.scss +27 -0
  201. data/node_modules/bootstrap/scss/_type.scss +106 -0
  202. data/node_modules/bootstrap/scss/_utilities.scss +806 -0
  203. data/node_modules/bootstrap/scss/_variables-dark.scss +102 -0
  204. data/node_modules/bootstrap/scss/_variables.scss +1753 -0
  205. data/node_modules/bootstrap/scss/bootstrap-grid.scss +62 -0
  206. data/node_modules/bootstrap/scss/bootstrap-reboot.scss +10 -0
  207. data/node_modules/bootstrap/scss/bootstrap-utilities.scss +19 -0
  208. data/node_modules/bootstrap/scss/bootstrap.scss +52 -0
  209. data/node_modules/bootstrap/scss/forms/_floating-labels.scss +97 -0
  210. data/node_modules/bootstrap/scss/forms/_form-check.scss +189 -0
  211. data/node_modules/bootstrap/scss/forms/_form-control.scss +214 -0
  212. data/node_modules/bootstrap/scss/forms/_form-range.scss +91 -0
  213. data/node_modules/bootstrap/scss/forms/_form-select.scss +80 -0
  214. data/node_modules/bootstrap/scss/forms/_form-text.scss +11 -0
  215. data/node_modules/bootstrap/scss/forms/_input-group.scss +132 -0
  216. data/node_modules/bootstrap/scss/forms/_labels.scss +36 -0
  217. data/node_modules/bootstrap/scss/forms/_validation.scss +12 -0
  218. data/node_modules/bootstrap/scss/helpers/_clearfix.scss +3 -0
  219. data/node_modules/bootstrap/scss/helpers/_color-bg.scss +7 -0
  220. data/node_modules/bootstrap/scss/helpers/_colored-links.scss +30 -0
  221. data/node_modules/bootstrap/scss/helpers/_focus-ring.scss +5 -0
  222. data/node_modules/bootstrap/scss/helpers/_icon-link.scss +25 -0
  223. data/node_modules/bootstrap/scss/helpers/_position.scss +36 -0
  224. data/node_modules/bootstrap/scss/helpers/_ratio.scss +26 -0
  225. data/node_modules/bootstrap/scss/helpers/_stacks.scss +15 -0
  226. data/node_modules/bootstrap/scss/helpers/_stretched-link.scss +15 -0
  227. data/node_modules/bootstrap/scss/helpers/_text-truncation.scss +7 -0
  228. data/node_modules/bootstrap/scss/helpers/_visually-hidden.scss +8 -0
  229. data/node_modules/bootstrap/scss/helpers/_vr.scss +8 -0
  230. data/node_modules/bootstrap/scss/mixins/_alert.scss +18 -0
  231. data/node_modules/bootstrap/scss/mixins/_backdrop.scss +14 -0
  232. data/node_modules/bootstrap/scss/mixins/_banner.scss +7 -0
  233. data/node_modules/bootstrap/scss/mixins/_border-radius.scss +78 -0
  234. data/node_modules/bootstrap/scss/mixins/_box-shadow.scss +24 -0
  235. data/node_modules/bootstrap/scss/mixins/_breakpoints.scss +127 -0
  236. data/node_modules/bootstrap/scss/mixins/_buttons.scss +70 -0
  237. data/node_modules/bootstrap/scss/mixins/_caret.scss +69 -0
  238. data/node_modules/bootstrap/scss/mixins/_clearfix.scss +9 -0
  239. data/node_modules/bootstrap/scss/mixins/_color-mode.scss +21 -0
  240. data/node_modules/bootstrap/scss/mixins/_color-scheme.scss +7 -0
  241. data/node_modules/bootstrap/scss/mixins/_container.scss +11 -0
  242. data/node_modules/bootstrap/scss/mixins/_deprecate.scss +10 -0
  243. data/node_modules/bootstrap/scss/mixins/_forms.scss +163 -0
  244. data/node_modules/bootstrap/scss/mixins/_gradients.scss +47 -0
  245. data/node_modules/bootstrap/scss/mixins/_grid.scss +151 -0
  246. data/node_modules/bootstrap/scss/mixins/_image.scss +16 -0
  247. data/node_modules/bootstrap/scss/mixins/_list-group.scss +26 -0
  248. data/node_modules/bootstrap/scss/mixins/_lists.scss +7 -0
  249. data/node_modules/bootstrap/scss/mixins/_pagination.scss +10 -0
  250. data/node_modules/bootstrap/scss/mixins/_reset-text.scss +17 -0
  251. data/node_modules/bootstrap/scss/mixins/_resize.scss +6 -0
  252. data/node_modules/bootstrap/scss/mixins/_table-variants.scss +24 -0
  253. data/node_modules/bootstrap/scss/mixins/_text-truncate.scss +8 -0
  254. data/node_modules/bootstrap/scss/mixins/_transition.scss +26 -0
  255. data/node_modules/bootstrap/scss/mixins/_utilities.scss +97 -0
  256. data/node_modules/bootstrap/scss/mixins/_visually-hidden.scss +38 -0
  257. data/node_modules/bootstrap/scss/utilities/_api.scss +47 -0
  258. data/node_modules/bootstrap/scss/vendor/_rfs.scss +348 -0
  259. metadata +448 -0
@@ -0,0 +1,216 @@
1
+ //
2
+ // Base styles
3
+ //
4
+
5
+ .btn {
6
+ // scss-docs-start btn-css-vars
7
+ --#{$prefix}btn-padding-x: #{$btn-padding-x};
8
+ --#{$prefix}btn-padding-y: #{$btn-padding-y};
9
+ --#{$prefix}btn-font-family: #{$btn-font-family};
10
+ @include rfs($btn-font-size, --#{$prefix}btn-font-size);
11
+ --#{$prefix}btn-font-weight: #{$btn-font-weight};
12
+ --#{$prefix}btn-line-height: #{$btn-line-height};
13
+ --#{$prefix}btn-color: #{$btn-color};
14
+ --#{$prefix}btn-bg: transparent;
15
+ --#{$prefix}btn-border-width: #{$btn-border-width};
16
+ --#{$prefix}btn-border-color: transparent;
17
+ --#{$prefix}btn-border-radius: #{$btn-border-radius};
18
+ --#{$prefix}btn-hover-border-color: transparent;
19
+ --#{$prefix}btn-box-shadow: #{$btn-box-shadow};
20
+ --#{$prefix}btn-disabled-opacity: #{$btn-disabled-opacity};
21
+ --#{$prefix}btn-focus-box-shadow: 0 0 0 #{$btn-focus-width} rgba(var(--#{$prefix}btn-focus-shadow-rgb), .5);
22
+ // scss-docs-end btn-css-vars
23
+
24
+ display: inline-block;
25
+ padding: var(--#{$prefix}btn-padding-y) var(--#{$prefix}btn-padding-x);
26
+ font-family: var(--#{$prefix}btn-font-family);
27
+ @include font-size(var(--#{$prefix}btn-font-size));
28
+ font-weight: var(--#{$prefix}btn-font-weight);
29
+ line-height: var(--#{$prefix}btn-line-height);
30
+ color: var(--#{$prefix}btn-color);
31
+ text-align: center;
32
+ text-decoration: if($link-decoration == none, null, none);
33
+ white-space: $btn-white-space;
34
+ vertical-align: middle;
35
+ cursor: if($enable-button-pointers, pointer, null);
36
+ user-select: none;
37
+ border: var(--#{$prefix}btn-border-width) solid var(--#{$prefix}btn-border-color);
38
+ @include border-radius(var(--#{$prefix}btn-border-radius));
39
+ @include gradient-bg(var(--#{$prefix}btn-bg));
40
+ @include box-shadow(var(--#{$prefix}btn-box-shadow));
41
+ @include transition($btn-transition);
42
+
43
+ &:hover {
44
+ color: var(--#{$prefix}btn-hover-color);
45
+ text-decoration: if($link-hover-decoration == underline, none, null);
46
+ background-color: var(--#{$prefix}btn-hover-bg);
47
+ border-color: var(--#{$prefix}btn-hover-border-color);
48
+ }
49
+
50
+ .btn-check + &:hover {
51
+ // override for the checkbox/radio buttons
52
+ color: var(--#{$prefix}btn-color);
53
+ background-color: var(--#{$prefix}btn-bg);
54
+ border-color: var(--#{$prefix}btn-border-color);
55
+ }
56
+
57
+ &:focus-visible {
58
+ color: var(--#{$prefix}btn-hover-color);
59
+ @include gradient-bg(var(--#{$prefix}btn-hover-bg));
60
+ border-color: var(--#{$prefix}btn-hover-border-color);
61
+ outline: 0;
62
+ // Avoid using mixin so we can pass custom focus shadow properly
63
+ @if $enable-shadows {
64
+ box-shadow: var(--#{$prefix}btn-box-shadow), var(--#{$prefix}btn-focus-box-shadow);
65
+ } @else {
66
+ box-shadow: var(--#{$prefix}btn-focus-box-shadow);
67
+ }
68
+ }
69
+
70
+ .btn-check:focus-visible + & {
71
+ border-color: var(--#{$prefix}btn-hover-border-color);
72
+ outline: 0;
73
+ // Avoid using mixin so we can pass custom focus shadow properly
74
+ @if $enable-shadows {
75
+ box-shadow: var(--#{$prefix}btn-box-shadow), var(--#{$prefix}btn-focus-box-shadow);
76
+ } @else {
77
+ box-shadow: var(--#{$prefix}btn-focus-box-shadow);
78
+ }
79
+ }
80
+
81
+ .btn-check:checked + &,
82
+ :not(.btn-check) + &:active,
83
+ &:first-child:active,
84
+ &.active,
85
+ &.show {
86
+ color: var(--#{$prefix}btn-active-color);
87
+ background-color: var(--#{$prefix}btn-active-bg);
88
+ // Remove CSS gradients if they're enabled
89
+ background-image: if($enable-gradients, none, null);
90
+ border-color: var(--#{$prefix}btn-active-border-color);
91
+ @include box-shadow(var(--#{$prefix}btn-active-shadow));
92
+
93
+ &:focus-visible {
94
+ // Avoid using mixin so we can pass custom focus shadow properly
95
+ @if $enable-shadows {
96
+ box-shadow: var(--#{$prefix}btn-active-shadow), var(--#{$prefix}btn-focus-box-shadow);
97
+ } @else {
98
+ box-shadow: var(--#{$prefix}btn-focus-box-shadow);
99
+ }
100
+ }
101
+ }
102
+
103
+ .btn-check:checked:focus-visible + & {
104
+ // Avoid using mixin so we can pass custom focus shadow properly
105
+ @if $enable-shadows {
106
+ box-shadow: var(--#{$prefix}btn-active-shadow), var(--#{$prefix}btn-focus-box-shadow);
107
+ } @else {
108
+ box-shadow: var(--#{$prefix}btn-focus-box-shadow);
109
+ }
110
+ }
111
+
112
+ &:disabled,
113
+ &.disabled,
114
+ fieldset:disabled & {
115
+ color: var(--#{$prefix}btn-disabled-color);
116
+ pointer-events: none;
117
+ background-color: var(--#{$prefix}btn-disabled-bg);
118
+ background-image: if($enable-gradients, none, null);
119
+ border-color: var(--#{$prefix}btn-disabled-border-color);
120
+ opacity: var(--#{$prefix}btn-disabled-opacity);
121
+ @include box-shadow(none);
122
+ }
123
+ }
124
+
125
+
126
+ //
127
+ // Alternate buttons
128
+ //
129
+
130
+ // scss-docs-start btn-variant-loops
131
+ @each $color, $value in $theme-colors {
132
+ .btn-#{$color} {
133
+ @if $color == "light" {
134
+ @include button-variant(
135
+ $value,
136
+ $value,
137
+ $hover-background: shade-color($value, $btn-hover-bg-shade-amount),
138
+ $hover-border: shade-color($value, $btn-hover-border-shade-amount),
139
+ $active-background: shade-color($value, $btn-active-bg-shade-amount),
140
+ $active-border: shade-color($value, $btn-active-border-shade-amount)
141
+ );
142
+ } @else if $color == "dark" {
143
+ @include button-variant(
144
+ $value,
145
+ $value,
146
+ $hover-background: tint-color($value, $btn-hover-bg-tint-amount),
147
+ $hover-border: tint-color($value, $btn-hover-border-tint-amount),
148
+ $active-background: tint-color($value, $btn-active-bg-tint-amount),
149
+ $active-border: tint-color($value, $btn-active-border-tint-amount)
150
+ );
151
+ } @else {
152
+ @include button-variant($value, $value);
153
+ }
154
+ }
155
+ }
156
+
157
+ @each $color, $value in $theme-colors {
158
+ .btn-outline-#{$color} {
159
+ @include button-outline-variant($value);
160
+ }
161
+ }
162
+ // scss-docs-end btn-variant-loops
163
+
164
+
165
+ //
166
+ // Link buttons
167
+ //
168
+
169
+ // Make a button look and behave like a link
170
+ .btn-link {
171
+ --#{$prefix}btn-font-weight: #{$font-weight-normal};
172
+ --#{$prefix}btn-color: #{$btn-link-color};
173
+ --#{$prefix}btn-bg: transparent;
174
+ --#{$prefix}btn-border-color: transparent;
175
+ --#{$prefix}btn-hover-color: #{$btn-link-hover-color};
176
+ --#{$prefix}btn-hover-border-color: transparent;
177
+ --#{$prefix}btn-active-color: #{$btn-link-hover-color};
178
+ --#{$prefix}btn-active-border-color: transparent;
179
+ --#{$prefix}btn-disabled-color: #{$btn-link-disabled-color};
180
+ --#{$prefix}btn-disabled-border-color: transparent;
181
+ --#{$prefix}btn-box-shadow: 0 0 0 #000; // Can't use `none` as keyword negates all values when used with multiple shadows
182
+ --#{$prefix}btn-focus-shadow-rgb: #{$btn-link-focus-shadow-rgb};
183
+
184
+ text-decoration: $link-decoration;
185
+ @if $enable-gradients {
186
+ background-image: none;
187
+ }
188
+
189
+ &:hover,
190
+ &:focus-visible {
191
+ text-decoration: $link-hover-decoration;
192
+ }
193
+
194
+ &:focus-visible {
195
+ color: var(--#{$prefix}btn-color);
196
+ }
197
+
198
+ &:hover {
199
+ color: var(--#{$prefix}btn-hover-color);
200
+ }
201
+
202
+ // No need for an active state here
203
+ }
204
+
205
+
206
+ //
207
+ // Button Sizes
208
+ //
209
+
210
+ .btn-lg {
211
+ @include button-size($btn-padding-y-lg, $btn-padding-x-lg, $btn-font-size-lg, $btn-border-radius-lg);
212
+ }
213
+
214
+ .btn-sm {
215
+ @include button-size($btn-padding-y-sm, $btn-padding-x-sm, $btn-font-size-sm, $btn-border-radius-sm);
216
+ }
@@ -0,0 +1,238 @@
1
+ //
2
+ // Base styles
3
+ //
4
+
5
+ .card {
6
+ // scss-docs-start card-css-vars
7
+ --#{$prefix}card-spacer-y: #{$card-spacer-y};
8
+ --#{$prefix}card-spacer-x: #{$card-spacer-x};
9
+ --#{$prefix}card-title-spacer-y: #{$card-title-spacer-y};
10
+ --#{$prefix}card-title-color: #{$card-title-color};
11
+ --#{$prefix}card-subtitle-color: #{$card-subtitle-color};
12
+ --#{$prefix}card-border-width: #{$card-border-width};
13
+ --#{$prefix}card-border-color: #{$card-border-color};
14
+ --#{$prefix}card-border-radius: #{$card-border-radius};
15
+ --#{$prefix}card-box-shadow: #{$card-box-shadow};
16
+ --#{$prefix}card-inner-border-radius: #{$card-inner-border-radius};
17
+ --#{$prefix}card-cap-padding-y: #{$card-cap-padding-y};
18
+ --#{$prefix}card-cap-padding-x: #{$card-cap-padding-x};
19
+ --#{$prefix}card-cap-bg: #{$card-cap-bg};
20
+ --#{$prefix}card-cap-color: #{$card-cap-color};
21
+ --#{$prefix}card-height: #{$card-height};
22
+ --#{$prefix}card-color: #{$card-color};
23
+ --#{$prefix}card-bg: #{$card-bg};
24
+ --#{$prefix}card-img-overlay-padding: #{$card-img-overlay-padding};
25
+ --#{$prefix}card-group-margin: #{$card-group-margin};
26
+ // scss-docs-end card-css-vars
27
+
28
+ position: relative;
29
+ display: flex;
30
+ flex-direction: column;
31
+ min-width: 0; // See https://github.com/twbs/bootstrap/pull/22740#issuecomment-305868106
32
+ height: var(--#{$prefix}card-height);
33
+ color: var(--#{$prefix}body-color);
34
+ word-wrap: break-word;
35
+ background-color: var(--#{$prefix}card-bg);
36
+ background-clip: border-box;
37
+ border: var(--#{$prefix}card-border-width) solid var(--#{$prefix}card-border-color);
38
+ @include border-radius(var(--#{$prefix}card-border-radius));
39
+ @include box-shadow(var(--#{$prefix}card-box-shadow));
40
+
41
+ > hr {
42
+ margin-right: 0;
43
+ margin-left: 0;
44
+ }
45
+
46
+ > .list-group {
47
+ border-top: inherit;
48
+ border-bottom: inherit;
49
+
50
+ &:first-child {
51
+ border-top-width: 0;
52
+ @include border-top-radius(var(--#{$prefix}card-inner-border-radius));
53
+ }
54
+
55
+ &:last-child {
56
+ border-bottom-width: 0;
57
+ @include border-bottom-radius(var(--#{$prefix}card-inner-border-radius));
58
+ }
59
+ }
60
+
61
+ // Due to specificity of the above selector (`.card > .list-group`), we must
62
+ // use a child selector here to prevent double borders.
63
+ > .card-header + .list-group,
64
+ > .list-group + .card-footer {
65
+ border-top: 0;
66
+ }
67
+ }
68
+
69
+ .card-body {
70
+ // Enable `flex-grow: 1` for decks and groups so that card blocks take up
71
+ // as much space as possible, ensuring footers are aligned to the bottom.
72
+ flex: 1 1 auto;
73
+ padding: var(--#{$prefix}card-spacer-y) var(--#{$prefix}card-spacer-x);
74
+ color: var(--#{$prefix}card-color);
75
+ }
76
+
77
+ .card-title {
78
+ margin-bottom: var(--#{$prefix}card-title-spacer-y);
79
+ color: var(--#{$prefix}card-title-color);
80
+ }
81
+
82
+ .card-subtitle {
83
+ margin-top: calc(-.5 * var(--#{$prefix}card-title-spacer-y)); // stylelint-disable-line function-disallowed-list
84
+ margin-bottom: 0;
85
+ color: var(--#{$prefix}card-subtitle-color);
86
+ }
87
+
88
+ .card-text:last-child {
89
+ margin-bottom: 0;
90
+ }
91
+
92
+ .card-link {
93
+ &:hover {
94
+ text-decoration: if($link-hover-decoration == underline, none, null);
95
+ }
96
+
97
+ + .card-link {
98
+ margin-left: var(--#{$prefix}card-spacer-x);
99
+ }
100
+ }
101
+
102
+ //
103
+ // Optional textual caps
104
+ //
105
+
106
+ .card-header {
107
+ padding: var(--#{$prefix}card-cap-padding-y) var(--#{$prefix}card-cap-padding-x);
108
+ margin-bottom: 0; // Removes the default margin-bottom of <hN>
109
+ color: var(--#{$prefix}card-cap-color);
110
+ background-color: var(--#{$prefix}card-cap-bg);
111
+ border-bottom: var(--#{$prefix}card-border-width) solid var(--#{$prefix}card-border-color);
112
+
113
+ &:first-child {
114
+ @include border-radius(var(--#{$prefix}card-inner-border-radius) var(--#{$prefix}card-inner-border-radius) 0 0);
115
+ }
116
+ }
117
+
118
+ .card-footer {
119
+ padding: var(--#{$prefix}card-cap-padding-y) var(--#{$prefix}card-cap-padding-x);
120
+ color: var(--#{$prefix}card-cap-color);
121
+ background-color: var(--#{$prefix}card-cap-bg);
122
+ border-top: var(--#{$prefix}card-border-width) solid var(--#{$prefix}card-border-color);
123
+
124
+ &:last-child {
125
+ @include border-radius(0 0 var(--#{$prefix}card-inner-border-radius) var(--#{$prefix}card-inner-border-radius));
126
+ }
127
+ }
128
+
129
+
130
+ //
131
+ // Header navs
132
+ //
133
+
134
+ .card-header-tabs {
135
+ margin-right: calc(-.5 * var(--#{$prefix}card-cap-padding-x)); // stylelint-disable-line function-disallowed-list
136
+ margin-bottom: calc(-1 * var(--#{$prefix}card-cap-padding-y)); // stylelint-disable-line function-disallowed-list
137
+ margin-left: calc(-.5 * var(--#{$prefix}card-cap-padding-x)); // stylelint-disable-line function-disallowed-list
138
+ border-bottom: 0;
139
+
140
+ .nav-link.active {
141
+ background-color: var(--#{$prefix}card-bg);
142
+ border-bottom-color: var(--#{$prefix}card-bg);
143
+ }
144
+ }
145
+
146
+ .card-header-pills {
147
+ margin-right: calc(-.5 * var(--#{$prefix}card-cap-padding-x)); // stylelint-disable-line function-disallowed-list
148
+ margin-left: calc(-.5 * var(--#{$prefix}card-cap-padding-x)); // stylelint-disable-line function-disallowed-list
149
+ }
150
+
151
+ // Card image
152
+ .card-img-overlay {
153
+ position: absolute;
154
+ top: 0;
155
+ right: 0;
156
+ bottom: 0;
157
+ left: 0;
158
+ padding: var(--#{$prefix}card-img-overlay-padding);
159
+ @include border-radius(var(--#{$prefix}card-inner-border-radius));
160
+ }
161
+
162
+ .card-img,
163
+ .card-img-top,
164
+ .card-img-bottom {
165
+ width: 100%; // Required because we use flexbox and this inherently applies align-self: stretch
166
+ }
167
+
168
+ .card-img,
169
+ .card-img-top {
170
+ @include border-top-radius(var(--#{$prefix}card-inner-border-radius));
171
+ }
172
+
173
+ .card-img,
174
+ .card-img-bottom {
175
+ @include border-bottom-radius(var(--#{$prefix}card-inner-border-radius));
176
+ }
177
+
178
+
179
+ //
180
+ // Card groups
181
+ //
182
+
183
+ .card-group {
184
+ // The child selector allows nested `.card` within `.card-group`
185
+ // to display properly.
186
+ > .card {
187
+ margin-bottom: var(--#{$prefix}card-group-margin);
188
+ }
189
+
190
+ @include media-breakpoint-up(sm) {
191
+ display: flex;
192
+ flex-flow: row wrap;
193
+ // The child selector allows nested `.card` within `.card-group`
194
+ // to display properly.
195
+ > .card {
196
+ flex: 1 0 0;
197
+ margin-bottom: 0;
198
+
199
+ + .card {
200
+ margin-left: 0;
201
+ border-left: 0;
202
+ }
203
+
204
+ // Handle rounded corners
205
+ @if $enable-rounded {
206
+ &:not(:last-child) {
207
+ @include border-end-radius(0);
208
+
209
+ > .card-img-top,
210
+ > .card-header {
211
+ // stylelint-disable-next-line property-disallowed-list
212
+ border-top-right-radius: 0;
213
+ }
214
+ > .card-img-bottom,
215
+ > .card-footer {
216
+ // stylelint-disable-next-line property-disallowed-list
217
+ border-bottom-right-radius: 0;
218
+ }
219
+ }
220
+
221
+ &:not(:first-child) {
222
+ @include border-start-radius(0);
223
+
224
+ > .card-img-top,
225
+ > .card-header {
226
+ // stylelint-disable-next-line property-disallowed-list
227
+ border-top-left-radius: 0;
228
+ }
229
+ > .card-img-bottom,
230
+ > .card-footer {
231
+ // stylelint-disable-next-line property-disallowed-list
232
+ border-bottom-left-radius: 0;
233
+ }
234
+ }
235
+ }
236
+ }
237
+ }
238
+ }
@@ -0,0 +1,226 @@
1
+ // Notes on the classes:
2
+ //
3
+ // 1. .carousel.pointer-event should ideally be pan-y (to allow for users to scroll vertically)
4
+ // even when their scroll action started on a carousel, but for compatibility (with Firefox)
5
+ // we're preventing all actions instead
6
+ // 2. The .carousel-item-start and .carousel-item-end is used to indicate where
7
+ // the active slide is heading.
8
+ // 3. .active.carousel-item is the current slide.
9
+ // 4. .active.carousel-item-start and .active.carousel-item-end is the current
10
+ // slide in its in-transition state. Only one of these occurs at a time.
11
+ // 5. .carousel-item-next.carousel-item-start and .carousel-item-prev.carousel-item-end
12
+ // is the upcoming slide in transition.
13
+
14
+ .carousel {
15
+ position: relative;
16
+ }
17
+
18
+ .carousel.pointer-event {
19
+ touch-action: pan-y;
20
+ }
21
+
22
+ .carousel-inner {
23
+ position: relative;
24
+ width: 100%;
25
+ overflow: hidden;
26
+ @include clearfix();
27
+ }
28
+
29
+ .carousel-item {
30
+ position: relative;
31
+ display: none;
32
+ float: left;
33
+ width: 100%;
34
+ margin-right: -100%;
35
+ backface-visibility: hidden;
36
+ @include transition($carousel-transition);
37
+ }
38
+
39
+ .carousel-item.active,
40
+ .carousel-item-next,
41
+ .carousel-item-prev {
42
+ display: block;
43
+ }
44
+
45
+ .carousel-item-next:not(.carousel-item-start),
46
+ .active.carousel-item-end {
47
+ transform: translateX(100%);
48
+ }
49
+
50
+ .carousel-item-prev:not(.carousel-item-end),
51
+ .active.carousel-item-start {
52
+ transform: translateX(-100%);
53
+ }
54
+
55
+
56
+ //
57
+ // Alternate transitions
58
+ //
59
+
60
+ .carousel-fade {
61
+ .carousel-item {
62
+ opacity: 0;
63
+ transition-property: opacity;
64
+ transform: none;
65
+ }
66
+
67
+ .carousel-item.active,
68
+ .carousel-item-next.carousel-item-start,
69
+ .carousel-item-prev.carousel-item-end {
70
+ z-index: 1;
71
+ opacity: 1;
72
+ }
73
+
74
+ .active.carousel-item-start,
75
+ .active.carousel-item-end {
76
+ z-index: 0;
77
+ opacity: 0;
78
+ @include transition(opacity 0s $carousel-transition-duration);
79
+ }
80
+ }
81
+
82
+
83
+ //
84
+ // Left/right controls for nav
85
+ //
86
+
87
+ .carousel-control-prev,
88
+ .carousel-control-next {
89
+ position: absolute;
90
+ top: 0;
91
+ bottom: 0;
92
+ z-index: 1;
93
+ // Use flex for alignment (1-3)
94
+ display: flex; // 1. allow flex styles
95
+ align-items: center; // 2. vertically center contents
96
+ justify-content: center; // 3. horizontally center contents
97
+ width: $carousel-control-width;
98
+ padding: 0;
99
+ color: $carousel-control-color;
100
+ text-align: center;
101
+ background: none;
102
+ filter: var(--#{$prefix}carousel-control-icon-filter);
103
+ border: 0;
104
+ opacity: $carousel-control-opacity;
105
+ @include transition($carousel-control-transition);
106
+
107
+ // Hover/focus state
108
+ &:hover,
109
+ &:focus {
110
+ color: $carousel-control-color;
111
+ text-decoration: none;
112
+ outline: 0;
113
+ opacity: $carousel-control-hover-opacity;
114
+ }
115
+ }
116
+ .carousel-control-prev {
117
+ left: 0;
118
+ background-image: if($enable-gradients, linear-gradient(90deg, rgba($black, .25), rgba($black, .001)), null);
119
+ }
120
+ .carousel-control-next {
121
+ right: 0;
122
+ background-image: if($enable-gradients, linear-gradient(270deg, rgba($black, .25), rgba($black, .001)), null);
123
+ }
124
+
125
+ // Icons for within
126
+ .carousel-control-prev-icon,
127
+ .carousel-control-next-icon {
128
+ display: inline-block;
129
+ width: $carousel-control-icon-width;
130
+ height: $carousel-control-icon-width;
131
+ background-repeat: no-repeat;
132
+ background-position: 50%;
133
+ background-size: 100% 100%;
134
+ }
135
+
136
+ .carousel-control-prev-icon {
137
+ background-image: escape-svg($carousel-control-prev-icon-bg) #{"/*rtl:" + escape-svg($carousel-control-next-icon-bg) + "*/"};
138
+ }
139
+ .carousel-control-next-icon {
140
+ background-image: escape-svg($carousel-control-next-icon-bg) #{"/*rtl:" + escape-svg($carousel-control-prev-icon-bg) + "*/"};
141
+ }
142
+
143
+ // Optional indicator pips/controls
144
+ //
145
+ // Add a container (such as a list) with the following class and add an item (ideally a focusable control,
146
+ // like a button) with data-bs-target for each slide your carousel holds.
147
+
148
+ .carousel-indicators {
149
+ position: absolute;
150
+ right: 0;
151
+ bottom: 0;
152
+ left: 0;
153
+ z-index: 2;
154
+ display: flex;
155
+ justify-content: center;
156
+ padding: 0;
157
+ // Use the .carousel-control's width as margin so we don't overlay those
158
+ margin-right: $carousel-control-width;
159
+ margin-bottom: 1rem;
160
+ margin-left: $carousel-control-width;
161
+
162
+ [data-bs-target] {
163
+ box-sizing: content-box;
164
+ flex: 0 1 auto;
165
+ width: $carousel-indicator-width;
166
+ height: $carousel-indicator-height;
167
+ padding: 0;
168
+ margin-right: $carousel-indicator-spacer;
169
+ margin-left: $carousel-indicator-spacer;
170
+ text-indent: -999px;
171
+ cursor: pointer;
172
+ background-color: var(--#{$prefix}carousel-indicator-active-bg);
173
+ background-clip: padding-box;
174
+ border: 0;
175
+ // Use transparent borders to increase the hit area by 10px on top and bottom.
176
+ border-top: $carousel-indicator-hit-area-height solid transparent;
177
+ border-bottom: $carousel-indicator-hit-area-height solid transparent;
178
+ opacity: $carousel-indicator-opacity;
179
+ @include transition($carousel-indicator-transition);
180
+ }
181
+
182
+ .active {
183
+ opacity: $carousel-indicator-active-opacity;
184
+ }
185
+ }
186
+
187
+
188
+ // Optional captions
189
+ //
190
+ //
191
+
192
+ .carousel-caption {
193
+ position: absolute;
194
+ right: (100% - $carousel-caption-width) * .5;
195
+ bottom: $carousel-caption-spacer;
196
+ left: (100% - $carousel-caption-width) * .5;
197
+ padding-top: $carousel-caption-padding-y;
198
+ padding-bottom: $carousel-caption-padding-y;
199
+ color: var(--#{$prefix}carousel-caption-color);
200
+ text-align: center;
201
+ }
202
+
203
+ // Dark mode carousel
204
+
205
+ @mixin carousel-dark() {
206
+ --#{$prefix}carousel-indicator-active-bg: #{$carousel-indicator-active-bg-dark};
207
+ --#{$prefix}carousel-caption-color: #{$carousel-caption-color-dark};
208
+ --#{$prefix}carousel-control-icon-filter: #{$carousel-control-icon-filter-dark};
209
+ }
210
+
211
+ .carousel-dark {
212
+ @include carousel-dark();
213
+ }
214
+
215
+ :root,
216
+ [data-bs-theme="light"] {
217
+ --#{$prefix}carousel-indicator-active-bg: #{$carousel-indicator-active-bg};
218
+ --#{$prefix}carousel-caption-color: #{$carousel-caption-color};
219
+ --#{$prefix}carousel-control-icon-filter: #{$carousel-control-icon-filter};
220
+ }
221
+
222
+ @if $enable-dark-mode {
223
+ @include color-mode(dark, true) {
224
+ @include carousel-dark();
225
+ }
226
+ }