@milestone-sys/web-design-system 3.6.2 → 3.6.3

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 (1102) hide show
  1. package/LICENSE +21 -21
  2. package/README.md +7 -7
  3. package/assets.html +13 -0
  4. package/colors.list.js +65 -65
  5. package/components/detail/accordion-checkbox-large.html +1051 -0
  6. package/components/detail/accordion-checkbox-medium-dark.html +1051 -0
  7. package/components/detail/accordion-checkbox-medium-disabled.html +1051 -0
  8. package/components/detail/accordion-checkbox-medium-filtered-list-items.html +1055 -0
  9. package/components/detail/accordion-checkbox-medium-icon-left-floating-dark-yellow.html +1077 -0
  10. package/components/detail/accordion-checkbox-medium-icon-left-floating.html +1077 -0
  11. package/components/detail/accordion-checkbox-medium-icon-left.html +1065 -0
  12. package/components/detail/accordion-checkbox-medium.html +1060 -0
  13. package/components/detail/accordion-checkbox-overview.html +1051 -0
  14. package/components/detail/accordion-input.html +949 -0
  15. package/components/detail/accordion-label.html +949 -0
  16. package/components/detail/accordion-modifier-icon-floating.html +949 -0
  17. package/components/detail/accordion-modifier-icon-left.html +949 -0
  18. package/components/detail/accordion-radio.html +1053 -0
  19. package/components/detail/alert-dark-theme-default.html +1009 -0
  20. package/components/detail/alert-dark-theme-solution.html +1009 -0
  21. package/components/detail/alert-default-extra-attention.html +1007 -0
  22. package/components/detail/alert-default-generic.html +1006 -0
  23. package/components/detail/alert-default-solution-with-badge-and-ready-state.html +1018 -0
  24. package/components/detail/alert-default-solution.html +1010 -0
  25. package/components/detail/alert-default-without-image.html +1004 -0
  26. package/components/detail/alert-default.html +1006 -0
  27. package/components/detail/alert-hidden-after-refresh-checkbox.html +1016 -0
  28. package/components/detail/alert-hidden-after-refresh.html +1005 -0
  29. package/components/detail/alert-layouts.html +1560 -0
  30. package/components/detail/alert-visible-after-refresh.html +1005 -0
  31. package/components/detail/background-colors.html +1287 -0
  32. package/components/detail/basic-card-default-dark.html +1014 -0
  33. package/components/detail/basic-card-default-without-caption-with-header-icon.html +1005 -0
  34. package/components/detail/basic-card-default-without-caption-with-header-image.html +1001 -0
  35. package/components/detail/basic-card-default-without-caption.html +997 -0
  36. package/components/detail/basic-card-default.html +1014 -0
  37. package/components/detail/basic-card-grouping-center.html +1014 -0
  38. package/components/detail/basic-card-grouping-left-with-flat-icon.html +1024 -0
  39. package/components/detail/basic-card-grouping-left.html +1014 -0
  40. package/components/detail/basic-card-grouping.html +1122 -0
  41. package/components/detail/basic-card-layouts.html +1886 -0
  42. package/components/detail/button-danger-dark-icon.html +999 -0
  43. package/components/detail/button-danger-dark.html +975 -0
  44. package/components/detail/button-danger-default.html +975 -0
  45. package/components/detail/button-danger-icon.html +999 -0
  46. package/components/detail/button-disabled-dark-icon.html +999 -0
  47. package/components/detail/button-disabled-dark.html +975 -0
  48. package/components/detail/button-floating-aligned-column.html +1005 -0
  49. package/components/detail/button-floating-aligned-right.html +1005 -0
  50. package/components/detail/button-floating-dark-aligned-column.html +1005 -0
  51. package/components/detail/button-floating-dark-aligned-right.html +1005 -0
  52. package/components/detail/button-floating-dark-default.html +1005 -0
  53. package/components/detail/button-floating-dark-disabled.html +1005 -0
  54. package/components/detail/button-floating-dark-secondary-aligned-column.html +1005 -0
  55. package/components/detail/button-floating-dark-secondary-aligned-right.html +1005 -0
  56. package/components/detail/button-floating-dark-secondary.html +1005 -0
  57. package/components/detail/button-floating-default.html +1005 -0
  58. package/components/detail/button-floating-disabled.html +1005 -0
  59. package/components/detail/button-floating-overview.html +969 -0
  60. package/components/detail/button-floating-positioning.html +1007 -0
  61. package/components/detail/button-floating-secondary-aligned-column.html +1005 -0
  62. package/components/detail/button-floating-secondary-aligned-right.html +1005 -0
  63. package/components/detail/button-floating-secondary.html +1005 -0
  64. package/components/detail/button-floating-states.html +987 -0
  65. package/components/detail/button-gray-default.html +975 -0
  66. package/components/detail/button-gray-icon.html +999 -0
  67. package/components/detail/button-group-center-alignment.html +965 -0
  68. package/components/detail/button-group-left-alignment.html +965 -0
  69. package/components/detail/button-group-right-alignment.html +965 -0
  70. package/components/detail/button-overview-direction.html +983 -0
  71. package/components/detail/button-overview-global-definition.html +975 -0
  72. package/components/detail/button-overview-sizes.html +987 -0
  73. package/components/detail/button-overview-states.html +1019 -0
  74. package/components/detail/button-primary-dark-icon.html +999 -0
  75. package/components/detail/button-primary-dark.html +975 -0
  76. package/components/detail/button-primary-default.html +975 -0
  77. package/components/detail/button-primary-icon.html +999 -0
  78. package/components/detail/button-secondary-dark-icon.html +999 -0
  79. package/components/detail/button-secondary-dark.html +975 -0
  80. package/components/detail/button-secondary-default.html +975 -0
  81. package/components/detail/button-secondary-icon.html +999 -0
  82. package/components/detail/button-tertiary-default.html +975 -0
  83. package/components/detail/button-tertiary-icon.html +999 -0
  84. package/components/detail/buttons-overview.html +2069 -0
  85. package/components/detail/category-dark.html +1022 -0
  86. package/components/detail/category-disabled-dark.html +1014 -0
  87. package/components/detail/category-disabled.html +1014 -0
  88. package/components/detail/category-full-row.html +1178 -0
  89. package/components/detail/category-overview-dark-states.html +1058 -0
  90. package/components/detail/category-overview-dark.html +1022 -0
  91. package/components/detail/category-overview-sizes.html +1030 -0
  92. package/components/detail/category-overview-states.html +1058 -0
  93. package/components/detail/category-small-dark.html +1022 -0
  94. package/components/detail/category-small-disabled-dark.html +1014 -0
  95. package/components/detail/category-small-disabled.html +1014 -0
  96. package/components/detail/category-small-full-row.html +1250 -0
  97. package/components/detail/category-small.html +1022 -0
  98. package/components/detail/category.html +1022 -0
  99. package/components/detail/checkbox-checked.html +968 -0
  100. package/components/detail/checkbox-disabled.html +968 -0
  101. package/components/detail/checkbox-focus.html +968 -0
  102. package/components/detail/checkbox-global-definition.html +968 -0
  103. package/components/detail/checkbox-hover.html +968 -0
  104. package/components/detail/checkbox-inline.html +974 -0
  105. package/components/detail/checkbox-readonly.html +969 -0
  106. package/components/detail/colors-and-shadows.html +1403 -0
  107. package/components/detail/contact-cards.html +2151 -0
  108. package/components/detail/contact-content.html +1017 -0
  109. package/components/detail/contact-overview.html +1147 -0
  110. package/components/detail/contact-sizes.html +1108 -0
  111. package/components/detail/contact-small.html +1038 -0
  112. package/components/detail/contact-without-image-small.html +1028 -0
  113. package/components/detail/contact-without-image.html +1028 -0
  114. package/components/detail/contact.html +1038 -0
  115. package/components/detail/divider-dark-blue.html +949 -0
  116. package/components/detail/divider-default.html +949 -0
  117. package/components/detail/divider-gray-5.html +949 -0
  118. package/components/detail/divider-white-50.html +949 -0
  119. package/components/detail/divider-white.html +949 -0
  120. package/components/detail/divider-yellow.html +949 -0
  121. package/components/detail/generic-card-aspect-16by9.html +1001 -0
  122. package/components/detail/generic-card-aspect-2by1-small.html +1116 -0
  123. package/components/detail/generic-card-aspect-2by1.html +1110 -0
  124. package/components/detail/generic-card-aspect.html +1050 -0
  125. package/components/detail/generic-card-default-small-dark-theme.html +1000 -0
  126. package/components/detail/generic-card-default-small-svg.html +1000 -0
  127. package/components/detail/generic-card-default-small.html +999 -0
  128. package/components/detail/generic-card-default-svg-dark.html +999 -0
  129. package/components/detail/generic-card-default-svg.html +998 -0
  130. package/components/detail/generic-card-default.html +999 -0
  131. package/components/detail/generic-card-media-dark-theme.html +1031 -0
  132. package/components/detail/generic-card-media-floating-icon.html +1042 -0
  133. package/components/detail/generic-card-media-small.html +1027 -0
  134. package/components/detail/generic-card-media.html +1027 -0
  135. package/components/detail/generic-card-overview.html +1062 -0
  136. package/components/detail/generic-flat-icons.html +951 -0
  137. package/components/detail/generic-rich-icons.html +951 -0
  138. package/components/detail/global-colors-alternative.html +1301 -0
  139. package/components/detail/global-colors-gradients.html +1305 -0
  140. package/components/detail/global-colors-gray-white-black.html +1304 -0
  141. package/components/detail/global-colors-primary.html +1295 -0
  142. package/components/detail/global-colors-shadows.html +1295 -0
  143. package/components/detail/global-colors-transparency.html +1306 -0
  144. package/components/detail/global-margins.html +995 -0
  145. package/components/detail/global-paddings.html +951 -0
  146. package/components/detail/gradient-background-colors.html +1517 -0
  147. package/components/detail/input-disabled.html +1003 -0
  148. package/components/detail/input-field.html +1226 -0
  149. package/components/detail/input-focus.html +1003 -0
  150. package/components/detail/input-hover.html +1003 -0
  151. package/components/detail/input-readonly.html +1003 -0
  152. package/components/detail/input-sizes.html +1007 -0
  153. package/components/detail/input-state-error.html +1003 -0
  154. package/components/detail/input-state-success.html +1003 -0
  155. package/components/detail/input.html +981 -0
  156. package/components/detail/large-section-spacing-definitions.html +1011 -0
  157. package/components/detail/large-section-spacing.html +977 -0
  158. package/components/detail/links.html +977 -0
  159. package/components/detail/lists.html +973 -0
  160. package/components/detail/marketplace-flat-icons.html +951 -0
  161. package/components/detail/marketplace-rich-icons.html +951 -0
  162. package/components/detail/matching-content-height-card.html +1599 -0
  163. package/components/detail/medium-section-spacing-definitions.html +1011 -0
  164. package/components/detail/medium-section-spacing.html +977 -0
  165. package/components/detail/modal-on-click.html +1017 -0
  166. package/components/detail/modal-on-load-demo.html +1012 -0
  167. package/components/detail/modal-on-load.html +1012 -0
  168. package/components/detail/msds-text-alt-blue-1.html +1287 -0
  169. package/components/detail/msds-text-alt-blue-2.html +1287 -0
  170. package/components/detail/msds-text-alt-blue-3.html +1287 -0
  171. package/components/detail/msds-text-alt-yellow-1.html +1287 -0
  172. package/components/detail/msds-text-alt-yellow-2.html +1287 -0
  173. package/components/detail/msds-text-black.html +1287 -0
  174. package/components/detail/msds-text-clear-blue.html +1287 -0
  175. package/components/detail/msds-text-confirm-green.html +1287 -0
  176. package/components/detail/msds-text-danger-red-1.html +1287 -0
  177. package/components/detail/msds-text-danger-red-2.html +1287 -0
  178. package/components/detail/msds-text-dark-blue.html +1287 -0
  179. package/components/detail/msds-text-gray-1.html +1287 -0
  180. package/components/detail/msds-text-gray-10.html +1287 -0
  181. package/components/detail/msds-text-gray-2.html +1287 -0
  182. package/components/detail/msds-text-gray-3.html +1287 -0
  183. package/components/detail/msds-text-gray-4.html +1287 -0
  184. package/components/detail/msds-text-gray-5.html +1287 -0
  185. package/components/detail/msds-text-gray-6.html +1287 -0
  186. package/components/detail/msds-text-gray-7.html +1287 -0
  187. package/components/detail/msds-text-gray-8.html +1287 -0
  188. package/components/detail/msds-text-gray-9.html +1287 -0
  189. package/components/detail/msds-text-sand.html +1287 -0
  190. package/components/detail/msds-text-white.html +1287 -0
  191. package/components/detail/msds-text-yellow.html +1287 -0
  192. package/components/detail/popover-bottom.html +1018 -0
  193. package/components/detail/popover-global-definition.html +1018 -0
  194. package/components/detail/popover-left.html +1018 -0
  195. package/components/detail/popover-top.html +1018 -0
  196. package/components/detail/preview-dark.html +1014 -0
  197. package/components/detail/preview.html +1001 -0
  198. package/components/detail/progress-bar-dark-theme.html +997 -0
  199. package/components/detail/progress-bar-features.html +1023 -0
  200. package/components/detail/progress-bar-global-definition.html +973 -0
  201. package/components/detail/progress-bar-light-theme.html +997 -0
  202. package/components/detail/progress-bar-sizes.html +999 -0
  203. package/components/detail/radio-button-disabled.html +963 -0
  204. package/components/detail/radio-button-focus.html +963 -0
  205. package/components/detail/radio-button-global-definition.html +975 -0
  206. package/components/detail/radio-button-hover.html +963 -0
  207. package/components/detail/radio-button-readonly.html +964 -0
  208. package/components/detail/radio-button-selected.html +963 -0
  209. package/components/detail/section-checkbox-dark.html +1019 -0
  210. package/components/detail/section-checkbox-nested-accordion.html +1124 -0
  211. package/components/detail/section-checkbox.html +1083 -0
  212. package/components/detail/section-radio-dark.html +1083 -0
  213. package/components/detail/section-radio-nested-accordion.html +1135 -0
  214. package/components/detail/section-radio.html +1081 -0
  215. package/components/detail/select-input-default.html +973 -0
  216. package/components/detail/select-input-error.html +971 -0
  217. package/components/detail/select-input-global-definition.html +983 -0
  218. package/components/detail/select-input-not-required.html +973 -0
  219. package/components/detail/select-input-required.html +973 -0
  220. package/components/detail/select-input-small.html +969 -0
  221. package/components/detail/small-section-spacing-definitions.html +1017 -0
  222. package/components/detail/small-section-spacing.html +977 -0
  223. package/components/detail/solid-background-colors.html +1457 -0
  224. package/components/detail/solution-card-default-layout.html +1210 -0
  225. package/components/detail/solution-card-default.html +1040 -0
  226. package/components/detail/solution-card-layouts.html +2085 -0
  227. package/components/detail/solution-card-optional-certification-badges.html +1054 -0
  228. package/components/detail/solution-card-optional-solution-badges.html +1054 -0
  229. package/components/detail/solution-card-sizes.html +1125 -0
  230. package/components/detail/solution-card-small.html +1040 -0
  231. package/components/detail/switch-checked.html +973 -0
  232. package/components/detail/switch-default.html +973 -0
  233. package/components/detail/switch-disabled-readonly.html +973 -0
  234. package/components/detail/switch-disabled.html +973 -0
  235. package/components/detail/switch-global.html +983 -0
  236. package/components/detail/tab-tile.html +2409 -0
  237. package/components/detail/table-dark-theme-default-expandable-rows.html +1204 -0
  238. package/components/detail/table-dark-theme-default.html +1228 -0
  239. package/components/detail/table-default-dark.html +1179 -0
  240. package/components/detail/table-default-expandable-rows.html +1203 -0
  241. package/components/detail/table-default-medium.html +1179 -0
  242. package/components/detail/table-default-small.html +1179 -0
  243. package/components/detail/table-default.html +1227 -0
  244. package/components/detail/text-area-disabled.html +1011 -0
  245. package/components/detail/text-area-error.html +1011 -0
  246. package/components/detail/text-area-field.html +985 -0
  247. package/components/detail/text-area-focus.html +1011 -0
  248. package/components/detail/text-area-hover.html +1011 -0
  249. package/components/detail/text-area-readonly.html +1011 -0
  250. package/components/detail/text-area-sizes.html +1011 -0
  251. package/components/detail/text-area-success.html +1011 -0
  252. package/components/detail/text-area.html +1167 -0
  253. package/components/detail/text-colors.html +1287 -0
  254. package/components/detail/text.html +1037 -0
  255. package/components/detail/typography-body-texts.html +993 -0
  256. package/components/detail/typography-displays.html +959 -0
  257. package/components/detail/typography-headers.html +965 -0
  258. package/components/detail/typography-leads.html +951 -0
  259. package/components/detail/typography-links-dark-theme.html +1159 -0
  260. package/components/detail/typography-links-light-theme.html +1123 -0
  261. package/components/detail/typography-links-secondary.html +1011 -0
  262. package/components/detail/typography-unordered-lists.html +973 -0
  263. package/components/preview/accordion-checkbox-large.html +81 -0
  264. package/components/preview/accordion-checkbox-medium-dark.html +81 -0
  265. package/components/preview/accordion-checkbox-medium-disabled.html +82 -0
  266. package/components/preview/accordion-checkbox-medium-filtered-list-items.html +84 -0
  267. package/components/preview/accordion-checkbox-medium-icon-left-floating-dark-yellow.html +95 -0
  268. package/components/preview/accordion-checkbox-medium-icon-left-floating.html +95 -0
  269. package/components/preview/accordion-checkbox-medium-icon-left.html +90 -0
  270. package/components/preview/accordion-checkbox-medium.html +81 -0
  271. package/components/preview/accordion-checkbox-overview.html +83 -0
  272. package/components/preview/accordion-input.html +30 -0
  273. package/components/preview/accordion-label.html +30 -0
  274. package/components/preview/accordion-modifier-icon-floating.html +30 -0
  275. package/components/preview/accordion-modifier-icon-left.html +31 -0
  276. package/components/preview/accordion-radio.html +83 -0
  277. package/components/preview/alert-dark-theme-default.html +59 -0
  278. package/components/preview/alert-dark-theme-solution.html +59 -0
  279. package/components/preview/alert-default-extra-attention.html +58 -0
  280. package/components/preview/alert-default-generic.html +58 -0
  281. package/components/preview/alert-default-solution-with-badge-and-ready-state.html +64 -0
  282. package/components/preview/alert-default-solution.html +60 -0
  283. package/components/preview/alert-default-without-image.html +57 -0
  284. package/components/preview/alert-default.html +58 -0
  285. package/components/preview/alert-hidden-after-refresh-checkbox.html +63 -0
  286. package/components/preview/alert-hidden-after-refresh.html +57 -0
  287. package/components/preview/alert-layouts.html +341 -0
  288. package/components/preview/alert-visible-after-refresh.html +57 -0
  289. package/components/preview/background-colors.html +50 -0
  290. package/components/preview/basic-card-default-dark.html +55 -0
  291. package/components/preview/basic-card-default-without-caption-with-header-icon.html +50 -0
  292. package/components/preview/basic-card-default-without-caption-with-header-image.html +48 -0
  293. package/components/preview/basic-card-default-without-caption.html +46 -0
  294. package/components/preview/basic-card-default.html +55 -0
  295. package/components/preview/basic-card-grouping-center.html +55 -0
  296. package/components/preview/basic-card-grouping-left-with-flat-icon.html +60 -0
  297. package/components/preview/basic-card-grouping-left.html +55 -0
  298. package/components/preview/basic-card-grouping.html +110 -0
  299. package/components/preview/basic-card-layouts.html +494 -0
  300. package/components/preview/button-danger-dark-icon.html +51 -0
  301. package/components/preview/button-danger-dark.html +44 -0
  302. package/components/preview/button-danger-default.html +42 -0
  303. package/components/preview/button-danger-icon.html +51 -0
  304. package/components/preview/button-disabled-dark-icon.html +51 -0
  305. package/components/preview/button-disabled-dark.html +44 -0
  306. package/components/preview/button-floating-aligned-column.html +57 -0
  307. package/components/preview/button-floating-aligned-right.html +57 -0
  308. package/components/preview/button-floating-dark-aligned-column.html +57 -0
  309. package/components/preview/button-floating-dark-aligned-right.html +57 -0
  310. package/components/preview/button-floating-dark-default.html +57 -0
  311. package/components/preview/button-floating-dark-disabled.html +57 -0
  312. package/components/preview/button-floating-dark-secondary-aligned-column.html +57 -0
  313. package/components/preview/button-floating-dark-secondary-aligned-right.html +57 -0
  314. package/components/preview/button-floating-dark-secondary.html +57 -0
  315. package/components/preview/button-floating-default.html +57 -0
  316. package/components/preview/button-floating-disabled.html +57 -0
  317. package/components/preview/button-floating-overview.html +39 -0
  318. package/components/preview/button-floating-positioning.html +58 -0
  319. package/components/preview/button-floating-secondary-aligned-column.html +57 -0
  320. package/components/preview/button-floating-secondary-aligned-right.html +57 -0
  321. package/components/preview/button-floating-secondary.html +57 -0
  322. package/components/preview/button-floating-states.html +48 -0
  323. package/components/preview/button-gray-default.html +43 -0
  324. package/components/preview/button-gray-icon.html +51 -0
  325. package/components/preview/button-group-center-alignment.html +37 -0
  326. package/components/preview/button-group-left-alignment.html +37 -0
  327. package/components/preview/button-group-right-alignment.html +37 -0
  328. package/components/preview/button-overview-direction.html +45 -0
  329. package/components/preview/button-overview-global-definition.html +41 -0
  330. package/components/preview/button-overview-sizes.html +48 -0
  331. package/components/preview/button-overview-states.html +59 -0
  332. package/components/preview/button-primary-dark-icon.html +51 -0
  333. package/components/preview/button-primary-dark.html +44 -0
  334. package/components/preview/button-primary-default.html +42 -0
  335. package/components/preview/button-primary-icon.html +52 -0
  336. package/components/preview/button-secondary-dark-icon.html +51 -0
  337. package/components/preview/button-secondary-dark.html +44 -0
  338. package/components/preview/button-secondary-default.html +44 -0
  339. package/components/preview/button-secondary-icon.html +51 -0
  340. package/components/preview/button-tertiary-default.html +42 -0
  341. package/components/preview/button-tertiary-icon.html +51 -0
  342. package/components/preview/buttons-overview.html +510 -0
  343. package/components/preview/category-dark.html +67 -0
  344. package/components/preview/category-disabled-dark.html +63 -0
  345. package/components/preview/category-disabled.html +59 -0
  346. package/components/preview/category-full-row.html +139 -0
  347. package/components/preview/category-overview-dark-states.html +85 -0
  348. package/components/preview/category-overview-dark.html +67 -0
  349. package/components/preview/category-overview-sizes.html +67 -0
  350. package/components/preview/category-overview-states.html +81 -0
  351. package/components/preview/category-small-dark.html +67 -0
  352. package/components/preview/category-small-disabled-dark.html +63 -0
  353. package/components/preview/category-small-disabled.html +59 -0
  354. package/components/preview/category-small-full-row.html +175 -0
  355. package/components/preview/category-small.html +63 -0
  356. package/components/preview/category.html +63 -0
  357. package/components/preview/checkbox-checked.html +38 -0
  358. package/components/preview/checkbox-disabled.html +38 -0
  359. package/components/preview/checkbox-focus.html +38 -0
  360. package/components/preview/checkbox-global-definition.html +38 -0
  361. package/components/preview/checkbox-hover.html +38 -0
  362. package/components/preview/checkbox-inline.html +41 -0
  363. package/components/preview/checkbox-readonly.html +39 -0
  364. package/components/preview/colors-and-shadows.html +126 -0
  365. package/components/preview/contact-cards.html +622 -0
  366. package/components/preview/contact-content.html +56 -0
  367. package/components/preview/contact-overview.html +121 -0
  368. package/components/preview/contact-sizes.html +102 -0
  369. package/components/preview/contact-small.html +67 -0
  370. package/components/preview/contact-without-image-small.html +62 -0
  371. package/components/preview/contact-without-image.html +62 -0
  372. package/components/preview/contact.html +67 -0
  373. package/components/preview/divider-dark-blue.html +29 -0
  374. package/components/preview/divider-default.html +30 -0
  375. package/components/preview/divider-gray-5.html +29 -0
  376. package/components/preview/divider-white-50.html +29 -0
  377. package/components/preview/divider-white.html +29 -0
  378. package/components/preview/divider-yellow.html +30 -0
  379. package/components/preview/generic-card-aspect-16by9.html +49 -0
  380. package/components/preview/generic-card-aspect-2by1-small.html +110 -0
  381. package/components/preview/generic-card-aspect-2by1.html +106 -0
  382. package/components/preview/generic-card-aspect.html +74 -0
  383. package/components/preview/generic-card-default-small-dark-theme.html +48 -0
  384. package/components/preview/generic-card-default-small-svg.html +48 -0
  385. package/components/preview/generic-card-default-small.html +49 -0
  386. package/components/preview/generic-card-default-svg-dark.html +48 -0
  387. package/components/preview/generic-card-default-svg.html +47 -0
  388. package/components/preview/generic-card-default.html +50 -0
  389. package/components/preview/generic-card-media-dark-theme.html +64 -0
  390. package/components/preview/generic-card-media-floating-icon.html +70 -0
  391. package/components/preview/generic-card-media-small.html +62 -0
  392. package/components/preview/generic-card-media.html +62 -0
  393. package/components/preview/generic-card-overview.html +80 -0
  394. package/components/preview/generic-flat-icons.html +54 -0
  395. package/components/preview/generic-rich-icons.html +54 -0
  396. package/components/preview/global-colors-alternative.html +59 -0
  397. package/components/preview/global-colors-gradients.html +63 -0
  398. package/components/preview/global-colors-gray-white-black.html +62 -0
  399. package/components/preview/global-colors-primary.html +53 -0
  400. package/components/preview/global-colors-shadows.html +54 -0
  401. package/components/preview/global-colors-transparency.html +64 -0
  402. package/components/preview/global-margins.html +51 -0
  403. package/components/preview/global-paddings.html +30 -0
  404. package/components/preview/gradient-background-colors.html +164 -0
  405. package/components/preview/input-disabled.html +56 -0
  406. package/components/preview/input-field.html +164 -0
  407. package/components/preview/input-focus.html +56 -0
  408. package/components/preview/input-hover.html +56 -0
  409. package/components/preview/input-readonly.html +56 -0
  410. package/components/preview/input-sizes.html +58 -0
  411. package/components/preview/input-state-error.html +56 -0
  412. package/components/preview/input-state-success.html +56 -0
  413. package/components/preview/input.html +45 -0
  414. package/components/preview/large-section-spacing-definitions.html +59 -0
  415. package/components/preview/large-section-spacing.html +42 -0
  416. package/components/preview/links.html +44 -0
  417. package/components/preview/lists.html +42 -0
  418. package/components/preview/marketplace-flat-icons.html +54 -0
  419. package/components/preview/marketplace-rich-icons.html +54 -0
  420. package/components/preview/matching-content-height-card.html +354 -0
  421. package/components/preview/medium-section-spacing-definitions.html +59 -0
  422. package/components/preview/medium-section-spacing.html +42 -0
  423. package/components/preview/modal-on-click.html +63 -0
  424. package/components/preview/modal-on-load-demo.html +61 -0
  425. package/components/preview/modal-on-load.html +61 -0
  426. package/components/preview/msds-text-alt-blue-1.html +49 -0
  427. package/components/preview/msds-text-alt-blue-2.html +49 -0
  428. package/components/preview/msds-text-alt-blue-3.html +49 -0
  429. package/components/preview/msds-text-alt-yellow-1.html +49 -0
  430. package/components/preview/msds-text-alt-yellow-2.html +49 -0
  431. package/components/preview/msds-text-black.html +49 -0
  432. package/components/preview/msds-text-clear-blue.html +49 -0
  433. package/components/preview/msds-text-confirm-green.html +49 -0
  434. package/components/preview/msds-text-danger-red-1.html +49 -0
  435. package/components/preview/msds-text-danger-red-2.html +49 -0
  436. package/components/preview/msds-text-dark-blue.html +49 -0
  437. package/components/preview/msds-text-gray-1.html +49 -0
  438. package/components/preview/msds-text-gray-10.html +49 -0
  439. package/components/preview/msds-text-gray-2.html +49 -0
  440. package/components/preview/msds-text-gray-3.html +49 -0
  441. package/components/preview/msds-text-gray-4.html +49 -0
  442. package/components/preview/msds-text-gray-5.html +49 -0
  443. package/components/preview/msds-text-gray-6.html +49 -0
  444. package/components/preview/msds-text-gray-7.html +49 -0
  445. package/components/preview/msds-text-gray-8.html +49 -0
  446. package/components/preview/msds-text-gray-9.html +49 -0
  447. package/components/preview/msds-text-sand.html +49 -0
  448. package/components/preview/msds-text-white.html +49 -0
  449. package/components/preview/msds-text-yellow.html +49 -0
  450. package/components/preview/popover-bottom.html +61 -0
  451. package/components/preview/popover-global-definition.html +61 -0
  452. package/components/preview/popover-left.html +61 -0
  453. package/components/preview/popover-top.html +61 -0
  454. package/components/preview/preview-dark.html +59 -0
  455. package/components/preview/preview.html +29 -0
  456. package/components/preview/progress-bar-dark-theme.html +57 -0
  457. package/components/preview/progress-bar-features.html +66 -0
  458. package/components/preview/progress-bar-global-definition.html +41 -0
  459. package/components/preview/progress-bar-light-theme.html +53 -0
  460. package/components/preview/progress-bar-sizes.html +55 -0
  461. package/components/preview/radio-button-disabled.html +36 -0
  462. package/components/preview/radio-button-focus.html +36 -0
  463. package/components/preview/radio-button-global-definition.html +42 -0
  464. package/components/preview/radio-button-hover.html +36 -0
  465. package/components/preview/radio-button-readonly.html +37 -0
  466. package/components/preview/radio-button-selected.html +36 -0
  467. package/components/preview/section-checkbox-dark.html +64 -0
  468. package/components/preview/section-checkbox-nested-accordion.html +119 -0
  469. package/components/preview/section-checkbox.html +96 -0
  470. package/components/preview/section-radio-dark.html +96 -0
  471. package/components/preview/section-radio-nested-accordion.html +144 -0
  472. package/components/preview/section-radio.html +95 -0
  473. package/components/preview/select-input-default.html +41 -0
  474. package/components/preview/select-input-error.html +40 -0
  475. package/components/preview/select-input-global-definition.html +46 -0
  476. package/components/preview/select-input-not-required.html +41 -0
  477. package/components/preview/select-input-required.html +41 -0
  478. package/components/preview/select-input-small.html +38 -0
  479. package/components/preview/small-section-spacing-definitions.html +62 -0
  480. package/components/preview/small-section-spacing.html +42 -0
  481. package/components/preview/solid-background-colors.html +135 -0
  482. package/components/preview/solution-card-default-layout.html +158 -0
  483. package/components/preview/solution-card-default.html +74 -0
  484. package/components/preview/solution-card-layouts.html +587 -0
  485. package/components/preview/solution-card-optional-certification-badges.html +82 -0
  486. package/components/preview/solution-card-optional-solution-badges.html +82 -0
  487. package/components/preview/solution-card-sizes.html +116 -0
  488. package/components/preview/solution-card-small.html +74 -0
  489. package/components/preview/switch-checked.html +41 -0
  490. package/components/preview/switch-default.html +41 -0
  491. package/components/preview/switch-disabled-readonly.html +41 -0
  492. package/components/preview/switch-disabled.html +41 -0
  493. package/components/preview/switch-global.html +46 -0
  494. package/components/preview/tab-tile.html +1128 -0
  495. package/components/preview/table-dark-theme-default-expandable-rows.html +160 -0
  496. package/components/preview/table-dark-theme-default.html +172 -0
  497. package/components/preview/table-default-dark.html +144 -0
  498. package/components/preview/table-default-expandable-rows.html +156 -0
  499. package/components/preview/table-default-medium.html +144 -0
  500. package/components/preview/table-default-small.html +144 -0
  501. package/components/preview/table-default.html +168 -0
  502. package/components/preview/text-area-disabled.html +60 -0
  503. package/components/preview/text-area-error.html +60 -0
  504. package/components/preview/text-area-field.html +47 -0
  505. package/components/preview/text-area-focus.html +60 -0
  506. package/components/preview/text-area-hover.html +60 -0
  507. package/components/preview/text-area-readonly.html +60 -0
  508. package/components/preview/text-area-sizes.html +60 -0
  509. package/components/preview/text-area-success.html +60 -0
  510. package/components/preview/text-area.html +147 -0
  511. package/components/preview/text-colors.html +49 -0
  512. package/components/preview/text.html +74 -0
  513. package/components/preview/typography-body-texts.html +52 -0
  514. package/components/preview/typography-displays.html +34 -0
  515. package/components/preview/typography-headers.html +37 -0
  516. package/components/preview/typography-leads.html +30 -0
  517. package/components/preview/typography-links-dark-theme.html +135 -0
  518. package/components/preview/typography-links-light-theme.html +117 -0
  519. package/components/preview/typography-links-secondary.html +61 -0
  520. package/components/preview/typography-unordered-lists.html +41 -0
  521. package/components/raw/tab-tile/tab-tile.js +139 -0
  522. package/components/raw/tab-tile/tab-tile.scss +256 -0
  523. package/components/render/accordion-checkbox-large.html +55 -0
  524. package/components/render/accordion-checkbox-medium-dark.html +55 -0
  525. package/components/render/accordion-checkbox-medium-disabled.html +56 -0
  526. package/components/render/accordion-checkbox-medium-filtered-list-items.html +58 -0
  527. package/components/render/accordion-checkbox-medium-icon-left-floating-dark-yellow.html +69 -0
  528. package/components/render/accordion-checkbox-medium-icon-left-floating.html +69 -0
  529. package/components/render/accordion-checkbox-medium-icon-left.html +64 -0
  530. package/components/render/accordion-checkbox-medium.html +55 -0
  531. package/components/render/accordion-checkbox-overview.html +57 -0
  532. package/components/render/accordion-input.html +4 -0
  533. package/components/render/accordion-label.html +4 -0
  534. package/components/render/accordion-modifier-icon-floating.html +4 -0
  535. package/components/render/accordion-modifier-icon-left.html +5 -0
  536. package/components/render/accordion-radio.html +57 -0
  537. package/components/render/alert-dark-theme-default.html +33 -0
  538. package/components/render/alert-dark-theme-solution.html +33 -0
  539. package/components/render/alert-default-extra-attention.html +32 -0
  540. package/components/render/alert-default-generic.html +32 -0
  541. package/components/render/alert-default-solution-with-badge-and-ready-state.html +38 -0
  542. package/components/render/alert-default-solution.html +34 -0
  543. package/components/render/alert-default-without-image.html +31 -0
  544. package/components/render/alert-default.html +32 -0
  545. package/components/render/alert-hidden-after-refresh-checkbox.html +37 -0
  546. package/components/render/alert-hidden-after-refresh.html +31 -0
  547. package/components/render/alert-layouts.html +315 -0
  548. package/components/render/alert-visible-after-refresh.html +31 -0
  549. package/components/render/background-colors.html +4 -0
  550. package/components/render/basic-card-default-dark.html +29 -0
  551. package/components/render/basic-card-default-without-caption-with-header-icon.html +24 -0
  552. package/components/render/basic-card-default-without-caption-with-header-image.html +22 -0
  553. package/components/render/basic-card-default-without-caption.html +20 -0
  554. package/components/render/basic-card-default.html +29 -0
  555. package/components/render/basic-card-grouping-center.html +29 -0
  556. package/components/render/basic-card-grouping-left-with-flat-icon.html +34 -0
  557. package/components/render/basic-card-grouping-left.html +29 -0
  558. package/components/render/basic-card-grouping.html +84 -0
  559. package/components/render/basic-card-layouts.html +468 -0
  560. package/components/render/button-danger-dark-icon.html +25 -0
  561. package/components/render/button-danger-dark.html +18 -0
  562. package/components/render/button-danger-default.html +16 -0
  563. package/components/render/button-danger-icon.html +25 -0
  564. package/components/render/button-disabled-dark-icon.html +25 -0
  565. package/components/render/button-disabled-dark.html +18 -0
  566. package/components/render/button-floating-aligned-column.html +31 -0
  567. package/components/render/button-floating-aligned-right.html +31 -0
  568. package/components/render/button-floating-dark-aligned-column.html +31 -0
  569. package/components/render/button-floating-dark-aligned-right.html +31 -0
  570. package/components/render/button-floating-dark-default.html +31 -0
  571. package/components/render/button-floating-dark-disabled.html +31 -0
  572. package/components/render/button-floating-dark-secondary-aligned-column.html +31 -0
  573. package/components/render/button-floating-dark-secondary-aligned-right.html +31 -0
  574. package/components/render/button-floating-dark-secondary.html +31 -0
  575. package/components/render/button-floating-default.html +31 -0
  576. package/components/render/button-floating-disabled.html +31 -0
  577. package/components/render/button-floating-overview.html +13 -0
  578. package/components/render/button-floating-positioning.html +32 -0
  579. package/components/render/button-floating-secondary-aligned-column.html +31 -0
  580. package/components/render/button-floating-secondary-aligned-right.html +31 -0
  581. package/components/render/button-floating-secondary.html +31 -0
  582. package/components/render/button-floating-states.html +22 -0
  583. package/components/render/button-gray-default.html +17 -0
  584. package/components/render/button-gray-icon.html +25 -0
  585. package/components/render/button-group-center-alignment.html +11 -0
  586. package/components/render/button-group-left-alignment.html +11 -0
  587. package/components/render/button-group-right-alignment.html +11 -0
  588. package/components/render/button-overview-direction.html +19 -0
  589. package/components/render/button-overview-global-definition.html +15 -0
  590. package/components/render/button-overview-sizes.html +22 -0
  591. package/components/render/button-overview-states.html +33 -0
  592. package/components/render/button-primary-dark-icon.html +25 -0
  593. package/components/render/button-primary-dark.html +18 -0
  594. package/components/render/button-primary-default.html +16 -0
  595. package/components/render/button-primary-icon.html +26 -0
  596. package/components/render/button-secondary-dark-icon.html +25 -0
  597. package/components/render/button-secondary-dark.html +18 -0
  598. package/components/render/button-secondary-default.html +18 -0
  599. package/components/render/button-secondary-icon.html +25 -0
  600. package/components/render/button-tertiary-default.html +16 -0
  601. package/components/render/button-tertiary-icon.html +25 -0
  602. package/components/render/buttons-overview.html +484 -0
  603. package/components/render/category-dark.html +37 -0
  604. package/components/render/category-disabled-dark.html +33 -0
  605. package/components/render/category-disabled.html +33 -0
  606. package/components/render/category-full-row.html +113 -0
  607. package/components/render/category-overview-dark-states.html +55 -0
  608. package/components/render/category-overview-dark.html +37 -0
  609. package/components/render/category-overview-sizes.html +41 -0
  610. package/components/render/category-overview-states.html +55 -0
  611. package/components/render/category-small-dark.html +37 -0
  612. package/components/render/category-small-disabled-dark.html +33 -0
  613. package/components/render/category-small-disabled.html +33 -0
  614. package/components/render/category-small-full-row.html +149 -0
  615. package/components/render/category-small.html +37 -0
  616. package/components/render/category.html +37 -0
  617. package/components/render/checkbox-checked.html +12 -0
  618. package/components/render/checkbox-disabled.html +12 -0
  619. package/components/render/checkbox-focus.html +12 -0
  620. package/components/render/checkbox-global-definition.html +12 -0
  621. package/components/render/checkbox-hover.html +12 -0
  622. package/components/render/checkbox-inline.html +15 -0
  623. package/components/render/checkbox-readonly.html +13 -0
  624. package/components/render/colors-and-shadows.html +80 -0
  625. package/components/render/contact-cards.html +596 -0
  626. package/components/render/contact-content.html +30 -0
  627. package/components/render/contact-overview.html +95 -0
  628. package/components/render/contact-sizes.html +76 -0
  629. package/components/render/contact-small.html +41 -0
  630. package/components/render/contact-without-image-small.html +36 -0
  631. package/components/render/contact-without-image.html +36 -0
  632. package/components/render/contact.html +41 -0
  633. package/components/render/divider-dark-blue.html +3 -0
  634. package/components/render/divider-default.html +4 -0
  635. package/components/render/divider-gray-5.html +3 -0
  636. package/components/render/divider-white-50.html +3 -0
  637. package/components/render/divider-white.html +3 -0
  638. package/components/render/divider-yellow.html +4 -0
  639. package/components/render/generic-card-aspect-16by9.html +23 -0
  640. package/components/render/generic-card-aspect-2by1-small.html +84 -0
  641. package/components/render/generic-card-aspect-2by1.html +80 -0
  642. package/components/render/generic-card-aspect.html +48 -0
  643. package/components/render/generic-card-default-small-dark-theme.html +22 -0
  644. package/components/render/generic-card-default-small-svg.html +22 -0
  645. package/components/render/generic-card-default-small.html +23 -0
  646. package/components/render/generic-card-default-svg-dark.html +22 -0
  647. package/components/render/generic-card-default-svg.html +21 -0
  648. package/components/render/generic-card-default.html +24 -0
  649. package/components/render/generic-card-media-dark-theme.html +38 -0
  650. package/components/render/generic-card-media-floating-icon.html +44 -0
  651. package/components/render/generic-card-media-small.html +36 -0
  652. package/components/render/generic-card-media.html +36 -0
  653. package/components/render/generic-card-overview.html +54 -0
  654. package/components/render/generic-flat-icons.html +3 -0
  655. package/components/render/generic-rich-icons.html +3 -0
  656. package/components/render/global-colors-alternative.html +13 -0
  657. package/components/render/global-colors-gradients.html +17 -0
  658. package/components/render/global-colors-gray-white-black.html +16 -0
  659. package/components/render/global-colors-primary.html +7 -0
  660. package/components/render/global-colors-shadows.html +8 -0
  661. package/components/render/global-colors-transparency.html +18 -0
  662. package/components/render/global-margins.html +25 -0
  663. package/components/render/global-paddings.html +4 -0
  664. package/components/render/gradient-background-colors.html +118 -0
  665. package/components/render/input-disabled.html +30 -0
  666. package/components/render/input-field.html +138 -0
  667. package/components/render/input-focus.html +30 -0
  668. package/components/render/input-hover.html +30 -0
  669. package/components/render/input-readonly.html +30 -0
  670. package/components/render/input-sizes.html +32 -0
  671. package/components/render/input-state-error.html +30 -0
  672. package/components/render/input-state-success.html +30 -0
  673. package/components/render/input.html +19 -0
  674. package/components/render/large-section-spacing-definitions.html +33 -0
  675. package/components/render/large-section-spacing.html +16 -0
  676. package/components/render/links.html +18 -0
  677. package/components/render/lists.html +16 -0
  678. package/components/render/marketplace-flat-icons.html +3 -0
  679. package/components/render/marketplace-rich-icons.html +3 -0
  680. package/components/render/matching-content-height-card.html +328 -0
  681. package/components/render/medium-section-spacing-definitions.html +33 -0
  682. package/components/render/medium-section-spacing.html +16 -0
  683. package/components/render/modal-on-click.html +37 -0
  684. package/components/render/modal-on-load-demo.html +35 -0
  685. package/components/render/modal-on-load.html +35 -0
  686. package/components/render/msds-text-alt-blue-1.html +3 -0
  687. package/components/render/msds-text-alt-blue-2.html +3 -0
  688. package/components/render/msds-text-alt-blue-3.html +3 -0
  689. package/components/render/msds-text-alt-yellow-1.html +3 -0
  690. package/components/render/msds-text-alt-yellow-2.html +3 -0
  691. package/components/render/msds-text-black.html +3 -0
  692. package/components/render/msds-text-clear-blue.html +3 -0
  693. package/components/render/msds-text-confirm-green.html +3 -0
  694. package/components/render/msds-text-danger-red-1.html +3 -0
  695. package/components/render/msds-text-danger-red-2.html +3 -0
  696. package/components/render/msds-text-dark-blue.html +3 -0
  697. package/components/render/msds-text-gray-1.html +3 -0
  698. package/components/render/msds-text-gray-10.html +3 -0
  699. package/components/render/msds-text-gray-2.html +3 -0
  700. package/components/render/msds-text-gray-3.html +3 -0
  701. package/components/render/msds-text-gray-4.html +3 -0
  702. package/components/render/msds-text-gray-5.html +3 -0
  703. package/components/render/msds-text-gray-6.html +3 -0
  704. package/components/render/msds-text-gray-7.html +3 -0
  705. package/components/render/msds-text-gray-8.html +3 -0
  706. package/components/render/msds-text-gray-9.html +3 -0
  707. package/components/render/msds-text-sand.html +3 -0
  708. package/components/render/msds-text-white.html +3 -0
  709. package/components/render/msds-text-yellow.html +3 -0
  710. package/components/render/popover-bottom.html +35 -0
  711. package/components/render/popover-global-definition.html +35 -0
  712. package/components/render/popover-left.html +35 -0
  713. package/components/render/popover-top.html +35 -0
  714. package/components/render/preview-dark.html +33 -0
  715. package/components/render/preview.html +29 -0
  716. package/components/render/progress-bar-dark-theme.html +27 -0
  717. package/components/render/progress-bar-features.html +40 -0
  718. package/components/render/progress-bar-global-definition.html +15 -0
  719. package/components/render/progress-bar-light-theme.html +27 -0
  720. package/components/render/progress-bar-sizes.html +29 -0
  721. package/components/render/radio-button-disabled.html +10 -0
  722. package/components/render/radio-button-focus.html +10 -0
  723. package/components/render/radio-button-global-definition.html +16 -0
  724. package/components/render/radio-button-hover.html +10 -0
  725. package/components/render/radio-button-readonly.html +11 -0
  726. package/components/render/radio-button-selected.html +10 -0
  727. package/components/render/section-checkbox-dark.html +38 -0
  728. package/components/render/section-checkbox-nested-accordion.html +93 -0
  729. package/components/render/section-checkbox.html +70 -0
  730. package/components/render/section-radio-dark.html +70 -0
  731. package/components/render/section-radio-nested-accordion.html +118 -0
  732. package/components/render/section-radio.html +69 -0
  733. package/components/render/select-input-default.html +15 -0
  734. package/components/render/select-input-error.html +14 -0
  735. package/components/render/select-input-global-definition.html +20 -0
  736. package/components/render/select-input-not-required.html +15 -0
  737. package/components/render/select-input-required.html +15 -0
  738. package/components/render/select-input-small.html +12 -0
  739. package/components/render/small-section-spacing-definitions.html +36 -0
  740. package/components/render/small-section-spacing.html +16 -0
  741. package/components/render/solid-background-colors.html +89 -0
  742. package/components/render/solution-card-default-layout.html +132 -0
  743. package/components/render/solution-card-default.html +48 -0
  744. package/components/render/solution-card-layouts.html +561 -0
  745. package/components/render/solution-card-optional-certification-badges.html +56 -0
  746. package/components/render/solution-card-optional-solution-badges.html +56 -0
  747. package/components/render/solution-card-sizes.html +90 -0
  748. package/components/render/solution-card-small.html +48 -0
  749. package/components/render/switch-checked.html +15 -0
  750. package/components/render/switch-default.html +15 -0
  751. package/components/render/switch-disabled-readonly.html +15 -0
  752. package/components/render/switch-disabled.html +15 -0
  753. package/components/render/switch-global.html +20 -0
  754. package/components/render/tab-tile.html +1102 -0
  755. package/components/render/table-dark-theme-default-expandable-rows.html +130 -0
  756. package/components/render/table-dark-theme-default.html +142 -0
  757. package/components/render/table-default-dark.html +118 -0
  758. package/components/render/table-default-expandable-rows.html +130 -0
  759. package/components/render/table-default-medium.html +118 -0
  760. package/components/render/table-default-small.html +118 -0
  761. package/components/render/table-default.html +142 -0
  762. package/components/render/text-area-disabled.html +34 -0
  763. package/components/render/text-area-error.html +34 -0
  764. package/components/render/text-area-field.html +21 -0
  765. package/components/render/text-area-focus.html +34 -0
  766. package/components/render/text-area-hover.html +34 -0
  767. package/components/render/text-area-readonly.html +34 -0
  768. package/components/render/text-area-sizes.html +34 -0
  769. package/components/render/text-area-success.html +34 -0
  770. package/components/render/text-area.html +121 -0
  771. package/components/render/text-colors.html +3 -0
  772. package/components/render/text.html +48 -0
  773. package/components/render/typography-body-texts.html +26 -0
  774. package/components/render/typography-displays.html +8 -0
  775. package/components/render/typography-headers.html +11 -0
  776. package/components/render/typography-leads.html +4 -0
  777. package/components/render/typography-links-dark-theme.html +109 -0
  778. package/components/render/typography-links-light-theme.html +91 -0
  779. package/components/render/typography-links-secondary.html +35 -0
  780. package/components/render/typography-unordered-lists.html +15 -0
  781. package/components.html +13 -0
  782. package/design-system.css +1 -1
  783. package/docs/component-documentation/alerts.html +1657 -0
  784. package/docs/component-documentation/buttons/buttons-floating.html +1676 -0
  785. package/docs/component-documentation/buttons/buttons.html +1908 -0
  786. package/docs/component-documentation/cards/basic-cards.html +1424 -0
  787. package/docs/component-documentation/cards/category-cards.html +1950 -0
  788. package/docs/component-documentation/cards/contact-cards.html +1474 -0
  789. package/docs/component-documentation/cards/generic-cards.html +1534 -0
  790. package/docs/component-documentation/cards/solution-cards.html +1595 -0
  791. package/docs/component-documentation/dividers/dividers.html +839 -0
  792. package/docs/component-documentation/expanding-components/accordion.html +1832 -0
  793. package/docs/component-documentation/expanding-components/section.html +1511 -0
  794. package/docs/component-documentation/modal.html +983 -0
  795. package/docs/component-documentation/popover/popover.html +1082 -0
  796. package/docs/component-documentation/progress-bar.html +1143 -0
  797. package/docs/component-documentation/spacing.html +831 -0
  798. package/docs/component-documentation/table.html +2336 -0
  799. package/docs/content/icons/-overview.html +848 -0
  800. package/docs/content/icons/icons-flat.html +839 -0
  801. package/docs/content/icons/icons-rich.html +839 -0
  802. package/docs/content/typography/-overview.html +860 -0
  803. package/docs/content/typography/font-colors.html +900 -0
  804. package/docs/content/typography/links.html +1113 -0
  805. package/docs/content/typography/lists.html +854 -0
  806. package/docs/content/typography/text.html +919 -0
  807. package/docs/forms/-overview.html +881 -0
  808. package/docs/forms/checkbox.html +1007 -0
  809. package/docs/forms/drop-down-list.html +981 -0
  810. package/docs/forms/input-field.html +1316 -0
  811. package/docs/forms/radio-button.html +966 -0
  812. package/docs/forms/switch.html +964 -0
  813. package/docs/forms/text-area.html +1371 -0
  814. package/docs/guidelines-and-guides/creating-a-new-release.html +825 -0
  815. package/docs/guidelines-and-guides/css-and-scss-guidelines.html +814 -0
  816. package/docs/guidelines-and-guides/git-cheat-sheet.html +898 -0
  817. package/docs/guidelines-and-guides/installation-and-usage.html +812 -0
  818. package/docs/utilities/colors/background-colors.html +1029 -0
  819. package/docs/utilities/colors/font-colors.html +1002 -0
  820. package/docs/utilities/colors/overview.html +952 -0
  821. package/docs/utilities/spacing.html +1112 -0
  822. package/docs.html +13 -0
  823. package/icons.list.js +2432 -2432
  824. package/index.html +807 -0
  825. package/main.css +1 -1
  826. package/package.json +58 -58
  827. package/scss/_variables.scss +124 -124
  828. package/spacing.list.js +11 -11
  829. package/svg/rich/Okay.svg +33 -33
  830. package/svg/rich/acceleration.svg +39 -39
  831. package/svg/rich/add-content.svg +37 -37
  832. package/svg/rich/add-solution.svg +29 -29
  833. package/svg/rich/advanced-super-surveillance.svg +42 -42
  834. package/svg/rich/advocacy .svg +60 -60
  835. package/svg/rich/airplane.svg +67 -67
  836. package/svg/rich/ambition.svg +46 -46
  837. package/svg/rich/analytics-devices.svg +68 -68
  838. package/svg/rich/applications.svg +97 -97
  839. package/svg/rich/backup-important.svg +157 -157
  840. package/svg/rich/black-screens.svg +43 -43
  841. package/svg/rich/blueprint.svg +22 -22
  842. package/svg/rich/body-worn.svg +45 -45
  843. package/svg/rich/book-a-demo-notification.svg +38 -38
  844. package/svg/rich/book-a-demo.svg +34 -34
  845. package/svg/rich/booking.svg +49 -49
  846. package/svg/rich/browser.svg +32 -32
  847. package/svg/rich/build.svg +34 -34
  848. package/svg/rich/building-medium.svg +66 -66
  849. package/svg/rich/cal-monthly.svg +324 -324
  850. package/svg/rich/cal-weekly.svg +173 -173
  851. package/svg/rich/calendar.svg +25 -25
  852. package/svg/rich/cam-group-small.svg +84 -84
  853. package/svg/rich/camera-analogue.svg +27 -27
  854. package/svg/rich/camera-memory.svg +25 -25
  855. package/svg/rich/car.svg +41 -41
  856. package/svg/rich/care.svg +16 -16
  857. package/svg/rich/catalogue.svg +22 -22
  858. package/svg/rich/certification.svg +25 -25
  859. package/svg/rich/checklist.svg +22 -22
  860. package/svg/rich/checkmark-badge.svg +11 -11
  861. package/svg/rich/checkmark.svg +11 -11
  862. package/svg/rich/clock-24-7.svg +77 -77
  863. package/svg/rich/co-working.svg +104 -104
  864. package/svg/rich/coffee.svg +60 -60
  865. package/svg/rich/community.svg +184 -184
  866. package/svg/rich/company.svg +32 -32
  867. package/svg/rich/complete-flow.svg +30 -30
  868. package/svg/rich/consumer.svg +47 -47
  869. package/svg/rich/contact-illustration.svg +13 -13
  870. package/svg/rich/contact-notification.svg +17 -17
  871. package/svg/rich/crime.svg +29 -29
  872. package/svg/rich/crowd-management.svg +47 -47
  873. package/svg/rich/customer-stories.svg +23 -23
  874. package/svg/rich/customizable.svg +19 -19
  875. package/svg/rich/cyber-security.svg +131 -131
  876. package/svg/rich/dashboard.svg +43 -43
  877. package/svg/rich/decision-making.svg +19 -19
  878. package/svg/rich/deployment-device.svg +66 -66
  879. package/svg/rich/design-animated.svg +51 -51
  880. package/svg/rich/design.svg +24 -24
  881. package/svg/rich/devices-web.svg +56 -56
  882. package/svg/rich/devices.svg +29 -29
  883. package/svg/rich/discount.svg +22 -22
  884. package/svg/rich/document.svg +24 -24
  885. package/svg/rich/documentation.svg +79 -79
  886. package/svg/rich/dome-cam-8.svg +84 -84
  887. package/svg/rich/dome-cam.svg +16 -16
  888. package/svg/rich/download-illustration.svg +49 -49
  889. package/svg/rich/e-learning.svg +42 -42
  890. package/svg/rich/emergency.svg +44 -44
  891. package/svg/rich/employees.svg +37 -37
  892. package/svg/rich/end-user.svg +28 -28
  893. package/svg/rich/expertise.svg +47 -47
  894. package/svg/rich/explore.svg +50 -50
  895. package/svg/rich/extension.svg +63 -63
  896. package/svg/rich/failover.svg +33 -33
  897. package/svg/rich/faq.svg +23 -23
  898. package/svg/rich/feedback-notification.svg +21 -21
  899. package/svg/rich/feedback.svg +17 -17
  900. package/svg/rich/find.svg +28 -28
  901. package/svg/rich/flexibility.svg +13 -13
  902. package/svg/rich/form.svg +26 -26
  903. package/svg/rich/get-leads.svg +73 -73
  904. package/svg/rich/getting-started.svg +29 -29
  905. package/svg/rich/global-partner-network.svg +978 -978
  906. package/svg/rich/growth-data.svg +56 -56
  907. package/svg/rich/happiness.svg +29 -29
  908. package/svg/rich/hardware-applications-software.svg +165 -165
  909. package/svg/rich/hardware-services-documentation.svg +47 -47
  910. package/svg/rich/hardware.svg +22 -22
  911. package/svg/rich/intelligence.svg +43 -43
  912. package/svg/rich/interconnect.svg +39 -39
  913. package/svg/rich/investigation.svg +34 -34
  914. package/svg/rich/join.svg +78 -78
  915. package/svg/rich/key-features.svg +38 -38
  916. package/svg/rich/languages.svg +49 -49
  917. package/svg/rich/license-governance.svg +45 -45
  918. package/svg/rich/license-key.svg +13 -13
  919. package/svg/rich/like-notification.svg +43 -43
  920. package/svg/rich/listen.svg +13 -13
  921. package/svg/rich/live-streaming.svg +93 -93
  922. package/svg/rich/logged-in.svg +14 -14
  923. package/svg/rich/lpr.svg +59 -59
  924. package/svg/rich/marketplace-challenges-assist-people-feel-safe-leaving.svg +105 -105
  925. package/svg/rich/marketplace-challenges-assist-people-in-finding-their-vehicles.svg +124 -124
  926. package/svg/rich/marketplace-challenges-avoid-employee-theft.svg +169 -169
  927. package/svg/rich/marketplace-challenges-control-access-to-restricted-areas.svg +104 -104
  928. package/svg/rich/marketplace-challenges-discover-inefficiencies-in-cargo-movement.svg +130 -130
  929. package/svg/rich/marketplace-challenges-find-lost-children.svg +87 -87
  930. package/svg/rich/marketplace-challenges-gather-evidence-for-criminal-investigation.svg +172 -172
  931. package/svg/rich/marketplace-challenges-improve-wait-time-in-lines.svg +375 -375
  932. package/svg/rich/marketplace-challenges-money-disputes-with-customers.svg +157 -157
  933. package/svg/rich/marketplace-challenges-personalized-customer-experience.svg +127 -127
  934. package/svg/rich/marketplace-challenges-prevent-multiple-people-from-entering-a-door-on-a-single-access-badge.svg +245 -245
  935. package/svg/rich/marketplace-challenges-provide-evidence-against-lawsuit.svg +270 -270
  936. package/svg/rich/marketplace-challenges-react-to-confrontations-before-they-escalate.svg +176 -176
  937. package/svg/rich/marketplace-challenges-reduce-property-damage.svg +381 -381
  938. package/svg/rich/marketplace-challenges-reduce-workplace-accidents.svg +172 -172
  939. package/svg/rich/marketplace-challenges-respond-to-medical-emergencies.svg +179 -179
  940. package/svg/rich/marketplace-challenges-situational-awareness-to-response-teams.svg +330 -330
  941. package/svg/rich/marketplace-challenges-understand-customer-behavior.svg +455 -455
  942. package/svg/rich/marketplace-challenges-vandalism.svg +120 -120
  943. package/svg/rich/marketplace-collect.svg +121 -121
  944. package/svg/rich/marketplace-filter.svg +54 -54
  945. package/svg/rich/marketplace-industries-airports.svg +380 -380
  946. package/svg/rich/marketplace-industries-art-and-entertainment.svg +170 -170
  947. package/svg/rich/marketplace-industries-city-surveillance.svg +572 -572
  948. package/svg/rich/marketplace-industries-construction.svg +253 -253
  949. package/svg/rich/marketplace-industries-critical-infrastructure.svg +292 -292
  950. package/svg/rich/marketplace-industries-education.svg +291 -291
  951. package/svg/rich/marketplace-industries-finance-and-insurance.svg +140 -140
  952. package/svg/rich/marketplace-industries-healthcare.svg +207 -207
  953. package/svg/rich/marketplace-industries-information-technology.svg +250 -250
  954. package/svg/rich/marketplace-industries-manufacturing.svg +175 -175
  955. package/svg/rich/marketplace-industries-public-administration.svg +349 -349
  956. package/svg/rich/marketplace-industries-public-transport.svg +303 -303
  957. package/svg/rich/marketplace-industries-retail.svg +392 -392
  958. package/svg/rich/marketplace-industries-seaports.svg +335 -335
  959. package/svg/rich/marketplace-industries-trafic-monitoring.svg +255 -255
  960. package/svg/rich/marketplace-industries-utilities.svg +211 -211
  961. package/svg/rich/marketplace-interface.svg +76 -76
  962. package/svg/rich/marketplace-practice-access-control.svg +117 -117
  963. package/svg/rich/marketplace-practice-business-intelligence.svg +89 -89
  964. package/svg/rich/marketplace-practice-business-solutions.svg +195 -195
  965. package/svg/rich/marketplace-practice-central-monitoring.svg +505 -505
  966. package/svg/rich/marketplace-practice-cloud-and-managed-services.svg +75 -75
  967. package/svg/rich/marketplace-practice-communication.svg +187 -187
  968. package/svg/rich/marketplace-practice-crisis-emergency.svg +160 -160
  969. package/svg/rich/marketplace-practice-cyber-security.svg +141 -141
  970. package/svg/rich/marketplace-practice-detection-and-deterrence.svg +164 -164
  971. package/svg/rich/marketplace-practice-digital-infrastructure.svg +197 -197
  972. package/svg/rich/marketplace-practice-facilities-management.svg +332 -332
  973. package/svg/rich/marketplace-practice-fire-and-life-safety.svg +168 -168
  974. package/svg/rich/marketplace-practice-home-automation-iot.svg +161 -161
  975. package/svg/rich/marketplace-practice-intrusion-and-alarm.svg +301 -301
  976. package/svg/rich/marketplace-practice-investigation.svg +157 -157
  977. package/svg/rich/marketplace-practice-it-hardware-and-equipment.svg +254 -254
  978. package/svg/rich/marketplace-practice-privacy-protection.svg +118 -118
  979. package/svg/rich/marketplace-practice-smart-city.svg +351 -351
  980. package/svg/rich/marketplace-practice-surveillance.svg +72 -72
  981. package/svg/rich/marketplace-practice-tracking-and-monitoring.svg +178 -178
  982. package/svg/rich/marketplace-practice-vehicles-and-traffic.svg +227 -227
  983. package/svg/rich/marketplace-solution-service.svg +75 -75
  984. package/svg/rich/milestone-global-offices-illustration.svg +49 -49
  985. package/svg/rich/milestone-in the-media.svg +49 -49
  986. package/svg/rich/mobile-support.svg +40 -40
  987. package/svg/rich/my-milestone.svg +28 -28
  988. package/svg/rich/network.svg +24 -24
  989. package/svg/rich/newspaper.svg +20 -20
  990. package/svg/rich/no-1.svg +50 -50
  991. package/svg/rich/no-backup.svg +30 -30
  992. package/svg/rich/one-hub.svg +71 -71
  993. package/svg/rich/open-platform-community.svg +144 -144
  994. package/svg/rich/open-platform.svg +10 -10
  995. package/svg/rich/outdated-hardware.svg +53 -53
  996. package/svg/rich/partnership.svg +39 -39
  997. package/svg/rich/passion.svg +41 -41
  998. package/svg/rich/planet.svg +75 -75
  999. package/svg/rich/play.svg +10 -10
  1000. package/svg/rich/press-release.svg +30 -30
  1001. package/svg/rich/product-overview-illustration.svg +49 -49
  1002. package/svg/rich/project-animated.svg +99 -99
  1003. package/svg/rich/project.svg +18 -18
  1004. package/svg/rich/promotion.svg +25 -25
  1005. package/svg/rich/publish.svg +12 -12
  1006. package/svg/rich/quote.svg +104 -104
  1007. package/svg/rich/reaction-mode.svg +54 -54
  1008. package/svg/rich/releases.svg +17 -17
  1009. package/svg/rich/reliable.svg +24 -24
  1010. package/svg/rich/reminder.svg +33 -33
  1011. package/svg/rich/save-money.svg +27 -27
  1012. package/svg/rich/scalable.svg +16 -16
  1013. package/svg/rich/scale-balance.svg +101 -101
  1014. package/svg/rich/scale-up.svg +11 -11
  1015. package/svg/rich/screen-recording.svg +259 -259
  1016. package/svg/rich/searching.svg +115 -115
  1017. package/svg/rich/secure-gdpr.svg +52 -52
  1018. package/svg/rich/secure.svg +49 -49
  1019. package/svg/rich/self-service-support.svg +15 -15
  1020. package/svg/rich/service-coding.svg +44 -44
  1021. package/svg/rich/sign-up.svg +37 -37
  1022. package/svg/rich/single-site.svg +31 -31
  1023. package/svg/rich/smart-wall-person.svg +135 -135
  1024. package/svg/rich/smart-wall.svg +96 -96
  1025. package/svg/rich/solutions-design-tool.svg +234 -234
  1026. package/svg/rich/submit-for-feedback.svg +28 -28
  1027. package/svg/rich/subscriptions.svg +37 -37
  1028. package/svg/rich/support-call.svg +29 -29
  1029. package/svg/rich/support-chat-female.svg +48 -48
  1030. package/svg/rich/support-chat-male.svg +48 -48
  1031. package/svg/rich/support-technical.svg +17 -17
  1032. package/svg/rich/system-builder.svg +24 -24
  1033. package/svg/rich/tags.svg +24 -24
  1034. package/svg/rich/target.svg +15 -15
  1035. package/svg/rich/time-to-market.svg +53 -53
  1036. package/svg/rich/tools.svg +37 -37
  1037. package/svg/rich/trade-show.svg +90 -90
  1038. package/svg/rich/transaction.svg +56 -56
  1039. package/svg/rich/translation.svg +17 -17
  1040. package/svg/rich/update-content-then-publish.svg +77 -77
  1041. package/svg/rich/update-content.svg +55 -55
  1042. package/svg/rich/user-review.svg +22 -22
  1043. package/svg/rich/verification.svg +37 -37
  1044. package/svg/rich/video-cookie.svg +78 -78
  1045. package/svg/rich/vps.svg +39 -39
  1046. package/svg/rich/warning.svg +48 -48
  1047. package/svg/rich/watch.svg +19 -19
  1048. package/svg/rich/webinar.svg +49 -49
  1049. package/svg/rich/well-being.svg +67 -67
  1050. package/svg/rich/world-leading.svg +258 -258
  1051. package/svg/rich/xprotect-access-anywhere.svg +86 -86
  1052. package/svg/rich/xprotect-compare-matrix.svg +40 -40
  1053. package/svg/rich/xprotect-compare-products.svg +232 -232
  1054. package/svg/rich/xprotect-compare-releases.svg +208 -208
  1055. package/svg/rich/xprotect.svg +31 -31
  1056. package/svg/rich/youtube.svg +12 -12
  1057. package/text.list.js +47 -47
  1058. package/themes/mandelbrot/css/aqua.css +1 -0
  1059. package/themes/mandelbrot/css/black.css +1 -0
  1060. package/themes/mandelbrot/css/blue.css +1 -0
  1061. package/themes/mandelbrot/css/default.css +1 -0
  1062. package/themes/mandelbrot/css/fuchsia.css +1 -0
  1063. package/themes/mandelbrot/css/green.css +1 -0
  1064. package/themes/mandelbrot/css/grey.css +1 -0
  1065. package/themes/mandelbrot/css/highlight.css +1 -0
  1066. package/themes/mandelbrot/css/lime.css +1 -0
  1067. package/themes/mandelbrot/css/maroon.css +1 -0
  1068. package/themes/mandelbrot/css/navy.css +1 -0
  1069. package/themes/mandelbrot/css/olive.css +1 -0
  1070. package/themes/mandelbrot/css/orange.css +1 -0
  1071. package/themes/mandelbrot/css/purple.css +1 -0
  1072. package/themes/mandelbrot/css/red.css +1 -0
  1073. package/themes/mandelbrot/css/teal.css +1 -0
  1074. package/themes/mandelbrot/css/white.css +1 -0
  1075. package/themes/mandelbrot/css/yellow.css +1 -0
  1076. package/themes/mandelbrot/favicon.ico +0 -0
  1077. package/themes/mandelbrot/fonts/OpenSans-Italic.woff +0 -0
  1078. package/themes/mandelbrot/fonts/OpenSans-Italic.woff2 +0 -0
  1079. package/themes/mandelbrot/fonts/OpenSans-Regular.woff +0 -0
  1080. package/themes/mandelbrot/fonts/OpenSans-Regular.woff2 +0 -0
  1081. package/themes/mandelbrot/fonts/OpenSans-Semibold.woff +0 -0
  1082. package/themes/mandelbrot/fonts/OpenSans-Semibold.woff2 +0 -0
  1083. package/themes/mandelbrot/fonts/OpenSans-SemiboldItalic.woff +0 -0
  1084. package/themes/mandelbrot/fonts/OpenSans-SemiboldItalic.woff2 +0 -0
  1085. package/themes/mandelbrot/fonts/hack-bold-webfont.woff +0 -0
  1086. package/themes/mandelbrot/fonts/hack-bold-webfont.woff2 +0 -0
  1087. package/themes/mandelbrot/fonts/hack-bolditalic-webfont.woff +0 -0
  1088. package/themes/mandelbrot/fonts/hack-bolditalic-webfont.woff2 +0 -0
  1089. package/themes/mandelbrot/fonts/hack-italic-webfont.woff +0 -0
  1090. package/themes/mandelbrot/fonts/hack-italic-webfont.woff2 +0 -0
  1091. package/themes/mandelbrot/fonts/hack-regular-webfont.woff +0 -0
  1092. package/themes/mandelbrot/fonts/hack-regular-webfont.woff2 +0 -0
  1093. package/themes/mandelbrot/img/favicon.png +0 -0
  1094. package/themes/mandelbrot/img/icon-drag--horizontal.svg +3 -0
  1095. package/themes/mandelbrot/img/icon-drag--vertical.svg +3 -0
  1096. package/themes/mandelbrot/img/icon-navigation-closed-ltr.svg +3 -0
  1097. package/themes/mandelbrot/img/icon-navigation-closed-rtl.svg +3 -0
  1098. package/themes/mandelbrot/img/icon-navigation-opened.svg +3 -0
  1099. package/themes/mandelbrot/img/icon-window.svg +3 -0
  1100. package/themes/mandelbrot/img/loader.svg +37 -0
  1101. package/themes/mandelbrot/js/mandelbrot.js +2 -0
  1102. package/themes/mandelbrot/js/mandelbrot.js.map +1 -0
@@ -0,0 +1,1287 @@
1
+ <!DOCTYPE html>
2
+ <html lang="en" dir="ltr" class="no-js">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1">
6
+ <script>
7
+ window.frctl = {
8
+ env: 'static'
9
+ };
10
+ </script>
11
+ <script>var cl = document.querySelector('html').classList; cl.remove('no-js'); cl.add('has-js');</script>
12
+ <link rel="shortcut icon" href="../../src/demo-img/favicon.ico" type="image/ico">
13
+
14
+ <link rel="stylesheet" href="../../themes/mandelbrot/css/default.css?cachebust=1.4.0" type="text/css">
15
+
16
+ <link rel="stylesheet" href="../../rich-icons-bundle.css?cachebust=1.4.0" type="text/css">
17
+
18
+ <link rel="stylesheet" href="../../theme-overrides/styles.css?cachebust=1.4.0" type="text/css">
19
+
20
+ <link rel="stylesheet" href="../../main.css?cachebust=1.4.0" type="text/css">
21
+
22
+ <link rel="stylesheet" href="../../themes/mandelbrot/css/highlight.css?cachebust=1.4.0" type="text/css">
23
+
24
+
25
+ <title>Msds Text Dark Blue | Milestone Web Design System</title>
26
+
27
+ </head>
28
+ <body>
29
+
30
+
31
+
32
+ <div class="Frame" id="frame">
33
+
34
+ <div class="Frame-header">
35
+ <div class="Header">
36
+ <link href="https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600,600i,700,700i,800,800i&display=swap" rel="stylesheet">
37
+ <button class="Header-button Header-navToggle" data-action="toggle-sidebar">
38
+ <svg class="Header-navToggleIcon Header-navToggleIcon--open" height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg">
39
+ <path d="M0 0h24v24H0z" fill="none"></path>
40
+ <path d="M19 6.4L17.6 5 12 10.6 6.4 5 5 6.4 10.6 12 5 17.6 6.4 19 12 13.4 17.6 19 19 17.6 13.4 12z"></path>
41
+ </svg>
42
+ <svg class="Header-navToggleIcon Header-navToggleIcon--closed" height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg">
43
+ <path d="M0 0h24v24H0z" fill="none"></path>
44
+ <path d="M3 18h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z"></path>
45
+ </svg>
46
+ </button>
47
+ <div class="flex-child-header-txt">
48
+ <a href="../../index.html" class="Header-title" data-pjax>
49
+ <img class="logo-test" src="../../src/demo-img/milestone-logo-white.png" alt="logo"></a>
50
+ </a>
51
+ <h6 class="header-txt ">Digital Design System</h6>
52
+ </div>
53
+ <div class="github-milestone-system">
54
+ <a class="github-milestonesys-design-system" href="https://github.com/milestone-sys/web-design-system" target="_blank">
55
+ <img class="git-icon" src="../../src/demo-img/giticon.png" alt="git icon"></a>
56
+ </a>
57
+ </div>
58
+ </div>
59
+ </div>
60
+
61
+ <div class="Frame-body" data-role="body">
62
+
63
+ <div class="Frame-panel Frame-panel--main" data-role="main">
64
+ <div class="Frame-inner" id="pjax-container">
65
+
66
+
67
+
68
+
69
+
70
+
71
+ <div class="Pen" data-behaviour="pen" id="pen-fb261da1ec565eb78338d050aaf62efc">
72
+
73
+
74
+
75
+ <div class="Pen-panel Pen-header">
76
+ <h1 class="Pen-title">
77
+ <a class="Pen-previewLink" href="../preview/msds-text-dark-blue.html" title="Component preview">
78
+ Msds Text Dark Blue
79
+ <svg fill="#000000" height="22" viewBox="0 0 24 24" width="22" xmlns="http://www.w3.org/2000/svg">
80
+ <path d="M0 0h24v24H0z" fill="none"/>
81
+ <path d="M19 4H5c-1.11 0-2 .9-2 2v12c0 1.1.89 2 2 2h4v-2H5V8h14v10h-4v2h4c1.1 0 2-.9 2-2V6c0-1.1-.89-2-2-2zm-7 6l-4 4h3v6h2v-6h3l-4-4z"/>
82
+ </svg>
83
+
84
+ </a>
85
+ </h1>
86
+
87
+
88
+ <div class="Status Status--tag">
89
+
90
+ <label class="Status-label" style="background-color: #29CC29; border-color: #29CC29;">Ready</label>
91
+
92
+ </div>
93
+
94
+
95
+ </div>
96
+
97
+
98
+ <div class="Pen-panel Pen-preview Preview" data-behaviour="preview" id="preview-fb261da1ec565eb78338d050aaf62efc">
99
+ <div class="Preview-wrapper" data-role="resizer">
100
+ <div class="Preview-resizer">
101
+
102
+ <iframe
103
+ class="Preview-iframe"
104
+ data-role="window"
105
+ src="../preview/msds-text-dark-blue.html"
106
+ style=""
107
+ marginwidth="0" marginheight="0" frameborder="0" vspace="0" hspace="0" scrolling="yes">
108
+ </iframe>
109
+ </div>
110
+ <div class="Preview-handle" data-role="resize-handle"></div>
111
+ <div class="Preview-overlay"></div>
112
+ </div>
113
+ </div>
114
+
115
+
116
+ <div class="Pen-handle Pen-handle--browser" data-role="resize-handle"></div>
117
+
118
+ <div class="Pen-panel Pen-info" data-role="info">
119
+ <div class="Browser" data-behaviour="browser" id="browser-fb261da1ec565eb78338d050aaf62efc">
120
+
121
+
122
+
123
+ <div class="Browser-controls">
124
+ <ul class="Browser-tabs">
125
+
126
+
127
+ <li class="Browser-tab Browser-tab--html is-active " data-role="tab">
128
+ <a href="#browser-fb261da1ec565eb78338d050aaf62efc-panel-html">HTML</a>
129
+ </li>
130
+
131
+
132
+
133
+ <li class="Browser-tab Browser-tab--view" data-role="tab">
134
+ <a href="#browser-fb261da1ec565eb78338d050aaf62efc-panel-view">View</a>
135
+ </li>
136
+
137
+
138
+
139
+ <li class="Browser-tab Browser-tab--context" data-role="tab">
140
+ <a href="#browser-fb261da1ec565eb78338d050aaf62efc-panel-context">Context</a>
141
+ </li>
142
+
143
+
144
+
145
+ <li class="Browser-tab Browser-tab--info" data-role="tab">
146
+ <a href="#browser-fb261da1ec565eb78338d050aaf62efc-panel-info">Info</a>
147
+ </li>
148
+
149
+
150
+
151
+ <li class="Browser-tab Browser-tab--notes" data-role="tab">
152
+ <a href="#browser-fb261da1ec565eb78338d050aaf62efc-panel-notes">Notes</a>
153
+ </li>
154
+
155
+
156
+ </ul>
157
+ </div>
158
+
159
+
160
+
161
+
162
+ <div class="Browser-panel Browser-code is-active" data-role="tab-panel" id="browser-fb261da1ec565eb78338d050aaf62efc-panel-html">
163
+ <code class="Code Code--lang-html hljs">
164
+
165
+ <pre><span class="hljs-tag">&lt;<span class="hljs-name">div</span> <span class="hljs-attr">class</span>=<span class="hljs-string">"msds-text-display-3 msds-text-dark-blue"</span>&gt;</span>msds-text-dark-blue<span class="hljs-tag">&lt;/<span class="hljs-name">div</span>&gt;</span></pre>
166
+
167
+ </code>
168
+ </div>
169
+
170
+
171
+ <div class="Browser-panel Browser-code" data-role="tab-panel" id="browser-fb261da1ec565eb78338d050aaf62efc-panel-view">
172
+ <code class="Code Code--lang-handlebars hljs">
173
+ <pre><span class="xml"><span class="hljs-tag">&lt;<span class="hljs-name">div</span> <span class="hljs-attr">class</span>=<span class="hljs-string">"msds-text-display-3 msds-text-dark-blue"</span>&gt;</span>msds-text-dark-blue<span class="hljs-tag">&lt;/<span class="hljs-name">div</span>&gt;</span></span></pre>
174
+ </code>
175
+ </div>
176
+
177
+
178
+ <div class="Browser-panel Browser-code" data-role="tab-panel" id="browser-fb261da1ec565eb78338d050aaf62efc-panel-context">
179
+ <code class="Code Code--lang-json hljs">
180
+
181
+
182
+ <pre>{
183
+ <span class="hljs-attr">"previewCss"</span>: <span class="hljs-string">"\n .color-square{\n width: 170px; \n height: 130px; \n margin: 10px;\n display: flex;\n justify-content: center;\n align-items: center; \n text-transform: uppercase;\n padding: 10px;\n font-weight: bold;\n text-align: center;\n flex-direction: column;\n } \n .color-container{display: flex; flex-wrap: wrap}\n .variable-name{\n font-size: 14px;\n text-transform: initial;\n font-weight: normal;\n margin-top: 10px;\n }"</span>,
184
+ <span class="hljs-attr">"primaryColors"</span>: [
185
+ {
186
+ <span class="hljs-attr">"textColor"</span>: <span class="hljs-string">"msds-text-white"</span>,
187
+ <span class="hljs-attr">"text"</span>: <span class="hljs-string">"Milestone clear blue"</span>,
188
+ <span class="hljs-attr">"backgroundColor"</span>: <span class="hljs-string">"msds-bg-clear-blue"</span>,
189
+ <span class="hljs-attr">"scssVarName"</span>: <span class="hljs-string">"$clear-blue"</span>
190
+ },
191
+ {
192
+ <span class="hljs-attr">"textColor"</span>: <span class="hljs-string">"msds-text-white"</span>,
193
+ <span class="hljs-attr">"text"</span>: <span class="hljs-string">"Milestone dark blue"</span>,
194
+ <span class="hljs-attr">"backgroundColor"</span>: <span class="hljs-string">"msds-bg-dark-blue"</span>,
195
+ <span class="hljs-attr">"scssVarName"</span>: <span class="hljs-string">"$dark-blue"</span>
196
+ },
197
+ {
198
+ <span class="hljs-attr">"textColor"</span>: <span class="hljs-string">"msds-text-black"</span>,
199
+ <span class="hljs-attr">"text"</span>: <span class="hljs-string">"Milestone yellow"</span>,
200
+ <span class="hljs-attr">"backgroundColor"</span>: <span class="hljs-string">"msds-bg-yellow"</span>,
201
+ <span class="hljs-attr">"scssVarName"</span>: <span class="hljs-string">"$yellow"</span>
202
+ }
203
+ ],
204
+ <span class="hljs-attr">"grayWhiteBlack"</span>: [
205
+ {
206
+ <span class="hljs-attr">"textColor"</span>: <span class="hljs-string">"msds-text-black"</span>,
207
+ <span class="hljs-attr">"text"</span>: <span class="hljs-string">"gray 1"</span>,
208
+ <span class="hljs-attr">"backgroundColor"</span>: <span class="hljs-string">"msds-bg-gray-1"</span>,
209
+ <span class="hljs-attr">"scssVarName"</span>: <span class="hljs-string">"$gray-1"</span>
210
+ },
211
+ {
212
+ <span class="hljs-attr">"textColor"</span>: <span class="hljs-string">"msds-text-black"</span>,
213
+ <span class="hljs-attr">"text"</span>: <span class="hljs-string">"gray 2"</span>,
214
+ <span class="hljs-attr">"backgroundColor"</span>: <span class="hljs-string">"msds-bg-gray-2"</span>,
215
+ <span class="hljs-attr">"scssVarName"</span>: <span class="hljs-string">"$gray-2"</span>
216
+ },
217
+ {
218
+ <span class="hljs-attr">"textColor"</span>: <span class="hljs-string">"msds-text-black"</span>,
219
+ <span class="hljs-attr">"text"</span>: <span class="hljs-string">"gray 3"</span>,
220
+ <span class="hljs-attr">"backgroundColor"</span>: <span class="hljs-string">"msds-bg-gray-3"</span>,
221
+ <span class="hljs-attr">"scssVarName"</span>: <span class="hljs-string">"$gray-3"</span>
222
+ },
223
+ {
224
+ <span class="hljs-attr">"textColor"</span>: <span class="hljs-string">"msds-text-black"</span>,
225
+ <span class="hljs-attr">"text"</span>: <span class="hljs-string">"gray 4"</span>,
226
+ <span class="hljs-attr">"backgroundColor"</span>: <span class="hljs-string">"msds-bg-gray-4"</span>,
227
+ <span class="hljs-attr">"scssVarName"</span>: <span class="hljs-string">"$gray-4"</span>
228
+ },
229
+ {
230
+ <span class="hljs-attr">"textColor"</span>: <span class="hljs-string">"msds-text-black"</span>,
231
+ <span class="hljs-attr">"text"</span>: <span class="hljs-string">"gray 5"</span>,
232
+ <span class="hljs-attr">"backgroundColor"</span>: <span class="hljs-string">"msds-bg-gray-5"</span>,
233
+ <span class="hljs-attr">"scssVarName"</span>: <span class="hljs-string">"$gray-5"</span>
234
+ },
235
+ {
236
+ <span class="hljs-attr">"textColor"</span>: <span class="hljs-string">"msds-text-black"</span>,
237
+ <span class="hljs-attr">"text"</span>: <span class="hljs-string">"gray 6"</span>,
238
+ <span class="hljs-attr">"backgroundColor"</span>: <span class="hljs-string">"msds-bg-gray-6"</span>,
239
+ <span class="hljs-attr">"scssVarName"</span>: <span class="hljs-string">"$gray-6"</span>
240
+ },
241
+ {
242
+ <span class="hljs-attr">"textColor"</span>: <span class="hljs-string">"msds-text-white"</span>,
243
+ <span class="hljs-attr">"text"</span>: <span class="hljs-string">"gray 7"</span>,
244
+ <span class="hljs-attr">"backgroundColor"</span>: <span class="hljs-string">"msds-bg-gray-7"</span>,
245
+ <span class="hljs-attr">"scssVarName"</span>: <span class="hljs-string">"$gray-7"</span>
246
+ },
247
+ {
248
+ <span class="hljs-attr">"textColor"</span>: <span class="hljs-string">"msds-text-white"</span>,
249
+ <span class="hljs-attr">"text"</span>: <span class="hljs-string">"gray 8"</span>,
250
+ <span class="hljs-attr">"backgroundColor"</span>: <span class="hljs-string">"msds-bg-gray-8"</span>,
251
+ <span class="hljs-attr">"scssVarName"</span>: <span class="hljs-string">"$gray-8"</span>
252
+ },
253
+ {
254
+ <span class="hljs-attr">"textColor"</span>: <span class="hljs-string">"msds-text-white"</span>,
255
+ <span class="hljs-attr">"text"</span>: <span class="hljs-string">"gray 9"</span>,
256
+ <span class="hljs-attr">"backgroundColor"</span>: <span class="hljs-string">"msds-bg-gray-9"</span>,
257
+ <span class="hljs-attr">"scssVarName"</span>: <span class="hljs-string">"$gray-9"</span>
258
+ },
259
+ {
260
+ <span class="hljs-attr">"textColor"</span>: <span class="hljs-string">"msds-text-white"</span>,
261
+ <span class="hljs-attr">"text"</span>: <span class="hljs-string">"gray 10"</span>,
262
+ <span class="hljs-attr">"backgroundColor"</span>: <span class="hljs-string">"msds-bg-gray-10"</span>,
263
+ <span class="hljs-attr">"scssVarName"</span>: <span class="hljs-string">"$gray-10"</span>
264
+ },
265
+ {
266
+ <span class="hljs-attr">"textColor"</span>: <span class="hljs-string">"msds-text-black"</span>,
267
+ <span class="hljs-attr">"text"</span>: <span class="hljs-string">"white"</span>,
268
+ <span class="hljs-attr">"backgroundColor"</span>: <span class="hljs-string">"msds-bg-white"</span>,
269
+ <span class="hljs-attr">"scssVarName"</span>: <span class="hljs-string">"$white"</span>
270
+ },
271
+ {
272
+ <span class="hljs-attr">"textColor"</span>: <span class="hljs-string">"msds-text-white"</span>,
273
+ <span class="hljs-attr">"text"</span>: <span class="hljs-string">"black"</span>,
274
+ <span class="hljs-attr">"backgroundColor"</span>: <span class="hljs-string">"msds-bg-black"</span>,
275
+ <span class="hljs-attr">"scssVarName"</span>: <span class="hljs-string">"$black"</span>
276
+ }
277
+ ],
278
+ <span class="hljs-attr">"altColors"</span>: [
279
+ {
280
+ <span class="hljs-attr">"textColor"</span>: <span class="hljs-string">"msds-text-white"</span>,
281
+ <span class="hljs-attr">"text"</span>: <span class="hljs-string">"Alt blue 1"</span>,
282
+ <span class="hljs-attr">"backgroundColor"</span>: <span class="hljs-string">"msds-bg-alt-blue-1"</span>,
283
+ <span class="hljs-attr">"scssVarName"</span>: <span class="hljs-string">"$alt-blue-1"</span>
284
+ },
285
+ {
286
+ <span class="hljs-attr">"textColor"</span>: <span class="hljs-string">"msds-text-white"</span>,
287
+ <span class="hljs-attr">"text"</span>: <span class="hljs-string">"alt blue 2"</span>,
288
+ <span class="hljs-attr">"backgroundColor"</span>: <span class="hljs-string">"msds-bg-alt-blue-2"</span>,
289
+ <span class="hljs-attr">"scssVarName"</span>: <span class="hljs-string">"$alt-blue-2"</span>
290
+ },
291
+ {
292
+ <span class="hljs-attr">"textColor"</span>: <span class="hljs-string">"msds-text-white"</span>,
293
+ <span class="hljs-attr">"text"</span>: <span class="hljs-string">"alt blue 3"</span>,
294
+ <span class="hljs-attr">"backgroundColor"</span>: <span class="hljs-string">"msds-bg-alt-blue-3"</span>,
295
+ <span class="hljs-attr">"scssVarName"</span>: <span class="hljs-string">"$alt-blue-3"</span>
296
+ },
297
+ {
298
+ <span class="hljs-attr">"textColor"</span>: <span class="hljs-string">"msds-text-black"</span>,
299
+ <span class="hljs-attr">"text"</span>: <span class="hljs-string">"alt yellow 1"</span>,
300
+ <span class="hljs-attr">"backgroundColor"</span>: <span class="hljs-string">"msds-bg-alt-yellow-1"</span>,
301
+ <span class="hljs-attr">"scssVarName"</span>: <span class="hljs-string">"$alt-yellow-1"</span>
302
+ },
303
+ {
304
+ <span class="hljs-attr">"textColor"</span>: <span class="hljs-string">"msds-text-black"</span>,
305
+ <span class="hljs-attr">"text"</span>: <span class="hljs-string">"alt yellow 2"</span>,
306
+ <span class="hljs-attr">"backgroundColor"</span>: <span class="hljs-string">"msds-bg-alt-yellow-2"</span>,
307
+ <span class="hljs-attr">"scssVarName"</span>: <span class="hljs-string">"$alt-yellow-2"</span>
308
+ },
309
+ {
310
+ <span class="hljs-attr">"textColor"</span>: <span class="hljs-string">"msds-text-white"</span>,
311
+ <span class="hljs-attr">"text"</span>: <span class="hljs-string">"confirm green"</span>,
312
+ <span class="hljs-attr">"backgroundColor"</span>: <span class="hljs-string">"msds-bg-confirm-green"</span>,
313
+ <span class="hljs-attr">"scssVarName"</span>: <span class="hljs-string">"$confirm-green"</span>
314
+ },
315
+ {
316
+ <span class="hljs-attr">"textColor"</span>: <span class="hljs-string">"msds-text-white"</span>,
317
+ <span class="hljs-attr">"text"</span>: <span class="hljs-string">"danger red 1"</span>,
318
+ <span class="hljs-attr">"backgroundColor"</span>: <span class="hljs-string">"msds-bg-danger-red-1"</span>,
319
+ <span class="hljs-attr">"scssVarName"</span>: <span class="hljs-string">"$danger-red-1"</span>
320
+ },
321
+ {
322
+ <span class="hljs-attr">"textColor"</span>: <span class="hljs-string">"msds-text-white"</span>,
323
+ <span class="hljs-attr">"text"</span>: <span class="hljs-string">"danger red 2"</span>,
324
+ <span class="hljs-attr">"backgroundColor"</span>: <span class="hljs-string">"msds-bg-danger-red-2"</span>,
325
+ <span class="hljs-attr">"scssVarName"</span>: <span class="hljs-string">"$danger-red-2"</span>
326
+ },
327
+ {
328
+ <span class="hljs-attr">"textColor"</span>: <span class="hljs-string">"msds-text-white"</span>,
329
+ <span class="hljs-attr">"text"</span>: <span class="hljs-string">"sand"</span>,
330
+ <span class="hljs-attr">"backgroundColor"</span>: <span class="hljs-string">"msds-bg-sand"</span>,
331
+ <span class="hljs-attr">"scssVarName"</span>: <span class="hljs-string">"$sand"</span>
332
+ }
333
+ ],
334
+ <span class="hljs-attr">"transparent"</span>: [
335
+ {
336
+ <span class="hljs-attr">"textColor"</span>: <span class="hljs-string">"msds-text-black"</span>,
337
+ <span class="hljs-attr">"text"</span>: <span class="hljs-string">"white 50%"</span>,
338
+ <span class="hljs-attr">"backgroundColor"</span>: <span class="hljs-string">"msds-white-50-transparent"</span>,
339
+ <span class="hljs-attr">"scssVarName"</span>: <span class="hljs-string">"$rgba-7"</span>
340
+ },
341
+ {
342
+ <span class="hljs-attr">"textColor"</span>: <span class="hljs-string">"msds-text-black"</span>,
343
+ <span class="hljs-attr">"text"</span>: <span class="hljs-string">"white 30%"</span>,
344
+ <span class="hljs-attr">"backgroundColor"</span>: <span class="hljs-string">"msds-white-30-transparent"</span>,
345
+ <span class="hljs-attr">"scssVarName"</span>: <span class="hljs-string">"$rgba-8"</span>
346
+ },
347
+ {
348
+ <span class="hljs-attr">"textColor"</span>: <span class="hljs-string">"msds-text-black"</span>,
349
+ <span class="hljs-attr">"text"</span>: <span class="hljs-string">"white 10%"</span>,
350
+ <span class="hljs-attr">"backgroundColor"</span>: <span class="hljs-string">"msds-white-10-transparent"</span>,
351
+ <span class="hljs-attr">"scssVarName"</span>: <span class="hljs-string">"$rgba-9"</span>
352
+ },
353
+ {
354
+ <span class="hljs-attr">"textColor"</span>: <span class="hljs-string">"msds-text-white"</span>,
355
+ <span class="hljs-attr">"text"</span>: <span class="hljs-string">"black 30%"</span>,
356
+ <span class="hljs-attr">"backgroundColor"</span>: <span class="hljs-string">"msds-black-30-transparent"</span>,
357
+ <span class="hljs-attr">"scssVarName"</span>: <span class="hljs-string">"$rgba-10"</span>
358
+ },
359
+ {
360
+ <span class="hljs-attr">"textColor"</span>: <span class="hljs-string">"msds-text-black"</span>,
361
+ <span class="hljs-attr">"text"</span>: <span class="hljs-string">"black 10%"</span>,
362
+ <span class="hljs-attr">"backgroundColor"</span>: <span class="hljs-string">"msds-black-10-transparent"</span>,
363
+ <span class="hljs-attr">"scssVarName"</span>: <span class="hljs-string">"$rgba-11"</span>
364
+ },
365
+ {
366
+ <span class="hljs-attr">"textColor"</span>: <span class="hljs-string">"msds-text-black"</span>,
367
+ <span class="hljs-attr">"text"</span>: <span class="hljs-string">"black 3%"</span>,
368
+ <span class="hljs-attr">"backgroundColor"</span>: <span class="hljs-string">"msds-black-3-transparent"</span>,
369
+ <span class="hljs-attr">"scssVarName"</span>: <span class="hljs-string">"$rgba-16"</span>
370
+ },
371
+ {
372
+ <span class="hljs-attr">"textColor"</span>: <span class="hljs-string">"msds-text-black"</span>,
373
+ <span class="hljs-attr">"text"</span>: <span class="hljs-string">"gray 6 50%"</span>,
374
+ <span class="hljs-attr">"backgroundColor"</span>: <span class="hljs-string">"msds-gray-6-50-transparent"</span>,
375
+ <span class="hljs-attr">"scssVarName"</span>: <span class="hljs-string">"$rgba-12"</span>
376
+ },
377
+ {
378
+ <span class="hljs-attr">"textColor"</span>: <span class="hljs-string">"msds-text-black"</span>,
379
+ <span class="hljs-attr">"text"</span>: <span class="hljs-string">"gray 7 50%"</span>,
380
+ <span class="hljs-attr">"backgroundColor"</span>: <span class="hljs-string">"msds-gray-7-50-transparent"</span>,
381
+ <span class="hljs-attr">"scssVarName"</span>: <span class="hljs-string">"$rgba-4"</span>
382
+ },
383
+ {
384
+ <span class="hljs-attr">"textColor"</span>: <span class="hljs-string">"msds-text-black"</span>,
385
+ <span class="hljs-attr">"text"</span>: <span class="hljs-string">"gray 8 50%"</span>,
386
+ <span class="hljs-attr">"backgroundColor"</span>: <span class="hljs-string">"msds-gray-8-50-transparent"</span>,
387
+ <span class="hljs-attr">"scssVarName"</span>: <span class="hljs-string">"$rgba-13"</span>
388
+ },
389
+ {
390
+ <span class="hljs-attr">"textColor"</span>: <span class="hljs-string">"msds-text-black"</span>,
391
+ <span class="hljs-attr">"text"</span>: <span class="hljs-string">"dark blue 12%"</span>,
392
+ <span class="hljs-attr">"backgroundColor"</span>: <span class="hljs-string">"msds-dark-blue-12-transparent"</span>,
393
+ <span class="hljs-attr">"scssVarName"</span>: <span class="hljs-string">"$rgba-2"</span>
394
+ },
395
+ {
396
+ <span class="hljs-attr">"textColor"</span>: <span class="hljs-string">"msds-text-black"</span>,
397
+ <span class="hljs-attr">"text"</span>: <span class="hljs-string">"dark blue 17%"</span>,
398
+ <span class="hljs-attr">"backgroundColor"</span>: <span class="hljs-string">"msds-dark-blue-17-transparent"</span>,
399
+ <span class="hljs-attr">"scssVarName"</span>: <span class="hljs-string">"$rgba-1"</span>
400
+ },
401
+ {
402
+ <span class="hljs-attr">"textColor"</span>: <span class="hljs-string">"msds-text-black"</span>,
403
+ <span class="hljs-attr">"text"</span>: <span class="hljs-string">"dark blue 30%"</span>,
404
+ <span class="hljs-attr">"backgroundColor"</span>: <span class="hljs-string">"msds-dark-blue-30-transparent"</span>,
405
+ <span class="hljs-attr">"scssVarName"</span>: <span class="hljs-string">"$rgba-6"</span>
406
+ },
407
+ {
408
+ <span class="hljs-attr">"textColor"</span>: <span class="hljs-string">"msds-text-white"</span>,
409
+ <span class="hljs-attr">"text"</span>: <span class="hljs-string">"danger red 50%"</span>,
410
+ <span class="hljs-attr">"backgroundColor"</span>: <span class="hljs-string">"msds-danger-red-50-transparent"</span>,
411
+ <span class="hljs-attr">"scssVarName"</span>: <span class="hljs-string">"$rgba-5"</span>
412
+ },
413
+ {
414
+ <span class="hljs-attr">"textColor"</span>: <span class="hljs-string">"msds-text-white"</span>,
415
+ <span class="hljs-attr">"text"</span>: <span class="hljs-string">"clear blue 50%"</span>,
416
+ <span class="hljs-attr">"backgroundColor"</span>: <span class="hljs-string">"msds-clear-blue-50-transparent"</span>,
417
+ <span class="hljs-attr">"scssVarName"</span>: <span class="hljs-string">"$rgba-3"</span>
418
+ }
419
+ ],
420
+ <span class="hljs-attr">"gradients"</span>: [
421
+ {
422
+ <span class="hljs-attr">"textColor"</span>: <span class="hljs-string">"msds-text-white"</span>,
423
+ <span class="hljs-attr">"text"</span>: <span class="hljs-string">"clear blue gradient"</span>,
424
+ <span class="hljs-attr">"backgroundColor"</span>: <span class="hljs-string">"msds-bg-clear-blue-gradient"</span>,
425
+ <span class="hljs-attr">"scssVarName"</span>: <span class="hljs-string">"$clear-blue-gradient"</span>
426
+ },
427
+ {
428
+ <span class="hljs-attr">"textColor"</span>: <span class="hljs-string">"msds-text-white"</span>,
429
+ <span class="hljs-attr">"text"</span>: <span class="hljs-string">"clear blue gradient reverse"</span>,
430
+ <span class="hljs-attr">"backgroundColor"</span>: <span class="hljs-string">"msds-bg-clear-blue-gradient-reverse"</span>,
431
+ <span class="hljs-attr">"scssVarName"</span>: <span class="hljs-string">"$clear-blue-gradient-reverse"</span>
432
+ },
433
+ {
434
+ <span class="hljs-attr">"textColor"</span>: <span class="hljs-string">"msds-text-white"</span>,
435
+ <span class="hljs-attr">"text"</span>: <span class="hljs-string">"dark blue gradient"</span>,
436
+ <span class="hljs-attr">"backgroundColor"</span>: <span class="hljs-string">"msds-bg-dark-blue-gradient"</span>,
437
+ <span class="hljs-attr">"scssVarName"</span>: <span class="hljs-string">"$dark-blue-gradient"</span>
438
+ },
439
+ {
440
+ <span class="hljs-attr">"textColor"</span>: <span class="hljs-string">"msds-text-white"</span>,
441
+ <span class="hljs-attr">"text"</span>: <span class="hljs-string">"dark blue gradient reverse"</span>,
442
+ <span class="hljs-attr">"backgroundColor"</span>: <span class="hljs-string">"msds-bg-dark-blue-gradient-reverse"</span>,
443
+ <span class="hljs-attr">"scssVarName"</span>: <span class="hljs-string">"$dark-blue-gradient-reverse"</span>
444
+ },
445
+ {
446
+ <span class="hljs-attr">"textColor"</span>: <span class="hljs-string">"msds-text-white"</span>,
447
+ <span class="hljs-attr">"text"</span>: <span class="hljs-string">"dark blue gradient"</span>,
448
+ <span class="hljs-attr">"backgroundColor"</span>: <span class="hljs-string">"msds-bg-dark-blue-gradient"</span>,
449
+ <span class="hljs-attr">"scssVarName"</span>: <span class="hljs-string">"$dark-blue-gradient"</span>
450
+ },
451
+ {
452
+ <span class="hljs-attr">"textColor"</span>: <span class="hljs-string">"msds-text-white"</span>,
453
+ <span class="hljs-attr">"text"</span>: <span class="hljs-string">"mixed blue gradient"</span>,
454
+ <span class="hljs-attr">"backgroundColor"</span>: <span class="hljs-string">"msds-bg-mixed-blue-gradient"</span>,
455
+ <span class="hljs-attr">"scssVarName"</span>: <span class="hljs-string">"$mixed-blue-gradient"</span>
456
+ },
457
+ {
458
+ <span class="hljs-attr">"textColor"</span>: <span class="hljs-string">"msds-text-white"</span>,
459
+ <span class="hljs-attr">"text"</span>: <span class="hljs-string">"mixed blue gradient reverse"</span>,
460
+ <span class="hljs-attr">"backgroundColor"</span>: <span class="hljs-string">"msds-bg-mixed-blue-gradient-reverse"</span>,
461
+ <span class="hljs-attr">"scssVarName"</span>: <span class="hljs-string">"$mixed-blue-gradient-reverse"</span>
462
+ },
463
+ {
464
+ <span class="hljs-attr">"textColor"</span>: <span class="hljs-string">"msds-text-black"</span>,
465
+ <span class="hljs-attr">"text"</span>: <span class="hljs-string">"yellow gradient"</span>,
466
+ <span class="hljs-attr">"backgroundColor"</span>: <span class="hljs-string">"msds-bg-yellow-gradient"</span>,
467
+ <span class="hljs-attr">"scssVarName"</span>: <span class="hljs-string">"$yellow-gradient"</span>
468
+ },
469
+ {
470
+ <span class="hljs-attr">"textColor"</span>: <span class="hljs-string">"msds-text-black"</span>,
471
+ <span class="hljs-attr">"text"</span>: <span class="hljs-string">"gray gradient 1"</span>,
472
+ <span class="hljs-attr">"backgroundColor"</span>: <span class="hljs-string">"msds-bg-gray-gradient-1"</span>,
473
+ <span class="hljs-attr">"scssVarName"</span>: <span class="hljs-string">"$gray-gradient-1"</span>
474
+ },
475
+ {
476
+ <span class="hljs-attr">"textColor"</span>: <span class="hljs-string">"msds-text-black"</span>,
477
+ <span class="hljs-attr">"text"</span>: <span class="hljs-string">"gray gradient 2"</span>,
478
+ <span class="hljs-attr">"backgroundColor"</span>: <span class="hljs-string">"msds-bg-gray-gradient-2"</span>,
479
+ <span class="hljs-attr">"scssVarName"</span>: <span class="hljs-string">"$gray-gradient-2"</span>
480
+ },
481
+ {
482
+ <span class="hljs-attr">"textColor"</span>: <span class="hljs-string">"msds-text-black"</span>,
483
+ <span class="hljs-attr">"text"</span>: <span class="hljs-string">"gray gradient 3"</span>,
484
+ <span class="hljs-attr">"backgroundColor"</span>: <span class="hljs-string">"msds-bg-gray-gradient-3"</span>,
485
+ <span class="hljs-attr">"scssVarName"</span>: <span class="hljs-string">"$gray-gradient-3"</span>
486
+ },
487
+ {
488
+ <span class="hljs-attr">"textColor"</span>: <span class="hljs-string">"msds-text-black"</span>,
489
+ <span class="hljs-attr">"text"</span>: <span class="hljs-string">"gray gradient 4"</span>,
490
+ <span class="hljs-attr">"backgroundColor"</span>: <span class="hljs-string">"msds-bg-gray-gradient-4"</span>,
491
+ <span class="hljs-attr">"scssVarName"</span>: <span class="hljs-string">"$gray-gradient-4"</span>
492
+ },
493
+ {
494
+ <span class="hljs-attr">"textColor"</span>: <span class="hljs-string">"msds-text-black"</span>,
495
+ <span class="hljs-attr">"text"</span>: <span class="hljs-string">"gray gradient 5"</span>,
496
+ <span class="hljs-attr">"backgroundColor"</span>: <span class="hljs-string">"msds-bg-gray-gradient-5"</span>,
497
+ <span class="hljs-attr">"scssVarName"</span>: <span class="hljs-string">"$gray-gradient-5"</span>
498
+ }
499
+ ],
500
+ <span class="hljs-attr">"shadows"</span>: [
501
+ {
502
+ <span class="hljs-attr">"textColor"</span>: <span class="hljs-string">"msds-text-black"</span>,
503
+ <span class="hljs-attr">"text"</span>: <span class="hljs-string">"shadow small"</span>,
504
+ <span class="hljs-attr">"shadow"</span>: <span class="hljs-string">"msds-shadow-small"</span>,
505
+ <span class="hljs-attr">"scssVarName"</span>: <span class="hljs-string">"$shadow-small"</span>
506
+ },
507
+ {
508
+ <span class="hljs-attr">"textColor"</span>: <span class="hljs-string">"msds-text-black"</span>,
509
+ <span class="hljs-attr">"text"</span>: <span class="hljs-string">"shadow medium"</span>,
510
+ <span class="hljs-attr">"shadow"</span>: <span class="hljs-string">"msds-shadow-medium"</span>,
511
+ <span class="hljs-attr">"scssVarName"</span>: <span class="hljs-string">"$shadow-medium"</span>
512
+ },
513
+ {
514
+ <span class="hljs-attr">"textColor"</span>: <span class="hljs-string">"msds-text-black"</span>,
515
+ <span class="hljs-attr">"text"</span>: <span class="hljs-string">"shadow large"</span>,
516
+ <span class="hljs-attr">"shadow"</span>: <span class="hljs-string">"msds-shadow-large"</span>,
517
+ <span class="hljs-attr">"scssVarName"</span>: <span class="hljs-string">"$shadow-large"</span>
518
+ }
519
+ ]
520
+ }</pre>
521
+
522
+
523
+ </code>
524
+ </div>
525
+
526
+
527
+ <div class="Browser-panel" data-role="tab-panel" id="browser-fb261da1ec565eb78338d050aaf62efc-panel-info">
528
+ <ul class="Meta">
529
+ <li class="Meta-item">
530
+ <strong class="Meta-key">Handle:</strong>
531
+ <span class="Meta-value">@msds-text-dark-blue</span>
532
+ </li>
533
+
534
+
535
+
536
+
537
+
538
+ <li class="Meta-item">
539
+ <strong class="Meta-key">Preview:</strong>
540
+ <span class="Meta-value">
541
+ <ul>
542
+ <li><a data-no-pjax href="../preview/msds-text-dark-blue.html"><span>With layout</span> <svg fill="#000000" height="22" viewBox="0 0 24 24" width="22" xmlns="http://www.w3.org/2000/svg">
543
+ <path d="M0 0h24v24H0z" fill="none"/>
544
+ <path d="M19 4H5c-1.11 0-2 .9-2 2v12c0 1.1.89 2 2 2h4v-2H5V8h14v10h-4v2h4c1.1 0 2-.9 2-2V6c0-1.1-.89-2-2-2zm-7 6l-4 4h3v6h2v-6h3l-4-4z"/>
545
+ </svg>
546
+ </a></li>
547
+ <li><a data-no-pjax href="../render/msds-text-dark-blue.html"><span>Component only</span> <svg fill="#000000" height="22" viewBox="0 0 24 24" width="22" xmlns="http://www.w3.org/2000/svg">
548
+ <path d="M0 0h24v24H0z" fill="none"/>
549
+ <path d="M19 4H5c-1.11 0-2 .9-2 2v12c0 1.1.89 2 2 2h4v-2H5V8h14v10h-4v2h4c1.1 0 2-.9 2-2V6c0-1.1-.89-2-2-2zm-7 6l-4 4h3v6h2v-6h3l-4-4z"/>
550
+ </svg>
551
+ </a></li>
552
+ </ul>
553
+ </span>
554
+ </li>
555
+ <li class="Meta-item">
556
+ <strong class="Meta-key">Filesystem Path:</strong>
557
+ <span class="Meta-value">components\_colors\font-colors\msds-text-dark-blue.hbs</span>
558
+ </li>
559
+
560
+
561
+ </ul>
562
+ </div>
563
+
564
+
565
+ <div class="Browser-panel Browser-notes" data-role="tab-panel" id="browser-fb261da1ec565eb78338d050aaf62efc-panel-notes">
566
+ <div class="Prose Prose--condensed">
567
+
568
+ <p class="Browser-isEmptyNote">There are no notes for this item.</p>
569
+
570
+ </div>
571
+ </div>
572
+
573
+
574
+
575
+ </div>
576
+
577
+ </div>
578
+
579
+
580
+
581
+
582
+ </div>
583
+
584
+
585
+ </div>
586
+ </div>
587
+
588
+ <div class="Frame-handle" data-role="frame-resize-handle"></div>
589
+
590
+ <div class="Frame-panel Frame-panel--sidebar" data-role="sidebar">
591
+ <nav class="Navigation">
592
+
593
+
594
+ <div class="Navigation-group">
595
+
596
+ <div class="Tree" data-behaviour="tree" id="tree-components">
597
+ <div class="Tree-header">
598
+ <h3 class="Tree-title">components</h3>
599
+
600
+ <button type="button" data-behaviour="collapse-tree" class="Tree-collapse" title="Collapse tree" aria-label="Collapse tree" hidden>
601
+ <svg width="24" height="24" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="m9 11c-.6 0-1 .4-1 1s.4 1 1 1h6c.6 0 1-.4 1-1s-.4-1-1-1z"/><path d="m19 21h-14c-1.1 0-2-.9-2-2v-14c0-1.1.9-2 2-2h14c1.1 0 2 .9 2 2v14c0 1.1-.9 2-2 2zm-14-16v14h14v-14z"/></svg>
602
+
603
+ </button>
604
+ </div>
605
+ <ul class="Tree-items Tree-depth-1">
606
+
607
+
608
+
609
+
610
+ <li class="Tree-item Tree-entity" data-role="item">
611
+ <a class="Tree-entityLink" href="tab-tile.html" data-pjax>
612
+ <span>Tab Tile</span>
613
+
614
+
615
+ <div class="Status Status--unlabelled">
616
+
617
+ <div class="Status-dots">
618
+
619
+
620
+ <span class="Status-dot" style="border-color: #FF9233;" title="WIP"></span>
621
+
622
+
623
+ </div>
624
+
625
+ </div>
626
+
627
+
628
+ </a>
629
+ </li>
630
+
631
+
632
+
633
+ </ul>
634
+ </div>
635
+
636
+ </div>
637
+
638
+
639
+
640
+
641
+ <div class="Navigation-group">
642
+
643
+ <div class="Tree" data-behaviour="tree" id="tree-docs">
644
+ <div class="Tree-header">
645
+ <h3 class="Tree-title">documentation</h3>
646
+
647
+ <button type="button" data-behaviour="collapse-tree" class="Tree-collapse" title="Collapse tree" aria-label="Collapse tree" hidden>
648
+ <svg width="24" height="24" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="m9 11c-.6 0-1 .4-1 1s.4 1 1 1h6c.6 0 1-.4 1-1s-.4-1-1-1z"/><path d="m19 21h-14c-1.1 0-2-.9-2-2v-14c0-1.1.9-2 2-2h14c1.1 0 2 .9 2 2v14c0 1.1-.9 2-2 2zm-14-16v14h14v-14z"/></svg>
649
+
650
+ </button>
651
+ </div>
652
+ <ul class="Tree-items Tree-depth-1">
653
+
654
+
655
+
656
+
657
+ <li class="Tree-item Tree-entity" data-role="item">
658
+ <a class="Tree-entityLink" href="../../index.html" data-pjax>
659
+ <span>Overview</span>
660
+
661
+ </a>
662
+ </li>
663
+
664
+
665
+
666
+ <li class="Tree-item Tree-collection Tree-depth-2" data-behaviour="collection" id="tree-docs-collection-content">
667
+ <button class="Tree-collectionLabel" data-role="toggle" aria-expanded="true" aria-controls="tree-docs-collection-content-items">
668
+ Content
669
+ </button>
670
+ <ul class="Tree-collectionItems" data-role="items" id="tree-docs-collection-content-items">
671
+
672
+
673
+
674
+
675
+
676
+
677
+ <li class="Tree-item Tree-collection Tree-depth-3" data-behaviour="collection" id="tree-docs-collection-icons">
678
+ <button class="Tree-collectionLabel" data-role="toggle" aria-expanded="true" aria-controls="tree-docs-collection-icons-items">
679
+ Icons
680
+ </button>
681
+ <ul class="Tree-collectionItems" data-role="items" id="tree-docs-collection-icons-items">
682
+
683
+
684
+
685
+
686
+
687
+
688
+
689
+ <li class="Tree-item Tree-entity" data-role="item">
690
+ <a class="Tree-entityLink" href="../../docs/content/icons/-overview.html" data-pjax>
691
+ <span>Overview</span>
692
+
693
+ </a>
694
+ </li>
695
+
696
+
697
+
698
+
699
+ <li class="Tree-item Tree-entity" data-role="item">
700
+ <a class="Tree-entityLink" href="../../docs/content/icons/icons-flat.html" data-pjax>
701
+ <span>Icons Flat</span>
702
+
703
+ </a>
704
+ </li>
705
+
706
+
707
+
708
+
709
+ <li class="Tree-item Tree-entity" data-role="item">
710
+ <a class="Tree-entityLink" href="../../docs/content/icons/icons-rich.html" data-pjax>
711
+ <span>Icons Rich</span>
712
+
713
+ </a>
714
+ </li>
715
+
716
+
717
+
718
+ </ul>
719
+ </li>
720
+
721
+
722
+
723
+ <li class="Tree-item Tree-collection Tree-depth-3" data-behaviour="collection" id="tree-docs-collection-typography">
724
+ <button class="Tree-collectionLabel" data-role="toggle" aria-expanded="true" aria-controls="tree-docs-collection-typography-items">
725
+ Typography
726
+ </button>
727
+ <ul class="Tree-collectionItems" data-role="items" id="tree-docs-collection-typography-items">
728
+
729
+
730
+
731
+
732
+
733
+
734
+
735
+ <li class="Tree-item Tree-entity" data-role="item">
736
+ <a class="Tree-entityLink" href="../../docs/content/typography/-overview.html" data-pjax>
737
+ <span>Overview</span>
738
+
739
+ </a>
740
+ </li>
741
+
742
+
743
+
744
+
745
+ <li class="Tree-item Tree-entity" data-role="item">
746
+ <a class="Tree-entityLink" href="../../docs/content/typography/font-colors.html" data-pjax>
747
+ <span>Font Colors</span>
748
+
749
+ </a>
750
+ </li>
751
+
752
+
753
+
754
+
755
+ <li class="Tree-item Tree-entity" data-role="item">
756
+ <a class="Tree-entityLink" href="../../docs/content/typography/links.html" data-pjax>
757
+ <span>Links</span>
758
+
759
+ </a>
760
+ </li>
761
+
762
+
763
+
764
+
765
+ <li class="Tree-item Tree-entity" data-role="item">
766
+ <a class="Tree-entityLink" href="../../docs/content/typography/lists.html" data-pjax>
767
+ <span>Lists</span>
768
+
769
+ </a>
770
+ </li>
771
+
772
+
773
+
774
+
775
+ <li class="Tree-item Tree-entity" data-role="item">
776
+ <a class="Tree-entityLink" href="../../docs/content/typography/text.html" data-pjax>
777
+ <span>Text</span>
778
+
779
+ </a>
780
+ </li>
781
+
782
+
783
+
784
+ </ul>
785
+ </li>
786
+
787
+
788
+
789
+ </ul>
790
+ </li>
791
+
792
+
793
+
794
+ <li class="Tree-item Tree-collection Tree-depth-2" data-behaviour="collection" id="tree-docs-collection-component-documentation">
795
+ <button class="Tree-collectionLabel" data-role="toggle" aria-expanded="true" aria-controls="tree-docs-collection-component-documentation-items">
796
+ Component Documentation
797
+ </button>
798
+ <ul class="Tree-collectionItems" data-role="items" id="tree-docs-collection-component-documentation-items">
799
+
800
+
801
+
802
+
803
+
804
+
805
+
806
+ <li class="Tree-item Tree-entity" data-role="item">
807
+ <a class="Tree-entityLink" href="../../docs/component-documentation/alerts.html" data-pjax>
808
+ <span>Alerts</span>
809
+
810
+ </a>
811
+ </li>
812
+
813
+
814
+
815
+ <li class="Tree-item Tree-collection Tree-depth-3" data-behaviour="collection" id="tree-docs-collection-buttons">
816
+ <button class="Tree-collectionLabel" data-role="toggle" aria-expanded="true" aria-controls="tree-docs-collection-buttons-items">
817
+ Buttons
818
+ </button>
819
+ <ul class="Tree-collectionItems" data-role="items" id="tree-docs-collection-buttons-items">
820
+
821
+
822
+
823
+
824
+
825
+
826
+
827
+ <li class="Tree-item Tree-entity" data-role="item">
828
+ <a class="Tree-entityLink" href="../../docs/component-documentation/buttons/buttons.html" data-pjax>
829
+ <span>Buttons</span>
830
+
831
+ </a>
832
+ </li>
833
+
834
+
835
+
836
+
837
+ <li class="Tree-item Tree-entity" data-role="item">
838
+ <a class="Tree-entityLink" href="../../docs/component-documentation/buttons/buttons-floating.html" data-pjax>
839
+ <span>Buttons Floating</span>
840
+
841
+ </a>
842
+ </li>
843
+
844
+
845
+
846
+ </ul>
847
+ </li>
848
+
849
+
850
+
851
+ <li class="Tree-item Tree-collection Tree-depth-3" data-behaviour="collection" id="tree-docs-collection-cards">
852
+ <button class="Tree-collectionLabel" data-role="toggle" aria-expanded="true" aria-controls="tree-docs-collection-cards-items">
853
+ Cards
854
+ </button>
855
+ <ul class="Tree-collectionItems" data-role="items" id="tree-docs-collection-cards-items">
856
+
857
+
858
+
859
+
860
+
861
+
862
+
863
+ <li class="Tree-item Tree-entity" data-role="item">
864
+ <a class="Tree-entityLink" href="../../docs/component-documentation/cards/basic-cards.html" data-pjax>
865
+ <span>Basic Cards</span>
866
+
867
+ </a>
868
+ </li>
869
+
870
+
871
+
872
+
873
+ <li class="Tree-item Tree-entity" data-role="item">
874
+ <a class="Tree-entityLink" href="../../docs/component-documentation/cards/category-cards.html" data-pjax>
875
+ <span>Category Cards</span>
876
+
877
+ </a>
878
+ </li>
879
+
880
+
881
+
882
+
883
+ <li class="Tree-item Tree-entity" data-role="item">
884
+ <a class="Tree-entityLink" href="../../docs/component-documentation/cards/contact-cards.html" data-pjax>
885
+ <span>Contact Cards</span>
886
+
887
+ </a>
888
+ </li>
889
+
890
+
891
+
892
+
893
+ <li class="Tree-item Tree-entity" data-role="item">
894
+ <a class="Tree-entityLink" href="../../docs/component-documentation/cards/generic-cards.html" data-pjax>
895
+ <span>Generic Cards</span>
896
+
897
+ </a>
898
+ </li>
899
+
900
+
901
+
902
+
903
+ <li class="Tree-item Tree-entity" data-role="item">
904
+ <a class="Tree-entityLink" href="../../docs/component-documentation/cards/solution-cards.html" data-pjax>
905
+ <span>Solution Cards</span>
906
+
907
+ </a>
908
+ </li>
909
+
910
+
911
+
912
+ </ul>
913
+ </li>
914
+
915
+
916
+
917
+ <li class="Tree-item Tree-collection Tree-depth-3" data-behaviour="collection" id="tree-docs-collection-dividers">
918
+ <button class="Tree-collectionLabel" data-role="toggle" aria-expanded="true" aria-controls="tree-docs-collection-dividers-items">
919
+ Dividers
920
+ </button>
921
+ <ul class="Tree-collectionItems" data-role="items" id="tree-docs-collection-dividers-items">
922
+
923
+
924
+
925
+
926
+
927
+
928
+
929
+ <li class="Tree-item Tree-entity" data-role="item">
930
+ <a class="Tree-entityLink" href="../../docs/component-documentation/dividers/dividers.html" data-pjax>
931
+ <span>Dividers</span>
932
+
933
+ </a>
934
+ </li>
935
+
936
+
937
+
938
+ </ul>
939
+ </li>
940
+
941
+
942
+
943
+ <li class="Tree-item Tree-collection Tree-depth-3" data-behaviour="collection" id="tree-docs-collection-expanding-components">
944
+ <button class="Tree-collectionLabel" data-role="toggle" aria-expanded="true" aria-controls="tree-docs-collection-expanding-components-items">
945
+ Expanding Components
946
+ </button>
947
+ <ul class="Tree-collectionItems" data-role="items" id="tree-docs-collection-expanding-components-items">
948
+
949
+
950
+
951
+
952
+
953
+
954
+
955
+ <li class="Tree-item Tree-entity" data-role="item">
956
+ <a class="Tree-entityLink" href="../../docs/component-documentation/expanding-components/accordion.html" data-pjax>
957
+ <span>Accordion</span>
958
+
959
+ </a>
960
+ </li>
961
+
962
+
963
+
964
+
965
+ <li class="Tree-item Tree-entity" data-role="item">
966
+ <a class="Tree-entityLink" href="../../docs/component-documentation/expanding-components/section.html" data-pjax>
967
+ <span>Section</span>
968
+
969
+ </a>
970
+ </li>
971
+
972
+
973
+
974
+ </ul>
975
+ </li>
976
+
977
+
978
+
979
+
980
+ <li class="Tree-item Tree-entity" data-role="item">
981
+ <a class="Tree-entityLink" href="../../docs/component-documentation/modal.html" data-pjax>
982
+ <span>Modal</span>
983
+
984
+ </a>
985
+ </li>
986
+
987
+
988
+
989
+ <li class="Tree-item Tree-collection Tree-depth-3" data-behaviour="collection" id="tree-docs-collection-popover">
990
+ <button class="Tree-collectionLabel" data-role="toggle" aria-expanded="true" aria-controls="tree-docs-collection-popover-items">
991
+ Popover
992
+ </button>
993
+ <ul class="Tree-collectionItems" data-role="items" id="tree-docs-collection-popover-items">
994
+
995
+
996
+
997
+
998
+
999
+
1000
+
1001
+ <li class="Tree-item Tree-entity" data-role="item">
1002
+ <a class="Tree-entityLink" href="../../docs/component-documentation/popover/popover.html" data-pjax>
1003
+ <span>Popover</span>
1004
+
1005
+ </a>
1006
+ </li>
1007
+
1008
+
1009
+
1010
+ </ul>
1011
+ </li>
1012
+
1013
+
1014
+
1015
+
1016
+ <li class="Tree-item Tree-entity" data-role="item">
1017
+ <a class="Tree-entityLink" href="../../docs/component-documentation/progress-bar.html" data-pjax>
1018
+ <span>Progress Bar</span>
1019
+
1020
+ </a>
1021
+ </li>
1022
+
1023
+
1024
+
1025
+
1026
+ <li class="Tree-item Tree-entity" data-role="item">
1027
+ <a class="Tree-entityLink" href="../../docs/component-documentation/spacing.html" data-pjax>
1028
+ <span>Spacing</span>
1029
+
1030
+ </a>
1031
+ </li>
1032
+
1033
+
1034
+
1035
+
1036
+ <li class="Tree-item Tree-entity" data-role="item">
1037
+ <a class="Tree-entityLink" href="../../docs/component-documentation/table.html" data-pjax>
1038
+ <span>Table</span>
1039
+
1040
+ </a>
1041
+ </li>
1042
+
1043
+
1044
+
1045
+ </ul>
1046
+ </li>
1047
+
1048
+
1049
+
1050
+ <li class="Tree-item Tree-collection Tree-depth-2" data-behaviour="collection" id="tree-docs-collection-forms">
1051
+ <button class="Tree-collectionLabel" data-role="toggle" aria-expanded="true" aria-controls="tree-docs-collection-forms-items">
1052
+ Forms
1053
+ </button>
1054
+ <ul class="Tree-collectionItems" data-role="items" id="tree-docs-collection-forms-items">
1055
+
1056
+
1057
+
1058
+
1059
+
1060
+
1061
+
1062
+ <li class="Tree-item Tree-entity" data-role="item">
1063
+ <a class="Tree-entityLink" href="../../docs/forms/-overview.html" data-pjax>
1064
+ <span>Overview</span>
1065
+
1066
+ </a>
1067
+ </li>
1068
+
1069
+
1070
+
1071
+
1072
+ <li class="Tree-item Tree-entity" data-role="item">
1073
+ <a class="Tree-entityLink" href="../../docs/forms/checkbox.html" data-pjax>
1074
+ <span>Checkbox</span>
1075
+
1076
+ </a>
1077
+ </li>
1078
+
1079
+
1080
+
1081
+
1082
+ <li class="Tree-item Tree-entity" data-role="item">
1083
+ <a class="Tree-entityLink" href="../../docs/forms/drop-down-list.html" data-pjax>
1084
+ <span>Drop Down List</span>
1085
+
1086
+ </a>
1087
+ </li>
1088
+
1089
+
1090
+
1091
+
1092
+ <li class="Tree-item Tree-entity" data-role="item">
1093
+ <a class="Tree-entityLink" href="../../docs/forms/input-field.html" data-pjax>
1094
+ <span>Input Field</span>
1095
+
1096
+ </a>
1097
+ </li>
1098
+
1099
+
1100
+
1101
+
1102
+ <li class="Tree-item Tree-entity" data-role="item">
1103
+ <a class="Tree-entityLink" href="../../docs/forms/radio-button.html" data-pjax>
1104
+ <span>Radio Button</span>
1105
+
1106
+ </a>
1107
+ </li>
1108
+
1109
+
1110
+
1111
+
1112
+ <li class="Tree-item Tree-entity" data-role="item">
1113
+ <a class="Tree-entityLink" href="../../docs/forms/switch.html" data-pjax>
1114
+ <span>Switch</span>
1115
+
1116
+ </a>
1117
+ </li>
1118
+
1119
+
1120
+
1121
+
1122
+ <li class="Tree-item Tree-entity" data-role="item">
1123
+ <a class="Tree-entityLink" href="../../docs/forms/text-area.html" data-pjax>
1124
+ <span>Text Area</span>
1125
+
1126
+ </a>
1127
+ </li>
1128
+
1129
+
1130
+
1131
+ </ul>
1132
+ </li>
1133
+
1134
+
1135
+
1136
+ <li class="Tree-item Tree-collection Tree-depth-2" data-behaviour="collection" id="tree-docs-collection-utilities">
1137
+ <button class="Tree-collectionLabel" data-role="toggle" aria-expanded="true" aria-controls="tree-docs-collection-utilities-items">
1138
+ Utilities
1139
+ </button>
1140
+ <ul class="Tree-collectionItems" data-role="items" id="tree-docs-collection-utilities-items">
1141
+
1142
+
1143
+
1144
+
1145
+
1146
+
1147
+ <li class="Tree-item Tree-collection Tree-depth-3" data-behaviour="collection" id="tree-docs-collection-colors">
1148
+ <button class="Tree-collectionLabel" data-role="toggle" aria-expanded="true" aria-controls="tree-docs-collection-colors-items">
1149
+ Colors
1150
+ </button>
1151
+ <ul class="Tree-collectionItems" data-role="items" id="tree-docs-collection-colors-items">
1152
+
1153
+
1154
+
1155
+
1156
+
1157
+
1158
+
1159
+ <li class="Tree-item Tree-entity" data-role="item">
1160
+ <a class="Tree-entityLink" href="../../docs/utilities/colors/overview.html" data-pjax>
1161
+ <span>Overview</span>
1162
+
1163
+ </a>
1164
+ </li>
1165
+
1166
+
1167
+
1168
+
1169
+ <li class="Tree-item Tree-entity" data-role="item">
1170
+ <a class="Tree-entityLink" href="../../docs/utilities/colors/font-colors.html" data-pjax>
1171
+ <span>Font Colors</span>
1172
+
1173
+ </a>
1174
+ </li>
1175
+
1176
+
1177
+
1178
+
1179
+ <li class="Tree-item Tree-entity" data-role="item">
1180
+ <a class="Tree-entityLink" href="../../docs/utilities/colors/background-colors.html" data-pjax>
1181
+ <span>Background Colors</span>
1182
+
1183
+ </a>
1184
+ </li>
1185
+
1186
+
1187
+
1188
+ </ul>
1189
+ </li>
1190
+
1191
+
1192
+
1193
+
1194
+ <li class="Tree-item Tree-entity" data-role="item">
1195
+ <a class="Tree-entityLink" href="../../docs/utilities/spacing.html" data-pjax>
1196
+ <span>Spacing</span>
1197
+
1198
+ </a>
1199
+ </li>
1200
+
1201
+
1202
+
1203
+ </ul>
1204
+ </li>
1205
+
1206
+
1207
+
1208
+ <li class="Tree-item Tree-collection Tree-depth-2" data-behaviour="collection" id="tree-docs-collection-guidelines-and-guides">
1209
+ <button class="Tree-collectionLabel" data-role="toggle" aria-expanded="true" aria-controls="tree-docs-collection-guidelines-and-guides-items">
1210
+ Guidelines And Guides
1211
+ </button>
1212
+ <ul class="Tree-collectionItems" data-role="items" id="tree-docs-collection-guidelines-and-guides-items">
1213
+
1214
+
1215
+
1216
+
1217
+
1218
+
1219
+
1220
+ <li class="Tree-item Tree-entity" data-role="item">
1221
+ <a class="Tree-entityLink" href="../../docs/guidelines-and-guides/creating-a-new-release.html" data-pjax>
1222
+ <span>Creating A New Release</span>
1223
+
1224
+ </a>
1225
+ </li>
1226
+
1227
+
1228
+
1229
+
1230
+ <li class="Tree-item Tree-entity" data-role="item">
1231
+ <a class="Tree-entityLink" href="../../docs/guidelines-and-guides/css-and-scss-guidelines.html" data-pjax>
1232
+ <span>Css And Scss Guidelines</span>
1233
+
1234
+ </a>
1235
+ </li>
1236
+
1237
+
1238
+
1239
+
1240
+ <li class="Tree-item Tree-entity" data-role="item">
1241
+ <a class="Tree-entityLink" href="../../docs/guidelines-and-guides/git-cheat-sheet.html" data-pjax>
1242
+ <span>Git Cheat Sheet</span>
1243
+
1244
+ </a>
1245
+ </li>
1246
+
1247
+
1248
+
1249
+
1250
+ <li class="Tree-item Tree-entity" data-role="item">
1251
+ <a class="Tree-entityLink" href="../../docs/guidelines-and-guides/installation-and-usage.html" data-pjax>
1252
+ <span>Installation And Usage</span>
1253
+
1254
+ </a>
1255
+ </li>
1256
+
1257
+
1258
+
1259
+ </ul>
1260
+ </li>
1261
+
1262
+
1263
+
1264
+ </ul>
1265
+ </div>
1266
+
1267
+ </div>
1268
+
1269
+
1270
+
1271
+ </nav>
1272
+
1273
+ </div>
1274
+ </div>
1275
+ </div>
1276
+
1277
+
1278
+
1279
+
1280
+ <script src="../../themes/mandelbrot/js/mandelbrot.js?cachebust=1.4.0"></script>
1281
+
1282
+ <script src="../../design-system.js?cachebust=1.4.0"></script>
1283
+
1284
+
1285
+
1286
+ </body>
1287
+ </html>