@graupl/graupl 1.0.0-beta.0 → 1.0.0-beta.10

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 (613) hide show
  1. package/.devcontainer/devcontainer.json +221 -0
  2. package/.env +3 -0
  3. package/.github/workflows/docs.yml +13 -6
  4. package/.github/workflows/prerelease.yml +125 -0
  5. package/.github/workflows/release.yml +111 -0
  6. package/.github/workflows/test.yml +54 -3
  7. package/.versionrc.cjs +12 -0
  8. package/.vscode/settings.json +10 -0
  9. package/CHANGELOG.md +203 -1
  10. package/build.js +4 -2
  11. package/combine-at-rules.cjs +61 -0
  12. package/container/.env +26 -0
  13. package/container/build/app.dockerfile +41 -0
  14. package/container/docker-compose.yml +27 -0
  15. package/dist/css/base/button.css +1 -1
  16. package/dist/css/base/button.css.map +1 -1
  17. package/dist/css/base/form.css +1 -1
  18. package/dist/css/base/form.css.map +1 -1
  19. package/dist/css/base/link.css +1 -1
  20. package/dist/css/base/link.css.map +1 -1
  21. package/dist/css/base/table.css +1 -1
  22. package/dist/css/base/table.css.map +1 -1
  23. package/dist/css/base.css +1 -1
  24. package/dist/css/base.css.map +1 -1
  25. package/dist/css/component/accordion.css +4 -1
  26. package/dist/css/component/accordion.css.map +1 -1
  27. package/dist/css/component/alert.css +1 -1
  28. package/dist/css/component/alert.css.map +1 -1
  29. package/dist/css/component/card.css +1 -1
  30. package/dist/css/component/card.css.map +1 -1
  31. package/dist/css/component/carousel.css +1 -1
  32. package/dist/css/component/carousel.css.map +1 -1
  33. package/dist/css/component/input-group.css +1 -1
  34. package/dist/css/component/input-group.css.map +1 -1
  35. package/dist/css/component/list.css +2 -0
  36. package/dist/css/component/list.css.map +1 -0
  37. package/dist/css/component/menu.css +1 -1
  38. package/dist/css/component/menu.css.map +1 -1
  39. package/dist/css/component/navigation.css +1 -1
  40. package/dist/css/component/navigation.css.map +1 -1
  41. package/dist/css/component.css +4 -1
  42. package/dist/css/component.css.map +1 -1
  43. package/dist/css/graupl.css +4 -1
  44. package/dist/css/graupl.css.map +1 -1
  45. package/dist/css/init.css.map +1 -1
  46. package/dist/css/layout/columns.css +1 -1
  47. package/dist/css/layout/columns.css.map +1 -1
  48. package/dist/css/layout/container.css +1 -1
  49. package/dist/css/layout/container.css.map +1 -1
  50. package/dist/css/layout/flex-columns.css +1 -1
  51. package/dist/css/layout/flex-columns.css.map +1 -1
  52. package/dist/css/layout.css +4 -1
  53. package/dist/css/layout.css.map +1 -1
  54. package/dist/css/normalize.css.map +1 -1
  55. package/dist/css/state/focus.css +1 -1
  56. package/dist/css/state/focus.css.map +1 -1
  57. package/dist/css/state.css +1 -1
  58. package/dist/css/state.css.map +1 -1
  59. package/dist/css/theme/color.css.map +1 -1
  60. package/dist/css/theme/typography.css +1 -1
  61. package/dist/css/theme/typography.css.map +1 -1
  62. package/dist/css/theme.css +1 -1
  63. package/dist/css/theme.css.map +1 -1
  64. package/dist/css/utilities/alignment.css.map +1 -1
  65. package/dist/css/utilities/background.css +2 -0
  66. package/dist/css/utilities/background.css.map +1 -0
  67. package/dist/css/utilities/border.css +2 -0
  68. package/dist/css/utilities/border.css.map +1 -0
  69. package/dist/css/utilities/color.css +1 -1
  70. package/dist/css/utilities/color.css.map +1 -1
  71. package/dist/css/utilities/container.css +2 -0
  72. package/dist/css/utilities/container.css.map +1 -0
  73. package/dist/css/utilities/display.css +1 -1
  74. package/dist/css/utilities/display.css.map +1 -1
  75. package/dist/css/utilities/flex.css +1 -1
  76. package/dist/css/utilities/flex.css.map +1 -1
  77. package/dist/css/utilities/gradient.css +2 -0
  78. package/dist/css/utilities/gradient.css.map +1 -0
  79. package/dist/css/utilities/height.css +1 -1
  80. package/dist/css/utilities/height.css.map +1 -1
  81. package/dist/css/utilities/inset.css +1 -1
  82. package/dist/css/utilities/inset.css.map +1 -1
  83. package/dist/css/utilities/justification.css.map +1 -1
  84. package/dist/css/utilities/list.css.map +1 -1
  85. package/dist/css/utilities/order.css.map +1 -1
  86. package/dist/css/utilities/position.css +2 -0
  87. package/dist/css/utilities/position.css.map +1 -0
  88. package/dist/css/utilities/ratio.css +1 -1
  89. package/dist/css/utilities/ratio.css.map +1 -1
  90. package/dist/css/utilities/spacing.css +1 -1
  91. package/dist/css/utilities/spacing.css.map +1 -1
  92. package/dist/css/utilities/typography.css +1 -1
  93. package/dist/css/utilities/typography.css.map +1 -1
  94. package/dist/css/utilities/visibility.css +1 -1
  95. package/dist/css/utilities/visibility.css.map +1 -1
  96. package/dist/css/utilities/visually-hidden.css +2 -0
  97. package/dist/css/utilities/visually-hidden.css.map +1 -0
  98. package/dist/css/utilities/width.css +1 -1
  99. package/dist/css/utilities/width.css.map +1 -1
  100. package/dist/css/utilities/z-index.css +2 -0
  101. package/dist/css/utilities/z-index.css.map +1 -0
  102. package/dist/css/utilities.css +1 -1
  103. package/dist/css/utilities.css.map +1 -1
  104. package/dist/js/graupl.cjs.js +5 -3
  105. package/dist/js/graupl.esm.js +1305 -206
  106. package/dist/js/graupl.iife.js +5 -3
  107. package/docs/.vitepress/config.js +31 -1
  108. package/docs/.vitepress/theme/custom.scss +16 -16
  109. package/docs/compiling-graupl.md +6 -5
  110. package/docs/components/alert.md +28 -28
  111. package/docs/components/button.md +36 -36
  112. package/docs/components/card.md +39 -39
  113. package/docs/components/inputgroup.md +12 -12
  114. package/docs/components/menu.md +112 -112
  115. package/docs/components/navigation.md +52 -52
  116. package/docs/content.md +86 -86
  117. package/docs/defaults.md +10 -10
  118. package/docs/forms.md +34 -34
  119. package/docs/layout.md +21 -21
  120. package/docs/state.md +8 -8
  121. package/docs/theme.md +58 -58
  122. package/docs/utilities/alignment.md +411 -0
  123. package/docs/utilities/background.md +192 -0
  124. package/docs/utilities/border.md +268 -0
  125. package/docs/utilities/color.md +348 -0
  126. package/docs/utilities/container.md +3 -0
  127. package/docs/utilities/display.md +3 -0
  128. package/docs/utilities/flex.md +3 -0
  129. package/docs/utilities/gradient.md +3 -0
  130. package/docs/utilities/height.md +3 -0
  131. package/docs/utilities/inset.md +3 -0
  132. package/docs/utilities/justification.md +3 -0
  133. package/docs/utilities/list.md +3 -0
  134. package/docs/utilities/order.md +3 -0
  135. package/docs/utilities/position.md +3 -0
  136. package/docs/utilities/ratio.md +3 -0
  137. package/docs/utilities/responsive-classes.md +3 -0
  138. package/docs/utilities/spacing.md +3 -0
  139. package/docs/utilities/typography.md +3 -0
  140. package/docs/utilities/visibility.md +3 -0
  141. package/docs/utilities/visually-hidden.md +3 -0
  142. package/docs/utilities/width.md +3 -0
  143. package/docs/utilities/z-index.md +3 -0
  144. package/docs/utilities.md +1 -1
  145. package/favicon.ico +0 -0
  146. package/index.html +418 -55
  147. package/logo.svg +296 -0
  148. package/package.json +33 -37
  149. package/packages/core/build.js +9 -0
  150. package/packages/core/dist/css/base/button.css +2 -0
  151. package/packages/core/dist/css/base/button.css.map +1 -0
  152. package/packages/core/dist/css/base/form.css +2 -0
  153. package/packages/core/dist/css/base/form.css.map +1 -0
  154. package/packages/core/dist/css/base/link.css +2 -0
  155. package/packages/core/dist/css/base/link.css.map +1 -0
  156. package/packages/core/dist/css/base/table.css +2 -0
  157. package/packages/core/dist/css/base/table.css.map +1 -0
  158. package/packages/core/dist/css/base.css +2 -0
  159. package/packages/core/dist/css/base.css.map +1 -0
  160. package/packages/core/dist/css/component/accordion.css +5 -0
  161. package/packages/core/dist/css/component/accordion.css.map +1 -0
  162. package/packages/core/dist/css/component/alert.css +2 -0
  163. package/packages/core/dist/css/component/alert.css.map +1 -0
  164. package/packages/core/dist/css/component/card.css +2 -0
  165. package/packages/core/dist/css/component/card.css.map +1 -0
  166. package/packages/core/dist/css/component/carousel.css +2 -0
  167. package/packages/core/dist/css/component/carousel.css.map +1 -0
  168. package/packages/core/dist/css/component/input-group.css +2 -0
  169. package/packages/core/dist/css/component/input-group.css.map +1 -0
  170. package/packages/core/dist/css/component/list.css +2 -0
  171. package/packages/core/dist/css/component/list.css.map +1 -0
  172. package/packages/core/dist/css/component/menu.css +2 -0
  173. package/packages/core/dist/css/component/menu.css.map +1 -0
  174. package/packages/core/dist/css/component/navigation.css +2 -0
  175. package/packages/core/dist/css/component/navigation.css.map +1 -0
  176. package/packages/core/dist/css/component.css +5 -0
  177. package/packages/core/dist/css/component.css.map +1 -0
  178. package/packages/core/dist/css/graupl.css +5 -0
  179. package/packages/core/dist/css/graupl.css.map +1 -0
  180. package/{src/scss/_init.scss → packages/core/dist/css/init.css} +1 -2
  181. package/packages/core/dist/css/init.css.map +1 -0
  182. package/packages/core/dist/css/layout/columns.css +2 -0
  183. package/packages/core/dist/css/layout/columns.css.map +1 -0
  184. package/packages/core/dist/css/layout/container.css +2 -0
  185. package/packages/core/dist/css/layout/container.css.map +1 -0
  186. package/packages/core/dist/css/layout/flex-columns.css +2 -0
  187. package/packages/core/dist/css/layout/flex-columns.css.map +1 -0
  188. package/packages/core/dist/css/layout.css +5 -0
  189. package/packages/core/dist/css/layout.css.map +1 -0
  190. package/packages/core/dist/css/normalize.css +2 -0
  191. package/packages/core/dist/css/normalize.css.map +1 -0
  192. package/packages/core/dist/css/state/focus.css +2 -0
  193. package/packages/core/dist/css/state/focus.css.map +1 -0
  194. package/packages/core/dist/css/state.css +2 -0
  195. package/packages/core/dist/css/state.css.map +1 -0
  196. package/packages/core/dist/css/theme/color.css +2 -0
  197. package/packages/core/dist/css/theme/color.css.map +1 -0
  198. package/packages/core/dist/css/theme/typography.css +2 -0
  199. package/packages/core/dist/css/theme/typography.css.map +1 -0
  200. package/packages/core/dist/css/theme.css +2 -0
  201. package/packages/core/dist/css/theme.css.map +1 -0
  202. package/packages/core/dist/css/utilities/alignment.css +2 -0
  203. package/packages/core/dist/css/utilities/alignment.css.map +1 -0
  204. package/packages/core/dist/css/utilities/background.css +2 -0
  205. package/packages/core/dist/css/utilities/background.css.map +1 -0
  206. package/packages/core/dist/css/utilities/border.css +2 -0
  207. package/packages/core/dist/css/utilities/border.css.map +1 -0
  208. package/packages/core/dist/css/utilities/color.css +2 -0
  209. package/packages/core/dist/css/utilities/color.css.map +1 -0
  210. package/packages/core/dist/css/utilities/container.css +2 -0
  211. package/packages/core/dist/css/utilities/container.css.map +1 -0
  212. package/packages/core/dist/css/utilities/display.css +2 -0
  213. package/packages/core/dist/css/utilities/display.css.map +1 -0
  214. package/packages/core/dist/css/utilities/flex.css +2 -0
  215. package/packages/core/dist/css/utilities/flex.css.map +1 -0
  216. package/packages/core/dist/css/utilities/gradient.css +2 -0
  217. package/packages/core/dist/css/utilities/gradient.css.map +1 -0
  218. package/packages/core/dist/css/utilities/height.css +2 -0
  219. package/packages/core/dist/css/utilities/height.css.map +1 -0
  220. package/packages/core/dist/css/utilities/inset.css +2 -0
  221. package/packages/core/dist/css/utilities/inset.css.map +1 -0
  222. package/packages/core/dist/css/utilities/justification.css +2 -0
  223. package/packages/core/dist/css/utilities/justification.css.map +1 -0
  224. package/packages/core/dist/css/utilities/list.css +2 -0
  225. package/packages/core/dist/css/utilities/list.css.map +1 -0
  226. package/packages/core/dist/css/utilities/order.css +2 -0
  227. package/packages/core/dist/css/utilities/order.css.map +1 -0
  228. package/packages/core/dist/css/utilities/position.css +2 -0
  229. package/packages/core/dist/css/utilities/position.css.map +1 -0
  230. package/packages/core/dist/css/utilities/ratio.css +2 -0
  231. package/packages/core/dist/css/utilities/ratio.css.map +1 -0
  232. package/packages/core/dist/css/utilities/spacing.css +2 -0
  233. package/packages/core/dist/css/utilities/spacing.css.map +1 -0
  234. package/packages/core/dist/css/utilities/typography.css +2 -0
  235. package/packages/core/dist/css/utilities/typography.css.map +1 -0
  236. package/packages/core/dist/css/utilities/visibility.css +2 -0
  237. package/packages/core/dist/css/utilities/visibility.css.map +1 -0
  238. package/packages/core/dist/css/utilities/visually-hidden.css +2 -0
  239. package/packages/core/dist/css/utilities/visually-hidden.css.map +1 -0
  240. package/packages/core/dist/css/utilities/width.css +2 -0
  241. package/packages/core/dist/css/utilities/width.css.map +1 -0
  242. package/packages/core/dist/css/utilities/z-index.css +2 -0
  243. package/packages/core/dist/css/utilities/z-index.css.map +1 -0
  244. package/packages/core/dist/css/utilities.css +2 -0
  245. package/packages/core/dist/css/utilities.css.map +1 -0
  246. package/packages/core/package.json +58 -0
  247. package/packages/core/scss/base/button.scss +3 -0
  248. package/packages/core/scss/base/form.scss +3 -0
  249. package/packages/core/scss/base/link.scss +3 -0
  250. package/packages/core/scss/base/table.scss +3 -0
  251. package/packages/core/scss/base.scss +3 -0
  252. package/packages/core/scss/component/accordion.scss +3 -0
  253. package/packages/core/scss/component/alert.scss +3 -0
  254. package/packages/core/scss/component/card.scss +3 -0
  255. package/packages/core/scss/component/carousel.scss +3 -0
  256. package/packages/core/scss/component/input-group.scss +3 -0
  257. package/packages/core/scss/component/list.scss +3 -0
  258. package/packages/core/scss/component/menu.scss +3 -0
  259. package/packages/core/scss/component/navigation.scss +3 -0
  260. package/packages/core/scss/component.scss +3 -0
  261. package/packages/core/scss/graupl.scss +3 -0
  262. package/packages/core/scss/init.scss +3 -0
  263. package/packages/core/scss/layout/columns.scss +3 -0
  264. package/packages/core/scss/layout/container.scss +3 -0
  265. package/packages/core/scss/layout/flex-columns.scss +3 -0
  266. package/packages/core/scss/layout.scss +3 -0
  267. package/packages/core/scss/normalize.scss +3 -0
  268. package/packages/core/scss/state/focus.scss +3 -0
  269. package/packages/core/scss/state.scss +3 -0
  270. package/packages/core/scss/theme/color.scss +3 -0
  271. package/packages/core/scss/theme/typography.scss +3 -0
  272. package/packages/core/scss/theme.scss +3 -0
  273. package/packages/core/scss/utilities/alignment.scss +3 -0
  274. package/packages/core/scss/utilities/background.scss +3 -0
  275. package/packages/core/scss/utilities/border.scss +3 -0
  276. package/packages/core/scss/utilities/color.scss +3 -0
  277. package/packages/core/scss/utilities/container.scss +3 -0
  278. package/packages/core/scss/utilities/display.scss +3 -0
  279. package/packages/core/scss/utilities/flex.scss +3 -0
  280. package/packages/core/scss/utilities/gradient.scss +3 -0
  281. package/packages/core/scss/utilities/height.scss +3 -0
  282. package/packages/core/scss/utilities/inset.scss +3 -0
  283. package/packages/core/scss/utilities/justification.scss +3 -0
  284. package/packages/core/scss/utilities/list.scss +3 -0
  285. package/packages/core/scss/utilities/order.scss +3 -0
  286. package/{scss/utilities/postion.scss → packages/core/scss/utilities/position.scss} +1 -1
  287. package/packages/core/scss/utilities/ratio.scss +3 -0
  288. package/packages/core/scss/utilities/spacing.scss +3 -0
  289. package/packages/core/scss/utilities/typography.scss +3 -0
  290. package/packages/core/scss/utilities/visibility.scss +3 -0
  291. package/packages/core/scss/utilities/visually-hidden.scss +3 -0
  292. package/packages/core/scss/utilities/width.scss +3 -0
  293. package/packages/core/scss/utilities/z-index.scss +3 -0
  294. package/packages/core/scss/utilities.scss +3 -0
  295. package/{src → packages/core/src}/scss/_defaults.scss +59 -11
  296. package/{src → packages/core/src}/scss/_index.scss +1 -1
  297. package/packages/core/src/scss/_init.scss +6 -0
  298. package/{src → packages/core/src}/scss/_normalize.scss +1 -1
  299. package/packages/core/src/scss/_variables.scss +95 -0
  300. package/{src → packages/core/src}/scss/base/_index.scss +1 -1
  301. package/{src → packages/core/src}/scss/base/button/_defaults.scss +13 -24
  302. package/packages/core/src/scss/base/button/_index.scss +206 -0
  303. package/packages/core/src/scss/base/button/_mixins.scss +104 -0
  304. package/packages/core/src/scss/base/button/_variables.scss +252 -0
  305. package/{src → packages/core/src}/scss/base/form/_defaults.scss +8 -1
  306. package/packages/core/src/scss/base/form/_index.scss +227 -0
  307. package/packages/core/src/scss/base/form/_variables.scss +245 -0
  308. package/packages/core/src/scss/base/link/_defaults.scss +35 -0
  309. package/packages/core/src/scss/base/link/_index.scss +245 -0
  310. package/packages/core/src/scss/base/link/_variables.scss +370 -0
  311. package/packages/core/src/scss/base/table/_defaults.scss +68 -0
  312. package/packages/core/src/scss/base/table/_index.scss +314 -0
  313. package/packages/core/src/scss/base/table/_variables.scss +309 -0
  314. package/{src → packages/core/src}/scss/component/_index.scss +2 -1
  315. package/{src → packages/core/src}/scss/component/accordion/_defaults.scss +1 -1
  316. package/{src → packages/core/src}/scss/component/accordion/_index.scss +78 -60
  317. package/{src → packages/core/src}/scss/component/accordion/_variables.scss +127 -87
  318. package/{src → packages/core/src}/scss/component/alert/_defaults.scss +1 -1
  319. package/{src → packages/core/src}/scss/component/alert/_index.scss +51 -50
  320. package/packages/core/src/scss/component/alert/_variables.scss +200 -0
  321. package/{src → packages/core/src}/scss/component/card/_defaults.scss +1 -1
  322. package/{src → packages/core/src}/scss/component/card/_index.scss +53 -19
  323. package/packages/core/src/scss/component/card/_variables.scss +216 -0
  324. package/{src → packages/core/src}/scss/component/carousel/_defaults.scss +1 -1
  325. package/{src → packages/core/src}/scss/component/carousel/_index.scss +32 -28
  326. package/{src → packages/core/src}/scss/component/carousel/_variables.scss +22 -22
  327. package/{src → packages/core/src}/scss/component/input-group/_defaults.scss +1 -1
  328. package/{src → packages/core/src}/scss/component/input-group/_index.scss +2 -2
  329. package/{src → packages/core/src}/scss/component/input-group/_variables.scss +13 -13
  330. package/{src/scss/utilities/order → packages/core/src/scss/component/list}/_defaults.scss +7 -14
  331. package/packages/core/src/scss/component/list/_index.scss +52 -0
  332. package/packages/core/src/scss/component/list/_variables.scss +236 -0
  333. package/{src → packages/core/src}/scss/component/menu/_defaults.scss +11 -20
  334. package/packages/core/src/scss/component/menu/_index.scss +308 -0
  335. package/packages/core/src/scss/component/menu/_variables.scss +642 -0
  336. package/packages/core/src/scss/component/navigation/_defaults.scss +23 -0
  337. package/packages/core/src/scss/component/navigation/_index.scss +190 -0
  338. package/packages/core/src/scss/component/navigation/_variables.scss +290 -0
  339. package/packages/core/src/scss/functions/_container.scss +38 -0
  340. package/packages/core/src/scss/functions/_important.scss +36 -0
  341. package/{src → packages/core/src}/scss/functions/_screen.scss +9 -1
  342. package/{src → packages/core/src}/scss/functions/_theme.scss +2 -2
  343. package/packages/core/src/scss/functions/_utility.scss +28 -0
  344. package/{src → packages/core/src}/scss/layout/_index.scss +1 -1
  345. package/{src → packages/core/src}/scss/layout/columns/_defaults.scss +9 -4
  346. package/packages/core/src/scss/layout/columns/_index.scss +137 -0
  347. package/{src → packages/core/src}/scss/layout/columns/_variables.scss +13 -9
  348. package/packages/core/src/scss/layout/container/_defaults.scss +35 -0
  349. package/packages/core/src/scss/layout/container/_index.scss +628 -0
  350. package/packages/core/src/scss/layout/container/_variables.scss +114 -0
  351. package/packages/core/src/scss/layout/flex-columns/_defaults.scss +28 -0
  352. package/packages/core/src/scss/layout/flex-columns/_index.scss +184 -0
  353. package/{src → packages/core/src}/scss/layout/flex-columns/_variables.scss +9 -5
  354. package/{src → packages/core/src}/scss/mixins/_animation.scss +1 -1
  355. package/packages/core/src/scss/mixins/_container.scss +80 -0
  356. package/{src → packages/core/src}/scss/mixins/_layer.scss +6 -2
  357. package/{src → packages/core/src}/scss/mixins/_screen.scss +25 -4
  358. package/packages/core/src/scss/mixins/_state.scss +18 -0
  359. package/packages/core/src/scss/mixins/_theme.scss +15 -0
  360. package/packages/core/src/scss/mixins/_utility.scss +185 -0
  361. package/packages/core/src/scss/mixins/_visually-hidden.scss +30 -0
  362. package/packages/core/src/scss/state/_index.scss +3 -0
  363. package/{src → packages/core/src}/scss/state/focus/_defaults.scss +1 -2
  364. package/packages/core/src/scss/state/focus/_index.scss +42 -0
  365. package/packages/core/src/scss/state/focus/_mixins.scss +13 -0
  366. package/packages/core/src/scss/state/focus/_variables.scss +50 -0
  367. package/{src → packages/core/src}/scss/theme/_index.scss +1 -1
  368. package/{src → packages/core/src}/scss/theme/color/_defaults.scss +1 -1
  369. package/{src → packages/core/src}/scss/theme/color/_index.scss +8 -8
  370. package/{src → packages/core/src}/scss/theme/color/_variables.scss +12 -8
  371. package/{src → packages/core/src}/scss/theme/typography/_defaults.scss +1 -1
  372. package/{src → packages/core/src}/scss/theme/typography/_index.scss +10 -1
  373. package/packages/core/src/scss/theme/typography/_variables.scss +248 -0
  374. package/{src → packages/core/src}/scss/utilities/_index.scss +7 -1
  375. package/packages/core/src/scss/utilities/_template/_defaults.scss +41 -0
  376. package/packages/core/src/scss/utilities/_template/_index.scss +171 -0
  377. package/{src/scss/utilities/alignment → packages/core/src/scss/utilities/_template}/_variables.scss +1 -1
  378. package/{src → packages/core/src}/scss/utilities/alignment/_defaults.scss +21 -7
  379. package/packages/core/src/scss/utilities/alignment/_index.scss +336 -0
  380. package/{src/scss/utilities/display → packages/core/src/scss/utilities/alignment}/_variables.scss +1 -1
  381. package/packages/core/src/scss/utilities/background/_defaults.scss +122 -0
  382. package/packages/core/src/scss/utilities/background/_index.scss +634 -0
  383. package/packages/core/src/scss/utilities/background/_variables.scss +6 -0
  384. package/packages/core/src/scss/utilities/border/_defaults.scss +73 -0
  385. package/packages/core/src/scss/utilities/border/_index.scss +558 -0
  386. package/{src/scss/utilities/list → packages/core/src/scss/utilities/border}/_variables.scss +1 -1
  387. package/packages/core/src/scss/utilities/color/_defaults.scss +49 -0
  388. package/packages/core/src/scss/utilities/color/_index.scss +469 -0
  389. package/{src/scss/utilities/flex → packages/core/src/scss/utilities/color}/_variables.scss +1 -1
  390. package/packages/core/src/scss/utilities/container/_defaults.scss +40 -0
  391. package/packages/core/src/scss/utilities/container/_index.scss +174 -0
  392. package/packages/core/src/scss/utilities/container/_variables.scss +6 -0
  393. package/packages/core/src/scss/utilities/display/_defaults.scss +47 -0
  394. package/packages/core/src/scss/utilities/display/_index.scss +184 -0
  395. package/{src/scss/utilities/inset → packages/core/src/scss/utilities/display}/_variables.scss +1 -1
  396. package/packages/core/src/scss/utilities/flex/_defaults.scss +99 -0
  397. package/packages/core/src/scss/utilities/flex/_index.scss +486 -0
  398. package/{src/scss/utilities/color → packages/core/src/scss/utilities/flex}/_variables.scss +1 -1
  399. package/packages/core/src/scss/utilities/gradient/_defaults.scss +70 -0
  400. package/packages/core/src/scss/utilities/gradient/_index.scss +696 -0
  401. package/packages/core/src/scss/utilities/gradient/_variables.scss +29 -0
  402. package/packages/core/src/scss/utilities/height/_defaults.scss +54 -0
  403. package/packages/core/src/scss/utilities/height/_index.scss +525 -0
  404. package/packages/core/src/scss/utilities/height/_variables.scss +6 -0
  405. package/packages/core/src/scss/utilities/inset/_defaults.scss +55 -0
  406. package/packages/core/src/scss/utilities/inset/_index.scss +258 -0
  407. package/packages/core/src/scss/utilities/inset/_variables.scss +6 -0
  408. package/{src → packages/core/src}/scss/utilities/justification/_defaults.scss +21 -7
  409. package/packages/core/src/scss/utilities/justification/_index.scss +333 -0
  410. package/packages/core/src/scss/utilities/justification/_variables.scss +6 -0
  411. package/packages/core/src/scss/utilities/list/_defaults.scss +53 -0
  412. package/packages/core/src/scss/utilities/list/_index.scss +253 -0
  413. package/packages/core/src/scss/utilities/list/_variables.scss +6 -0
  414. package/packages/core/src/scss/utilities/order/_defaults.scss +36 -0
  415. package/packages/core/src/scss/utilities/order/_index.scss +246 -0
  416. package/packages/core/src/scss/utilities/order/_variables.scss +6 -0
  417. package/packages/core/src/scss/utilities/position/_defaults.scss +41 -0
  418. package/packages/core/src/scss/utilities/position/_index.scss +178 -0
  419. package/{src/scss/utilities/height → packages/core/src/scss/utilities/position}/_variables.scss +1 -1
  420. package/packages/core/src/scss/utilities/ratio/_defaults.scss +42 -0
  421. package/packages/core/src/scss/utilities/ratio/_index.scss +188 -0
  422. package/{src → packages/core/src}/scss/utilities/ratio/_variables.scss +2 -2
  423. package/{src → packages/core/src}/scss/utilities/spacing/_defaults.scss +19 -4
  424. package/packages/core/src/scss/utilities/spacing/_index.scss +970 -0
  425. package/packages/core/src/scss/utilities/spacing/_variables.scss +6 -0
  426. package/packages/core/src/scss/utilities/typography/_defaults.scss +58 -0
  427. package/packages/core/src/scss/utilities/typography/_index.scss +1089 -0
  428. package/packages/core/src/scss/utilities/typography/_variables.scss +6 -0
  429. package/packages/core/src/scss/utilities/visibility/_defaults.scss +39 -0
  430. package/packages/core/src/scss/utilities/visibility/_index.scss +173 -0
  431. package/packages/core/src/scss/utilities/visibility/_variables.scss +6 -0
  432. package/packages/core/src/scss/utilities/visually-hidden/_defaults.scss +29 -0
  433. package/packages/core/src/scss/utilities/visually-hidden/_index.scss +189 -0
  434. package/packages/core/src/scss/utilities/visually-hidden/_variables.scss +6 -0
  435. package/packages/core/src/scss/utilities/width/_defaults.scss +54 -0
  436. package/packages/core/src/scss/utilities/width/_index.scss +525 -0
  437. package/packages/core/src/scss/utilities/width/_variables.scss +6 -0
  438. package/packages/core/src/scss/utilities/z-index/_defaults.scss +40 -0
  439. package/packages/core/src/scss/utilities/z-index/_index.scss +173 -0
  440. package/packages/core/src/scss/utilities/z-index/_variables.scss +6 -0
  441. package/packages/core/vite.config.js +28 -0
  442. package/packages/icons/dist/css/base/button.css +2 -0
  443. package/packages/icons/dist/css/base/button.css.map +1 -0
  444. package/packages/icons/dist/css/base/link.css +2 -0
  445. package/packages/icons/dist/css/base/link.css.map +1 -0
  446. package/packages/icons/dist/css/base.css +2 -0
  447. package/packages/icons/dist/css/base.css.map +1 -0
  448. package/packages/icons/dist/css/component/icon.css +2 -0
  449. package/packages/icons/dist/css/component/icon.css.map +1 -0
  450. package/packages/icons/dist/css/component.css +2 -0
  451. package/packages/icons/dist/css/component.css.map +1 -0
  452. package/packages/icons/dist/css/icon.css +2 -0
  453. package/packages/icons/dist/css/icon.css.map +1 -0
  454. package/packages/icons/package.json +48 -0
  455. package/packages/icons/scss/base/button.scss +3 -0
  456. package/packages/icons/scss/base/link.scss +3 -0
  457. package/packages/icons/scss/base.scss +3 -0
  458. package/packages/icons/scss/component/icon.scss +3 -0
  459. package/packages/icons/scss/component.scss +3 -0
  460. package/packages/icons/scss/icon.scss +3 -0
  461. package/packages/icons/src/scss/_index.scss +4 -0
  462. package/packages/icons/src/scss/base/_index.scss +4 -0
  463. package/packages/icons/src/scss/base/button/_defaults.scss +7 -0
  464. package/packages/icons/src/scss/base/button/_index.scss +58 -0
  465. package/packages/icons/src/scss/base/button/_variables.scss +7 -0
  466. package/packages/icons/src/scss/base/link/_defaults.scss +7 -0
  467. package/packages/icons/src/scss/base/link/_index.scss +58 -0
  468. package/packages/icons/src/scss/base/link/_variables.scss +7 -0
  469. package/packages/icons/src/scss/component/_index.scss +3 -0
  470. package/packages/icons/src/scss/component/icon/_defaults.scss +30 -0
  471. package/packages/icons/src/scss/component/icon/_index.scss +60 -0
  472. package/packages/icons/src/scss/component/icon/_mixins.scss +62 -0
  473. package/packages/icons/src/scss/component/icon/_variables.scss +24 -0
  474. package/postcss.config.cjs +2 -3
  475. package/scss/base/button.scss +1 -1
  476. package/scss/base/form.scss +1 -1
  477. package/scss/base/link.scss +1 -1
  478. package/scss/base/table.scss +1 -1
  479. package/scss/base.scss +1 -1
  480. package/scss/component/accordion.scss +1 -1
  481. package/scss/component/alert.scss +1 -1
  482. package/scss/component/card.scss +1 -1
  483. package/scss/component/carousel.scss +1 -1
  484. package/scss/component/input-group.scss +1 -1
  485. package/scss/component/list.scss +3 -0
  486. package/scss/component/menu.scss +1 -1
  487. package/scss/component/navigation.scss +1 -1
  488. package/scss/component.scss +1 -1
  489. package/scss/graupl.scss +1 -1
  490. package/scss/init.scss +1 -1
  491. package/scss/layout/columns.scss +1 -1
  492. package/scss/layout/container.scss +1 -1
  493. package/scss/layout/flex-columns.scss +1 -1
  494. package/scss/layout.scss +1 -1
  495. package/scss/normalize.scss +1 -1
  496. package/scss/state/focus.scss +1 -1
  497. package/scss/state.scss +1 -1
  498. package/scss/theme/color.scss +1 -1
  499. package/scss/theme/typography.scss +1 -1
  500. package/scss/theme.scss +1 -1
  501. package/scss/utilities/alignment.scss +1 -1
  502. package/scss/utilities/background.scss +3 -0
  503. package/scss/utilities/border.scss +3 -0
  504. package/scss/utilities/color.scss +1 -1
  505. package/scss/utilities/container.scss +3 -0
  506. package/scss/utilities/display.scss +1 -1
  507. package/scss/utilities/flex.scss +1 -1
  508. package/scss/utilities/gradient.scss +3 -0
  509. package/scss/utilities/height.scss +1 -1
  510. package/scss/utilities/inset.scss +1 -1
  511. package/scss/utilities/justification.scss +1 -1
  512. package/scss/utilities/list.scss +1 -1
  513. package/scss/utilities/order.scss +1 -1
  514. package/scss/utilities/position.scss +3 -0
  515. package/scss/utilities/ratio.scss +1 -1
  516. package/scss/utilities/spacing.scss +1 -1
  517. package/scss/utilities/typography.scss +1 -1
  518. package/scss/utilities/visibility.scss +1 -1
  519. package/scss/utilities/visually-hidden.scss +3 -0
  520. package/scss/utilities/width.scss +1 -1
  521. package/scss/utilities/z-index.scss +3 -0
  522. package/scss/utilities.scss +1 -1
  523. package/stylelint.config.js +1 -0
  524. package/vite.config.js +6 -35
  525. package/dist/css/utilities/postion.css +0 -2
  526. package/dist/css/utilities/postion.css.map +0 -1
  527. package/dist/js/component/accordion.cjs.js +0 -3
  528. package/dist/js/component/accordion.esm.js +0 -1289
  529. package/dist/js/component/accordion.iife.js +0 -3
  530. package/dist/js/component/alert.cjs.js +0 -3
  531. package/dist/js/component/alert.esm.js +0 -529
  532. package/dist/js/component/alert.iife.js +0 -3
  533. package/dist/js/component/carousel.cjs.js +0 -3
  534. package/dist/js/component/carousel.esm.js +0 -1110
  535. package/dist/js/component/carousel.iife.js +0 -3
  536. package/src/scss/_variables.scss +0 -53
  537. package/src/scss/base/button/_index.scss +0 -107
  538. package/src/scss/base/button/_mixins.scss +0 -166
  539. package/src/scss/base/button/_variables.scss +0 -176
  540. package/src/scss/base/form/_index.scss +0 -93
  541. package/src/scss/base/form/_variables.scss +0 -156
  542. package/src/scss/base/link/_defaults.scss +0 -50
  543. package/src/scss/base/link/_index.scss +0 -134
  544. package/src/scss/base/link/_variables.scss +0 -262
  545. package/src/scss/base/table/_defaults.scss +0 -53
  546. package/src/scss/base/table/_index.scss +0 -121
  547. package/src/scss/base/table/_variables.scss +0 -135
  548. package/src/scss/component/alert/_variables.scss +0 -173
  549. package/src/scss/component/card/_variables.scss +0 -186
  550. package/src/scss/component/menu/_index.scss +0 -305
  551. package/src/scss/component/menu/_variables.scss +0 -500
  552. package/src/scss/component/navigation/_defaults.scss +0 -29
  553. package/src/scss/component/navigation/_index.scss +0 -189
  554. package/src/scss/component/navigation/_variables.scss +0 -237
  555. package/src/scss/functions/_important.scss +0 -13
  556. package/src/scss/layout/columns/_index.scss +0 -58
  557. package/src/scss/layout/container/_defaults.scss +0 -17
  558. package/src/scss/layout/container/_index.scss +0 -41
  559. package/src/scss/layout/container/_variables.scss +0 -50
  560. package/src/scss/layout/flex-columns/_defaults.scss +0 -18
  561. package/src/scss/layout/flex-columns/_index.scss +0 -80
  562. package/src/scss/mixins/_utility.scss +0 -30
  563. package/src/scss/mixins/_visually-hidden.scss +0 -20
  564. package/src/scss/state/_index.scss +0 -3
  565. package/src/scss/state/focus/_index.scss +0 -13
  566. package/src/scss/state/focus/_mixins.scss +0 -15
  567. package/src/scss/state/focus/_variables.scss +0 -44
  568. package/src/scss/theme/typography/_variables.scss +0 -231
  569. package/src/scss/utilities/alignment/_index.scss +0 -75
  570. package/src/scss/utilities/color/_defaults.scss +0 -35
  571. package/src/scss/utilities/color/_index.scss +0 -91
  572. package/src/scss/utilities/display/_defaults.scss +0 -32
  573. package/src/scss/utilities/display/_index.scss +0 -61
  574. package/src/scss/utilities/flex/_defaults.scss +0 -63
  575. package/src/scss/utilities/flex/_index.scss +0 -71
  576. package/src/scss/utilities/height/_defaults.scss +0 -41
  577. package/src/scss/utilities/height/_index.scss +0 -98
  578. package/src/scss/utilities/inset/_defaults.scss +0 -41
  579. package/src/scss/utilities/inset/_index.scss +0 -37
  580. package/src/scss/utilities/justification/_index.scss +0 -75
  581. package/src/scss/utilities/justification/_variables.scss +0 -6
  582. package/src/scss/utilities/list/_defaults.scss +0 -39
  583. package/src/scss/utilities/list/_index.scss +0 -56
  584. package/src/scss/utilities/order/_index.scss +0 -63
  585. package/src/scss/utilities/order/_variables.scss +0 -6
  586. package/src/scss/utilities/position/_defaults.scss +0 -26
  587. package/src/scss/utilities/position/_index.scss +0 -37
  588. package/src/scss/utilities/position/_variables.scss +0 -6
  589. package/src/scss/utilities/ratio/_defaults.scss +0 -28
  590. package/src/scss/utilities/ratio/_index.scss +0 -52
  591. package/src/scss/utilities/spacing/_index.scss +0 -169
  592. package/src/scss/utilities/spacing/_variables.scss +0 -6
  593. package/src/scss/utilities/typography/_defaults.scss +0 -30
  594. package/src/scss/utilities/typography/_index.scss +0 -224
  595. package/src/scss/utilities/typography/_variables.scss +0 -6
  596. package/src/scss/utilities/visibility/_defaults.scss +0 -25
  597. package/src/scss/utilities/visibility/_index.scss +0 -36
  598. package/src/scss/utilities/visibility/_variables.scss +0 -6
  599. package/src/scss/utilities/width/_defaults.scss +0 -41
  600. package/src/scss/utilities/width/_index.scss +0 -98
  601. package/src/scss/utilities/width/_variables.scss +0 -6
  602. /package/{src → packages/core/src}/js/accordion/Accordion.js +0 -0
  603. /package/{src → packages/core/src}/js/accordion/AccordionItem.js +0 -0
  604. /package/{src → packages/core/src}/js/accordion/index.js +0 -0
  605. /package/{src → packages/core/src}/js/alert/Alert.js +0 -0
  606. /package/{src → packages/core/src}/js/alert/index.js +0 -0
  607. /package/{src → packages/core/src}/js/carousel/Carousel.js +0 -0
  608. /package/{src → packages/core/src}/js/carousel/index.js +0 -0
  609. /package/{src → packages/core/src}/js/domHelpers.js +0 -0
  610. /package/{src → packages/core/src}/js/eventHandlers.js +0 -0
  611. /package/{src → packages/core/src}/js/navigation/index.js +0 -0
  612. /package/{src → packages/core/src}/js/storage.js +0 -0
  613. /package/{src → packages/core/src}/js/validate.js +0 -0
package/docs/utilities/color.md ADDED
@@ -0,0 +1,348 @@
1
+ # Color Utilities
2
+
3
+ The color utilities provide a set of classes to adjust the `color` and `background` properties of elements.
4
+
5
+ ## Background Color
6
+
7
+ | Class Name | Property | Value |
8
+ | --- | --- | --- |
9
+ | [`.bg-primary-100`](#bg-primary-100) | `background` | `var(--graupl-theme-active--primary--100)` |
10
+ | [`.bg-primary-200`](#bg-primary-200) | `background` | `var(--graupl-theme-active--primary--200)` |
11
+ | [`.bg-primary-300`](#bg-primary-300) | `background` | `var(--graupl-theme-active--primary--300)` |
12
+ | [`.bg-primary-400`](#bg-primary-400) | `background` | `var(--graupl-theme-active--primary--400)` |
13
+ | [`.bg-primary-500`](#bg-primary-500) | `background` | `var(--graupl-theme-active--primary--500)` |
14
+ | [`.bg-primary-600`](#bg-primary-600) | `background` | `var(--graupl-theme-active--primary--600)` |
15
+ | [`.bg-primary-700`](#bg-primary-700) | `background` | `var(--graupl-theme-active--primary--700)` |
16
+ | [`.bg-primary-800`](#bg-primary-800) | `background` | `var(--graupl-theme-active--primary--800)` |
17
+ | [`.bg-primary-900`](#bg-primary-900) | `background` | `var(--graupl-theme-active--primary--900)` |
18
+ | [`.bg-secondary-100`](#bg-secondary-100) | `background` | `var(--graupl-theme-active--secondary--100)` |
19
+ | [`.bg-secondary-200`](#bg-secondary-200) | `background` | `var(--graupl-theme-active--secondary--200)` |
20
+ | [`.bg-secondary-300`](#bg-secondary-300) | `background` | `var(--graupl-theme-active--secondary--300)` |
21
+ | [`.bg-secondary-400`](#bg-secondary-400) | `background` | `var(--graupl-theme-active--secondary--400)` |
22
+ | [`.bg-secondary-500`](#bg-secondary-500) | `background` | `var(--graupl-theme-active--secondary--500)` |
23
+ | [`.bg-secondary-600`](#bg-secondary-600) | `background` | `var(--graupl-theme-active--secondary--600)` |
24
+ | [`.bg-secondary-700`](#bg-secondary-700) | `background` | `var(--graupl-theme-active--secondary--700)` |
25
+ | [`.bg-secondary-800`](#bg-secondary-800) | `background` | `var(--graupl-theme-active--secondary--800)` |
26
+ | [`.bg-secondary-900`](#bg-secondary-900) | `background` | `var(--graupl-theme-active--secondary--900)` |
27
+ | [`.bg-tertiary-100`](#bg-tertiary-100) | `background` | `var(--graupl-theme-active--tertiary--100)` |
28
+ | [`.bg-tertiary-200`](#bg-tertiary-200) | `background` | `var(--graupl-theme-active--tertiary--200)` |
29
+ | [`.bg-tertiary-300`](#bg-tertiary-300) | `background` | `var(--graupl-theme-active--tertiary--300)` |
30
+ | [`.bg-tertiary-400`](#bg-tertiary-400) | `background` | `var(--graupl-theme-active--tertiary--400)` |
31
+ | [`.bg-tertiary-500`](#bg-tertiary-500) | `background` | `var(--graupl-theme-active--tertiary--500)` |
32
+ | [`.bg-tertiary-600`](#bg-tertiary-600) | `background` | `var(--graupl-theme-active--tertiary--600)` |
33
+ | [`.bg-tertiary-700`](#bg-tertiary-700) | `background` | `var(--graupl-theme-active--tertiary--700)` |
34
+ | [`.bg-tertiary-800`](#bg-tertiary-800) | `background` | `var(--graupl-theme-active--tertiary--800)` |
35
+ | [`.bg-tertiary-900`](#bg-tertiary-900) | `background` | `var(--graupl-theme-active--tertiary--900)` |
36
+ | [`.bg-inherit`](#bg-inherit) | `background` | `inherit` |
37
+ | [`.bg-current`](#bg-current) | `background` | `currentColor` |
38
+ | [`.bg-transparent`](#bg-transparent) | `background` | `transparent` |
39
+
40
+ ### `.bg-primary-100`
41
+
42
+ Sets the `background` property to `var(--graupl-theme-active--primary--100)`.
43
+
44
+ ### `.bg-primary-200`
45
+
46
+ Sets the `background` property to `var(--graupl-theme-active--primary--200)`.
47
+
48
+ ### `.bg-primary-300`
49
+
50
+ Sets the `background` property to `var(--graupl-theme-active--primary--300)`.
51
+
52
+ ### `.bg-primary-400`
53
+
54
+ Sets the `background` property to `var(--graupl-theme-active--primary--400)`.
55
+
56
+ ### `.bg-primary-500`
57
+
58
+ Sets the `background` property to `var(--graupl-theme-active--primary--500)`.
59
+
60
+ ### `.bg-primary-600`
61
+
62
+ Sets the `background` property to `var(--graupl-theme-active--primary--600)`.
63
+
64
+ ### `.bg-primary-700`
65
+
66
+ Sets the `background` property to `var(--graupl-theme-active--primary--700)`.
67
+
68
+ ### `.bg-primary-800`
69
+
70
+ Sets the `background` property to `var(--graupl-theme-active--primary--800)`.
71
+
72
+ ### `.bg-primary-900`
73
+
74
+ Sets the `background` property to `var(--graupl-theme-active--primary--900)`.
75
+
76
+ ### `.bg-secondary-100`
77
+
78
+ Sets the `background` property to `var(--graupl-theme-active--secondary--100)`.
79
+
80
+ ### `.bg-secondary-200`
81
+
82
+ Sets the `background` property to `var(--graupl-theme-active--secondary--200)`.
83
+
84
+ ### `.bg-secondary-300`
85
+
86
+ Sets the `background` property to `var(--graupl-theme-active--secondary--300)`.
87
+
88
+ ### `.bg-secondary-400`
89
+
90
+ Sets the `background` property to `var(--graupl-theme-active--secondary--400)`.
91
+
92
+ ### `.bg-secondary-500`
93
+
94
+ Sets the `background` property to `var(--graupl-theme-active--secondary--500)`.
95
+
96
+ ### `.bg-secondary-600`
97
+
98
+ Sets the `background` property to `var(--graupl-theme-active--secondary--600)`.
99
+
100
+ ### `.bg-secondary-700`
101
+
102
+ Sets the `background` property to `var(--graupl-theme-active--secondary--700)`.
103
+
104
+ ### `.bg-secondary-800`
105
+
106
+ Sets the `background` property to `var(--graupl-theme-active--secondary--800)`.
107
+
108
+ ### `.bg-secondary-900`
109
+
110
+ Sets the `background` property to `var(--graupl-theme-active--secondary--900)`.
111
+
112
+ ### `.bg-tertiary-100`
113
+
114
+ Sets the `background` property to `var(--graupl-theme-active--tertiary--100)`.
115
+
116
+ ### `.bg-tertiary-200`
117
+
118
+ Sets the `background` property to `var(--graupl-theme-active--tertiary--200)`.
119
+
120
+ ### `.bg-tertiary-300`
121
+
122
+ Sets the `background` property to `var(--graupl-theme-active--tertiary--300)`.
123
+
124
+ ### `.bg-tertiary-400`
125
+
126
+ Sets the `background` property to `var(--graupl-theme-active--tertiary--400)`.
127
+
128
+ ### `.bg-tertiary-500`
129
+
130
+ Sets the `background` property to `var(--graupl-theme-active--tertiary--500)`.
131
+
132
+ ### `.bg-tertiary-600`
133
+
134
+ Sets the `background` property to `var(--graupl-theme-active--tertiary--600)`.
135
+
136
+ ### `.bg-tertiary-700`
137
+
138
+ Sets the `background` property to `var(--graupl-theme-active--tertiary--700)`.
139
+
140
+ ### `.bg-tertiary-800`
141
+
142
+ Sets the `background` property to `var(--graupl-theme-active--tertiary--800)`.
143
+
144
+ ### `.bg-tertiary-900`
145
+
146
+ Sets the `background` property to `var(--graupl-theme-active--tertiary--900)`.
147
+
148
+ ### `.bg-inherit`
149
+
150
+ Sets the `background` property to `inherit`.
151
+
152
+ ### `.bg-current`
153
+
154
+ Sets the `background` property to `currentColor`.
155
+
156
+ ### `.bg-transparent`
157
+
158
+ Sets the `background` property to `transparent`.
159
+
160
+ ## Text Color
161
+
162
+ | Class Name | Property | Value |
163
+ | --- | --- | --- |
164
+ | [`.text-primary-100`](#text-primary-100) | `color` | `var(--graupl-theme-active--primary--100)` |
165
+ | [`.text-primary-200`](#text-primary-200) | `color` | `var(--graupl-theme-active--primary--200)` |
166
+ | [`.text-primary-300`](#text-primary-300) | `color` | `var(--graupl-theme-active--primary--300)` |
167
+ | [`.text-primary-400`](#text-primary-400) | `color` | `var(--graupl-theme-active--primary--400)` |
168
+ | [`.text-primary-500`](#text-primary-500) | `color` | `var(--graupl-theme-active--primary--500)` |
169
+ | [`.text-primary-600`](#text-primary-600) | `color` | `var(--graupl-theme-active--primary--600)` |
170
+ | [`.text-primary-700`](#text-primary-700) | `color` | `var(--graupl-theme-active--primary--700)` |
171
+ | [`.text-primary-800`](#text-primary-800) | `color` | `var(--graupl-theme-active--primary--800)` |
172
+ | [`.text-primary-900`](#text-primary-900) | `color` | `var(--graupl-theme-active--primary--900)` |
173
+ | [`.text-secondary-100`](#text-secondary-100) | `color` | `var(--graupl-theme-active--secondary--100)` |
174
+ | [`.text-secondary-200`](#text-secondary-200) | `color` | `var(--graupl-theme-active--secondary--200)` |
175
+ | [`.text-secondary-300`](#text-secondary-300) | `color` | `var(--graupl-theme-active--secondary--300)` |
176
+ | [`.text-secondary-400`](#text-secondary-400) | `color` | `var(--graupl-theme-active--secondary--400)` |
177
+ | [`.text-secondary-500`](#text-secondary-500) | `color` | `var(--graupl-theme-active--secondary--500)` |
178
+ | [`.text-secondary-600`](#text-secondary-600) | `color` | `var(--graupl-theme-active--secondary--600)` |
179
+ | [`.text-secondary-700`](#text-secondary-700) | `color` | `var(--graupl-theme-active--secondary--700)` |
180
+ | [`.text-secondary-800`](#text-secondary-800) | `color` | `var(--graupl-theme-active--secondary--800)` |
181
+ | [`.text-secondary-900`](#text-secondary-900) | `color` | `var(--graupl-theme-active--secondary--900)` |
182
+ | [`.text-tertiary-100`](#text-tertiary-100) | `color` | `var(--graupl-theme-active--tertiary--100)` |
183
+ | [`.text-tertiary-200`](#text-tertiary-200) | `color` | `var(--graupl-theme-active--tertiary--200)` |
184
+ | [`.text-tertiary-300`](#text-tertiary-300) | `color` | `var(--graupl-theme-active--tertiary--300)` |
185
+ | [`.text-tertiary-400`](#text-tertiary-400) | `color` | `var(--graupl-theme-active--tertiary--400)` |
186
+ | [`.text-tertiary-500`](#text-tertiary-500) | `color` | `var(--graupl-theme-active--tertiary--500)` |
187
+ | [`.text-tertiary-600`](#text-tertiary-600) | `color` | `var(--graupl-theme-active--tertiary--600)` |
188
+ | [`.text-tertiary-700`](#text-tertiary-700) | `color` | `var(--graupl-theme-active--tertiary--700)` |
189
+ | [`.text-tertiary-800`](#text-tertiary-800) | `color` | `var(--graupl-theme-active--tertiary--800)` |
190
+ | [`.text-tertiary-900`](#text-tertiary-900) | `color` | `var(--graupl-theme-active--tertiary--900)` |
191
+ | [`.text-inherit`](#text-inherit) | `color` | `inherit` |
192
+ | [`.text-current`](#text-current) | `color` | `currentColor` |
193
+ | [`.text-transparent`](#text-transparent) | `color` | `transparent` |
194
+
195
+ ### `.text-primary-100`
196
+
197
+ Sets the `color` property to `var(--graupl-theme-active--primary--100)`.
198
+
199
+ ### `.text-primary-200`
200
+
201
+ Sets the `color` property to `var(--graupl-theme-active--primary--200)`.
202
+
203
+ ### `.text-primary-300`
204
+
205
+ Sets the `color` property to `var(--graupl-theme-active--primary--300)`.
206
+
207
+ ### `.text-primary-400`
208
+
209
+ Sets the `color` property to `var(--graupl-theme-active--primary--400)`.
210
+
211
+ ### `.text-primary-500`
212
+
213
+ Sets the `color` property to `var(--graupl-theme-active--primary--500)`.
214
+
215
+ ### `.text-primary-600`
216
+
217
+ Sets the `color` property to `var(--graupl-theme-active--primary--600)`.
218
+
219
+ ### `.text-primary-700`
220
+
221
+ Sets the `color` property to `var(--graupl-theme-active--primary--700)`.
222
+
223
+ ### `.text-primary-800`
224
+
225
+ Sets the `color` property to `var(--graupl-theme-active--primary--800)`.
226
+
227
+ ### `.text-primary-900`
228
+
229
+ Sets the `color` property to `var(--graupl-theme-active--primary--900)`.
230
+
231
+ ### `.text-secondary-100`
232
+
233
+ Sets the `color` property to `var(--graupl-theme-active--secondary--100)`.
234
+
235
+ ### `.text-secondary-200`
236
+
237
+ Sets the `color` property to `var(--graupl-theme-active--secondary--200)`.
238
+
239
+ ### `.text-secondary-300`
240
+
241
+ Sets the `color` property to `var(--graupl-theme-active--secondary--300)`.
242
+
243
+ ### `.text-secondary-400`
244
+
245
+ Sets the `color` property to `var(--graupl-theme-active--secondary--400)`.
246
+
247
+ ### `.text-secondary-500`
248
+
249
+ Sets the `color` property to `var(--graupl-theme-active--secondary--500)`.
250
+
251
+ ### `.text-secondary-600`
252
+
253
+ Sets the `color` property to `var(--graupl-theme-active--secondary--600)`.
254
+
255
+ ### `.text-secondary-700`
256
+
257
+ Sets the `color` property to `var(--graupl-theme-active--secondary--700)`.
258
+
259
+ ### `.text-secondary-800`
260
+
261
+ Sets the `color` property to `var(--graupl-theme-active--secondary--800)`.
262
+
263
+ ### `.text-secondary-900`
264
+
265
+ Sets the `color` property to `var(--graupl-theme-active--secondary--900)`.
266
+
267
+ ### `.text-tertiary-100`
268
+
269
+ Sets the `color` property to `var(--graupl-theme-active--tertiary--100)`.
270
+
271
+ ### `.text-tertiary-200`
272
+
273
+ Sets the `color` property to `var(--graupl-theme-active--tertiary--200)`.
274
+
275
+ ### `.text-tertiary-300`
276
+
277
+ Sets the `color` property to `var(--graupl-theme-active--tertiary--300)`.
278
+
279
+ ### `.text-tertiary-400`
280
+
281
+ Sets the `color` property to `var(--graupl-theme-active--tertiary--400)`.
282
+
283
+ ### `.text-tertiary-500`
284
+
285
+ Sets the `color` property to `var(--graupl-theme-active--tertiary--500)`.
286
+
287
+ ### `.text-tertiary-600`
288
+
289
+ Sets the `color` property to `var(--graupl-theme-active--tertiary--600)`.
290
+
291
+ ### `.text-tertiary-700`
292
+
293
+ Sets the `color` property to `var(--graupl-theme-active--tertiary--700)`.
294
+
295
+ ### `.text-tertiary-800`
296
+
297
+ Sets the `color` property to `var(--graupl-theme-active--tertiary--800)`.
298
+
299
+ ### `.text-tertiary-900`
300
+
301
+ Sets the `color` property to `var(--graupl-theme-active--tertiary--900)`.
302
+
303
+ ### `.text-inherit`
304
+
305
+ Sets the `color` property to `inherit`.
306
+
307
+ ### `.text-current`
308
+
309
+ Sets the `color` property to `currentColor`.
310
+
311
+ ### `.text-transparent`
312
+
313
+ Sets the `color` property to `transparent`.
314
+
315
+ ## Customization
316
+
317
+ To customize the color utilities, you can use the following variables.
318
+
319
+ | Variable | Default Value | Description |
320
+ | --- | --- | --- |
321
+ | `$selector-base` | `"."` | The base selector for the utility classes. |
322
+ | `$use-important` | `true` | A flag to determine if the `!important` flag should be added to the utility classes. |
323
+ | `$screen-aware` | `false` | A flag to generate screen-aware utility classes. |
324
+ | `$theme-aware` | `true` | A flag to generate theme-aware utility classes. |
325
+ | `$state-aware` | `true` | A flag to generate state-aware utility classes. |
326
+ | `$container-aware` | `false` | A flag to generate container-aware utility classes. |
327
+ | `$screen-aware-separator` | `":"` | The separator for screen-aware utility classes. |
328
+ | `$theme-aware-separator` | `":"` | The separator for theme-aware utility classes. |
329
+ | `$state-aware-separator` | `":"` | The separator for state-aware utility classes. |
330
+ | `$container-aware-separator` | `":"` | The separator for container-aware utility classes. |
331
+ | `$screen-aware-selector-prefix` | `""` | The prefix for the screen-aware utility classes. |
332
+ | `$theme-aware-selector-prefix` | `""` | The prefix for the theme-aware utility classes. |
333
+ | `$state-aware-selector-prefix` | `""` | The prefix for the state-aware utility classes. |
334
+ | `$container-aware-selector-prefix` | `"cq:"` | The prefix for the container-aware utility classes. |
335
+ | `$background-selector-prefix` | `bg-` | The prefix for the background utility classes. |
336
+ | `$custom-background-properties` | `()` | The custom properties and values for the background utility classes. |
337
+ | `$text-selector-prefix` | `text-` | The prefix for the text utility classes. |
338
+ | `$custom-text-properties` | `()` | The custom properties and values for text utility classes. |
339
+
340
+ ## Responsive variants
341
+
342
+ To generate responsive color utilities, you can set the `$screen-aware`, `$theme-aware`, `$state-aware`, or `$container-aware` variables to `true`.
343
+
344
+ By default, theme-aware and state-aware utility classes are generated.
345
+
346
+ ::: tip :pencil2: Note
347
+ For more information on responsive variants, refer to the [Responsive utility classes](./responsive-classes) documentation.
348
+ :::
package/docs/utilities/container.md ADDED
@@ -0,0 +1,3 @@
1
+ # Container Utilities
2
+
3
+ This page needs to be written!
package/docs/utilities/display.md ADDED
@@ -0,0 +1,3 @@
1
+ # Display Utilities
2
+
3
+ This page needs to be written!
package/docs/utilities/flex.md ADDED
@@ -0,0 +1,3 @@
1
+ # Flex Utilities
2
+
3
+ This page needs to be written!
package/docs/utilities/gradient.md ADDED
@@ -0,0 +1,3 @@
1
+ # Gradient Utilities
2
+
3
+ This page needs to be written!
package/docs/utilities/height.md ADDED
@@ -0,0 +1,3 @@
1
+ # Height Utilities
2
+
3
+ This page needs to be written!
package/docs/utilities/inset.md ADDED
@@ -0,0 +1,3 @@
1
+ # Inset Utilities
2
+
3
+ This page needs to be written!
package/docs/utilities/justification.md ADDED
@@ -0,0 +1,3 @@
1
+ # Justification Utilities
2
+
3
+ This page needs to be written!
package/docs/utilities/list.md ADDED
@@ -0,0 +1,3 @@
1
+ # List Utilities
2
+
3
+ This page needs to be written!
package/docs/utilities/order.md ADDED
@@ -0,0 +1,3 @@
1
+ # Order Utilities
2
+
3
+ This page needs to be written!
package/docs/utilities/position.md ADDED
@@ -0,0 +1,3 @@
1
+ # Position Utilities
2
+
3
+ This page needs to be written!
package/docs/utilities/ratio.md ADDED
@@ -0,0 +1,3 @@
1
+ # Ratio Utilities
2
+
3
+ This page needs to be written!
package/docs/utilities/responsive-classes.md ADDED
@@ -0,0 +1,3 @@
1
+ # Responsive Utility Classes
2
+
3
+ This page needs to be written!
package/docs/utilities/spacing.md ADDED
@@ -0,0 +1,3 @@
1
+ # Spacing Utilities
2
+
3
+ This page needs to be written!
package/docs/utilities/typography.md ADDED
@@ -0,0 +1,3 @@
1
+ # Typography Utilities
2
+
3
+ This page needs to be written!
package/docs/utilities/visibility.md ADDED
@@ -0,0 +1,3 @@
1
+ # Visibility Utilities
2
+
3
+ This page needs to be written!
package/docs/utilities/visually-hidden.md ADDED
@@ -0,0 +1,3 @@
1
+ # Visually Hidden Utilities
2
+
3
+ This page needs to be written!
package/docs/utilities/width.md ADDED
@@ -0,0 +1,3 @@
1
+ # Width Utilities
2
+
3
+ This page needs to be written!
package/docs/utilities/z-index.md ADDED
@@ -0,0 +1,3 @@
1
+ # Z Index Utilities
2
+
3
+ This page needs to be written!
package/docs/utilities.md CHANGED
@@ -240,7 +240,7 @@ List style position properties
240
240
 
241
241
  Variables
242
242
 
243
- `$ratio: var(*--#{root-defaults.$prefix}-ratio*);`
243
+ `$ratio: var(*--#{root-defaults.$prefix}ratio*);`
244
244
 
245
245
  Contains element add this class to
246
246
 
package/favicon.ico ADDED
Binary file