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

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 (480) hide show
  1. package/dist/js/accordion.js +5 -0
  2. package/dist/js/accordion.js.map +1 -0
  3. package/dist/js/alert.js +5 -0
  4. package/dist/js/alert.js.map +1 -0
  5. package/dist/js/carousel.js +5 -0
  6. package/dist/js/carousel.js.map +1 -0
  7. package/dist/js/component/accordion.cjs.js +5 -0
  8. package/dist/js/component/accordion.cjs.js.map +1 -0
  9. package/dist/js/component/accordion.es.js +5 -0
  10. package/dist/js/component/accordion.es.js.map +1 -0
  11. package/dist/js/component/accordion.iife.js +5 -0
  12. package/dist/js/component/accordion.iife.js.map +1 -0
  13. package/dist/js/component/alert.cjs.js +5 -0
  14. package/dist/js/component/alert.cjs.js.map +1 -0
  15. package/dist/js/component/alert.es.js +5 -0
  16. package/dist/js/component/alert.es.js.map +1 -0
  17. package/dist/js/component/alert.iife.js +5 -0
  18. package/dist/js/component/alert.iife.js.map +1 -0
  19. package/dist/js/component/carousel.cjs.js +5 -0
  20. package/dist/js/component/carousel.cjs.js.map +1 -0
  21. package/dist/js/component/carousel.es.js +5 -0
  22. package/dist/js/component/carousel.es.js.map +1 -0
  23. package/dist/js/component/carousel.iife.js +5 -0
  24. package/dist/js/component/carousel.iife.js.map +1 -0
  25. package/dist/js/generator/accordion.cjs.js +5 -0
  26. package/dist/js/generator/accordion.cjs.js.map +1 -0
  27. package/dist/js/generator/accordion.es.js +5 -0
  28. package/dist/js/generator/accordion.es.js.map +1 -0
  29. package/dist/js/generator/accordion.iife.js +5 -0
  30. package/dist/js/generator/accordion.iife.js.map +1 -0
  31. package/dist/js/generator/alert.cjs.js +5 -0
  32. package/dist/js/generator/alert.cjs.js.map +1 -0
  33. package/dist/js/generator/alert.es.js +5 -0
  34. package/dist/js/generator/alert.es.js.map +1 -0
  35. package/dist/js/generator/alert.iife.js +5 -0
  36. package/dist/js/generator/alert.iife.js.map +1 -0
  37. package/dist/js/generator/carousel.cjs.js +5 -0
  38. package/dist/js/generator/carousel.cjs.js.map +1 -0
  39. package/dist/js/generator/carousel.es.js +5 -0
  40. package/dist/js/generator/carousel.es.js.map +1 -0
  41. package/dist/js/generator/carousel.iife.js +5 -0
  42. package/dist/js/generator/carousel.iife.js.map +1 -0
  43. package/dist/js/generator/navigation.cjs.js +3 -0
  44. package/dist/js/generator/navigation.cjs.js.map +1 -0
  45. package/dist/js/generator/navigation.es.js +3 -0
  46. package/dist/js/generator/navigation.es.js.map +1 -0
  47. package/dist/js/generator/navigation.iife.js +3 -0
  48. package/dist/js/generator/navigation.iife.js.map +1 -0
  49. package/dist/js/graupl.js +9 -0
  50. package/dist/js/graupl.js.map +1 -0
  51. package/dist/js/navigation.js +3 -0
  52. package/dist/js/navigation.js.map +1 -0
  53. package/package.json +24 -14
  54. package/.browserslistrc +0 -3
  55. package/.czrc +0 -3
  56. package/.devcontainer/devcontainer.json +0 -221
  57. package/.editorconfig +0 -13
  58. package/.env +0 -3
  59. package/.github/CODE_OF_CONDUCT.md +0 -73
  60. package/.github/COMMIT_CONVENTION.md +0 -17
  61. package/.github/CONTRIBUTING.md +0 -86
  62. package/.github/ISSUE_TEMPLATE/bug_report.md +0 -30
  63. package/.github/ISSUE_TEMPLATE/documentation.md +0 -20
  64. package/.github/ISSUE_TEMPLATE/feature_request.md +0 -20
  65. package/.github/SECURITY.md +0 -26
  66. package/.github/dependabot.yml +0 -17
  67. package/.github/pull_request_template.md +0 -5
  68. package/.github/workflows/codeql-analysis.yml +0 -71
  69. package/.github/workflows/docs.yml +0 -66
  70. package/.github/workflows/prerelease.yml +0 -125
  71. package/.github/workflows/release.yml +0 -111
  72. package/.github/workflows/test.yml +0 -78
  73. package/.husky/commit-msg +0 -3
  74. package/.husky/pre-commit +0 -4
  75. package/.prettierignore +0 -12
  76. package/.stylelintignore +0 -9
  77. package/.versionrc.cjs +0 -73
  78. package/.vscode/settings.json +0 -10
  79. package/CHANGELOG.md +0 -559
  80. package/build.js +0 -9
  81. package/combine-at-rules.cjs +0 -61
  82. package/commitlint.config.js +0 -5
  83. package/container/.env +0 -26
  84. package/container/build/app.dockerfile +0 -41
  85. package/container/docker-compose.yml +0 -27
  86. package/dist/js/graupl.cjs.js +0 -7
  87. package/dist/js/graupl.esm.js +0 -2561
  88. package/dist/js/graupl.iife.js +0 -7
  89. package/docs/.vitepress/config.js +0 -108
  90. package/docs/.vitepress/theme/custom.scss +0 -35
  91. package/docs/.vitepress/theme/index.js +0 -4
  92. package/docs/compiling-graupl.md +0 -57
  93. package/docs/components/alert.md +0 -130
  94. package/docs/components/button.md +0 -84
  95. package/docs/components/card.md +0 -369
  96. package/docs/components/index.md +0 -1
  97. package/docs/components/inputgroup.md +0 -159
  98. package/docs/components/menu.md +0 -326
  99. package/docs/components/navigation.md +0 -158
  100. package/docs/content.md +0 -237
  101. package/docs/defaults.md +0 -121
  102. package/docs/forms.md +0 -79
  103. package/docs/functions.md +0 -9
  104. package/docs/getting-started.md +0 -1
  105. package/docs/index.md +0 -1
  106. package/docs/introduction.md +0 -25
  107. package/docs/layout.md +0 -200
  108. package/docs/mixins.md +0 -47
  109. package/docs/state.md +0 -67
  110. package/docs/theme.md +0 -258
  111. package/docs/utilities/alignment.md +0 -411
  112. package/docs/utilities/background.md +0 -192
  113. package/docs/utilities/border.md +0 -268
  114. package/docs/utilities/color.md +0 -348
  115. package/docs/utilities/container.md +0 -3
  116. package/docs/utilities/display.md +0 -3
  117. package/docs/utilities/flex.md +0 -3
  118. package/docs/utilities/gradient.md +0 -3
  119. package/docs/utilities/height.md +0 -3
  120. package/docs/utilities/inset.md +0 -3
  121. package/docs/utilities/justification.md +0 -3
  122. package/docs/utilities/list.md +0 -3
  123. package/docs/utilities/order.md +0 -3
  124. package/docs/utilities/position.md +0 -3
  125. package/docs/utilities/ratio.md +0 -3
  126. package/docs/utilities/responsive-classes.md +0 -3
  127. package/docs/utilities/spacing.md +0 -3
  128. package/docs/utilities/typography.md +0 -3
  129. package/docs/utilities/visibility.md +0 -3
  130. package/docs/utilities/visually-hidden.md +0 -3
  131. package/docs/utilities/width.md +0 -3
  132. package/docs/utilities/z-index.md +0 -3
  133. package/docs/utilities.md +0 -357
  134. package/eslint.config.js +0 -74
  135. package/favicon.ico +0 -0
  136. package/index.html +0 -1214
  137. package/index.js +0 -12
  138. package/lint-staged.config.js +0 -6
  139. package/logo.svg +0 -296
  140. package/packages/core/build.js +0 -9
  141. package/packages/core/dist/css/base/button.css +0 -2
  142. package/packages/core/dist/css/base/button.css.map +0 -1
  143. package/packages/core/dist/css/base/form.css +0 -2
  144. package/packages/core/dist/css/base/form.css.map +0 -1
  145. package/packages/core/dist/css/base/link.css +0 -2
  146. package/packages/core/dist/css/base/link.css.map +0 -1
  147. package/packages/core/dist/css/base/table.css +0 -2
  148. package/packages/core/dist/css/base/table.css.map +0 -1
  149. package/packages/core/dist/css/base.css +0 -2
  150. package/packages/core/dist/css/base.css.map +0 -1
  151. package/packages/core/dist/css/component/accordion.css +0 -5
  152. package/packages/core/dist/css/component/accordion.css.map +0 -1
  153. package/packages/core/dist/css/component/alert.css +0 -2
  154. package/packages/core/dist/css/component/alert.css.map +0 -1
  155. package/packages/core/dist/css/component/card.css +0 -2
  156. package/packages/core/dist/css/component/card.css.map +0 -1
  157. package/packages/core/dist/css/component/carousel.css +0 -2
  158. package/packages/core/dist/css/component/carousel.css.map +0 -1
  159. package/packages/core/dist/css/component/input-group.css +0 -2
  160. package/packages/core/dist/css/component/input-group.css.map +0 -1
  161. package/packages/core/dist/css/component/list.css +0 -2
  162. package/packages/core/dist/css/component/list.css.map +0 -1
  163. package/packages/core/dist/css/component/menu.css +0 -2
  164. package/packages/core/dist/css/component/menu.css.map +0 -1
  165. package/packages/core/dist/css/component/navigation.css +0 -2
  166. package/packages/core/dist/css/component/navigation.css.map +0 -1
  167. package/packages/core/dist/css/component.css +0 -5
  168. package/packages/core/dist/css/component.css.map +0 -1
  169. package/packages/core/dist/css/graupl.css +0 -5
  170. package/packages/core/dist/css/graupl.css.map +0 -1
  171. package/packages/core/dist/css/init.css +0 -2
  172. package/packages/core/dist/css/init.css.map +0 -1
  173. package/packages/core/dist/css/layout/columns.css +0 -2
  174. package/packages/core/dist/css/layout/columns.css.map +0 -1
  175. package/packages/core/dist/css/layout/container.css +0 -2
  176. package/packages/core/dist/css/layout/container.css.map +0 -1
  177. package/packages/core/dist/css/layout/flex-columns.css +0 -2
  178. package/packages/core/dist/css/layout/flex-columns.css.map +0 -1
  179. package/packages/core/dist/css/layout.css +0 -5
  180. package/packages/core/dist/css/layout.css.map +0 -1
  181. package/packages/core/dist/css/normalize.css +0 -2
  182. package/packages/core/dist/css/normalize.css.map +0 -1
  183. package/packages/core/dist/css/state/focus.css +0 -2
  184. package/packages/core/dist/css/state/focus.css.map +0 -1
  185. package/packages/core/dist/css/state.css +0 -2
  186. package/packages/core/dist/css/state.css.map +0 -1
  187. package/packages/core/dist/css/theme/color.css +0 -2
  188. package/packages/core/dist/css/theme/color.css.map +0 -1
  189. package/packages/core/dist/css/theme/typography.css +0 -2
  190. package/packages/core/dist/css/theme/typography.css.map +0 -1
  191. package/packages/core/dist/css/theme.css +0 -2
  192. package/packages/core/dist/css/theme.css.map +0 -1
  193. package/packages/core/dist/css/utilities/alignment.css +0 -2
  194. package/packages/core/dist/css/utilities/alignment.css.map +0 -1
  195. package/packages/core/dist/css/utilities/background.css +0 -2
  196. package/packages/core/dist/css/utilities/background.css.map +0 -1
  197. package/packages/core/dist/css/utilities/border.css +0 -2
  198. package/packages/core/dist/css/utilities/border.css.map +0 -1
  199. package/packages/core/dist/css/utilities/color.css +0 -2
  200. package/packages/core/dist/css/utilities/color.css.map +0 -1
  201. package/packages/core/dist/css/utilities/container.css +0 -2
  202. package/packages/core/dist/css/utilities/container.css.map +0 -1
  203. package/packages/core/dist/css/utilities/display.css +0 -2
  204. package/packages/core/dist/css/utilities/display.css.map +0 -1
  205. package/packages/core/dist/css/utilities/flex.css +0 -2
  206. package/packages/core/dist/css/utilities/flex.css.map +0 -1
  207. package/packages/core/dist/css/utilities/gradient.css +0 -2
  208. package/packages/core/dist/css/utilities/gradient.css.map +0 -1
  209. package/packages/core/dist/css/utilities/height.css +0 -2
  210. package/packages/core/dist/css/utilities/height.css.map +0 -1
  211. package/packages/core/dist/css/utilities/inset.css +0 -2
  212. package/packages/core/dist/css/utilities/inset.css.map +0 -1
  213. package/packages/core/dist/css/utilities/justification.css +0 -2
  214. package/packages/core/dist/css/utilities/justification.css.map +0 -1
  215. package/packages/core/dist/css/utilities/list.css +0 -2
  216. package/packages/core/dist/css/utilities/list.css.map +0 -1
  217. package/packages/core/dist/css/utilities/order.css +0 -2
  218. package/packages/core/dist/css/utilities/order.css.map +0 -1
  219. package/packages/core/dist/css/utilities/position.css +0 -2
  220. package/packages/core/dist/css/utilities/position.css.map +0 -1
  221. package/packages/core/dist/css/utilities/ratio.css +0 -2
  222. package/packages/core/dist/css/utilities/ratio.css.map +0 -1
  223. package/packages/core/dist/css/utilities/spacing.css +0 -2
  224. package/packages/core/dist/css/utilities/spacing.css.map +0 -1
  225. package/packages/core/dist/css/utilities/typography.css +0 -2
  226. package/packages/core/dist/css/utilities/typography.css.map +0 -1
  227. package/packages/core/dist/css/utilities/visibility.css +0 -2
  228. package/packages/core/dist/css/utilities/visibility.css.map +0 -1
  229. package/packages/core/dist/css/utilities/visually-hidden.css +0 -2
  230. package/packages/core/dist/css/utilities/visually-hidden.css.map +0 -1
  231. package/packages/core/dist/css/utilities/width.css +0 -2
  232. package/packages/core/dist/css/utilities/width.css.map +0 -1
  233. package/packages/core/dist/css/utilities/z-index.css +0 -2
  234. package/packages/core/dist/css/utilities/z-index.css.map +0 -1
  235. package/packages/core/dist/css/utilities.css +0 -2
  236. package/packages/core/dist/css/utilities.css.map +0 -1
  237. package/packages/core/package.json +0 -58
  238. package/packages/core/scss/base/button.scss +0 -3
  239. package/packages/core/scss/base/form.scss +0 -3
  240. package/packages/core/scss/base/link.scss +0 -3
  241. package/packages/core/scss/base/table.scss +0 -3
  242. package/packages/core/scss/base.scss +0 -3
  243. package/packages/core/scss/component/accordion.scss +0 -3
  244. package/packages/core/scss/component/alert.scss +0 -3
  245. package/packages/core/scss/component/card.scss +0 -3
  246. package/packages/core/scss/component/carousel.scss +0 -3
  247. package/packages/core/scss/component/input-group.scss +0 -3
  248. package/packages/core/scss/component/list.scss +0 -3
  249. package/packages/core/scss/component/menu.scss +0 -3
  250. package/packages/core/scss/component/navigation.scss +0 -3
  251. package/packages/core/scss/component.scss +0 -3
  252. package/packages/core/scss/graupl.scss +0 -3
  253. package/packages/core/scss/init.scss +0 -3
  254. package/packages/core/scss/layout/columns.scss +0 -3
  255. package/packages/core/scss/layout/container.scss +0 -3
  256. package/packages/core/scss/layout/flex-columns.scss +0 -3
  257. package/packages/core/scss/layout.scss +0 -3
  258. package/packages/core/scss/normalize.scss +0 -3
  259. package/packages/core/scss/state/focus.scss +0 -3
  260. package/packages/core/scss/state.scss +0 -3
  261. package/packages/core/scss/theme/color.scss +0 -3
  262. package/packages/core/scss/theme/typography.scss +0 -3
  263. package/packages/core/scss/theme.scss +0 -3
  264. package/packages/core/scss/utilities/alignment.scss +0 -3
  265. package/packages/core/scss/utilities/background.scss +0 -3
  266. package/packages/core/scss/utilities/border.scss +0 -3
  267. package/packages/core/scss/utilities/color.scss +0 -3
  268. package/packages/core/scss/utilities/container.scss +0 -3
  269. package/packages/core/scss/utilities/display.scss +0 -3
  270. package/packages/core/scss/utilities/flex.scss +0 -3
  271. package/packages/core/scss/utilities/gradient.scss +0 -3
  272. package/packages/core/scss/utilities/height.scss +0 -3
  273. package/packages/core/scss/utilities/inset.scss +0 -3
  274. package/packages/core/scss/utilities/justification.scss +0 -3
  275. package/packages/core/scss/utilities/list.scss +0 -3
  276. package/packages/core/scss/utilities/order.scss +0 -3
  277. package/packages/core/scss/utilities/position.scss +0 -3
  278. package/packages/core/scss/utilities/ratio.scss +0 -3
  279. package/packages/core/scss/utilities/spacing.scss +0 -3
  280. package/packages/core/scss/utilities/typography.scss +0 -3
  281. package/packages/core/scss/utilities/visibility.scss +0 -3
  282. package/packages/core/scss/utilities/visually-hidden.scss +0 -3
  283. package/packages/core/scss/utilities/width.scss +0 -3
  284. package/packages/core/scss/utilities/z-index.scss +0 -3
  285. package/packages/core/scss/utilities.scss +0 -3
  286. package/packages/core/src/js/accordion/Accordion.js +0 -1163
  287. package/packages/core/src/js/accordion/AccordionItem.js +0 -496
  288. package/packages/core/src/js/accordion/index.js +0 -10
  289. package/packages/core/src/js/alert/Alert.js +0 -581
  290. package/packages/core/src/js/alert/index.js +0 -11
  291. package/packages/core/src/js/carousel/Carousel.js +0 -1427
  292. package/packages/core/src/js/carousel/index.js +0 -10
  293. package/packages/core/src/js/domHelpers.js +0 -37
  294. package/packages/core/src/js/eventHandlers.js +0 -39
  295. package/packages/core/src/js/navigation/index.js +0 -36
  296. package/packages/core/src/js/storage.js +0 -106
  297. package/packages/core/src/js/validate.js +0 -225
  298. package/packages/core/src/scss/_defaults.scss +0 -184
  299. package/packages/core/src/scss/_index.scss +0 -15
  300. package/packages/core/src/scss/_init.scss +0 -6
  301. package/packages/core/src/scss/_normalize.scss +0 -197
  302. package/packages/core/src/scss/_variables.scss +0 -95
  303. package/packages/core/src/scss/base/_index.scss +0 -6
  304. package/packages/core/src/scss/base/button/_defaults.scss +0 -49
  305. package/packages/core/src/scss/base/button/_index.scss +0 -206
  306. package/packages/core/src/scss/base/button/_mixins.scss +0 -104
  307. package/packages/core/src/scss/base/button/_variables.scss +0 -252
  308. package/packages/core/src/scss/base/form/_defaults.scss +0 -24
  309. package/packages/core/src/scss/base/form/_index.scss +0 -227
  310. package/packages/core/src/scss/base/form/_variables.scss +0 -245
  311. package/packages/core/src/scss/base/link/_defaults.scss +0 -35
  312. package/packages/core/src/scss/base/link/_index.scss +0 -245
  313. package/packages/core/src/scss/base/link/_variables.scss +0 -370
  314. package/packages/core/src/scss/base/table/_defaults.scss +0 -68
  315. package/packages/core/src/scss/base/table/_index.scss +0 -314
  316. package/packages/core/src/scss/base/table/_variables.scss +0 -309
  317. package/packages/core/src/scss/component/_index.scss +0 -10
  318. package/packages/core/src/scss/component/accordion/_defaults.scss +0 -40
  319. package/packages/core/src/scss/component/accordion/_index.scss +0 -198
  320. package/packages/core/src/scss/component/accordion/_variables.scss +0 -356
  321. package/packages/core/src/scss/component/alert/_defaults.scss +0 -49
  322. package/packages/core/src/scss/component/alert/_index.scss +0 -119
  323. package/packages/core/src/scss/component/alert/_variables.scss +0 -200
  324. package/packages/core/src/scss/component/card/_defaults.scss +0 -32
  325. package/packages/core/src/scss/component/card/_index.scss +0 -212
  326. package/packages/core/src/scss/component/card/_variables.scss +0 -216
  327. package/packages/core/src/scss/component/carousel/_defaults.scss +0 -43
  328. package/packages/core/src/scss/component/carousel/_index.scss +0 -192
  329. package/packages/core/src/scss/component/carousel/_variables.scss +0 -104
  330. package/packages/core/src/scss/component/input-group/_defaults.scss +0 -30
  331. package/packages/core/src/scss/component/input-group/_index.scss +0 -47
  332. package/packages/core/src/scss/component/input-group/_variables.scss +0 -66
  333. package/packages/core/src/scss/component/list/_defaults.scss +0 -15
  334. package/packages/core/src/scss/component/list/_index.scss +0 -52
  335. package/packages/core/src/scss/component/list/_variables.scss +0 -236
  336. package/packages/core/src/scss/component/menu/_defaults.scss +0 -57
  337. package/packages/core/src/scss/component/menu/_index.scss +0 -308
  338. package/packages/core/src/scss/component/menu/_variables.scss +0 -642
  339. package/packages/core/src/scss/component/navigation/_defaults.scss +0 -23
  340. package/packages/core/src/scss/component/navigation/_index.scss +0 -190
  341. package/packages/core/src/scss/component/navigation/_variables.scss +0 -290
  342. package/packages/core/src/scss/functions/_container.scss +0 -38
  343. package/packages/core/src/scss/functions/_important.scss +0 -36
  344. package/packages/core/src/scss/functions/_screen.scss +0 -38
  345. package/packages/core/src/scss/functions/_theme.scss +0 -39
  346. package/packages/core/src/scss/functions/_utility.scss +0 -28
  347. package/packages/core/src/scss/layout/_index.scss +0 -5
  348. package/packages/core/src/scss/layout/columns/_defaults.scss +0 -24
  349. package/packages/core/src/scss/layout/columns/_index.scss +0 -137
  350. package/packages/core/src/scss/layout/columns/_variables.scss +0 -55
  351. package/packages/core/src/scss/layout/container/_defaults.scss +0 -35
  352. package/packages/core/src/scss/layout/container/_index.scss +0 -628
  353. package/packages/core/src/scss/layout/container/_variables.scss +0 -114
  354. package/packages/core/src/scss/layout/flex-columns/_defaults.scss +0 -28
  355. package/packages/core/src/scss/layout/flex-columns/_index.scss +0 -184
  356. package/packages/core/src/scss/layout/flex-columns/_variables.scss +0 -30
  357. package/packages/core/src/scss/mixins/_animation.scss +0 -15
  358. package/packages/core/src/scss/mixins/_container.scss +0 -80
  359. package/packages/core/src/scss/mixins/_layer.scss +0 -16
  360. package/packages/core/src/scss/mixins/_screen.scss +0 -77
  361. package/packages/core/src/scss/mixins/_state.scss +0 -18
  362. package/packages/core/src/scss/mixins/_theme.scss +0 -15
  363. package/packages/core/src/scss/mixins/_utility.scss +0 -185
  364. package/packages/core/src/scss/mixins/_visually-hidden.scss +0 -30
  365. package/packages/core/src/scss/state/_index.scss +0 -3
  366. package/packages/core/src/scss/state/focus/_defaults.scss +0 -9
  367. package/packages/core/src/scss/state/focus/_index.scss +0 -42
  368. package/packages/core/src/scss/state/focus/_mixins.scss +0 -13
  369. package/packages/core/src/scss/state/focus/_variables.scss +0 -50
  370. package/packages/core/src/scss/theme/_index.scss +0 -4
  371. package/packages/core/src/scss/theme/color/_defaults.scss +0 -143
  372. package/packages/core/src/scss/theme/color/_index.scss +0 -42
  373. package/packages/core/src/scss/theme/color/_variables.scss +0 -133
  374. package/packages/core/src/scss/theme/typography/_defaults.scss +0 -54
  375. package/packages/core/src/scss/theme/typography/_index.scss +0 -120
  376. package/packages/core/src/scss/theme/typography/_variables.scss +0 -248
  377. package/packages/core/src/scss/utilities/_index.scss +0 -23
  378. package/packages/core/src/scss/utilities/_template/_defaults.scss +0 -41
  379. package/packages/core/src/scss/utilities/_template/_index.scss +0 -171
  380. package/packages/core/src/scss/utilities/_template/_variables.scss +0 -6
  381. package/packages/core/src/scss/utilities/alignment/_defaults.scss +0 -76
  382. package/packages/core/src/scss/utilities/alignment/_index.scss +0 -336
  383. package/packages/core/src/scss/utilities/alignment/_variables.scss +0 -6
  384. package/packages/core/src/scss/utilities/background/_defaults.scss +0 -122
  385. package/packages/core/src/scss/utilities/background/_index.scss +0 -634
  386. package/packages/core/src/scss/utilities/background/_variables.scss +0 -6
  387. package/packages/core/src/scss/utilities/border/_defaults.scss +0 -73
  388. package/packages/core/src/scss/utilities/border/_index.scss +0 -558
  389. package/packages/core/src/scss/utilities/border/_variables.scss +0 -6
  390. package/packages/core/src/scss/utilities/color/_defaults.scss +0 -49
  391. package/packages/core/src/scss/utilities/color/_index.scss +0 -469
  392. package/packages/core/src/scss/utilities/color/_variables.scss +0 -6
  393. package/packages/core/src/scss/utilities/container/_defaults.scss +0 -40
  394. package/packages/core/src/scss/utilities/container/_index.scss +0 -174
  395. package/packages/core/src/scss/utilities/container/_variables.scss +0 -6
  396. package/packages/core/src/scss/utilities/display/_defaults.scss +0 -47
  397. package/packages/core/src/scss/utilities/display/_index.scss +0 -184
  398. package/packages/core/src/scss/utilities/display/_variables.scss +0 -6
  399. package/packages/core/src/scss/utilities/flex/_defaults.scss +0 -99
  400. package/packages/core/src/scss/utilities/flex/_index.scss +0 -486
  401. package/packages/core/src/scss/utilities/flex/_variables.scss +0 -6
  402. package/packages/core/src/scss/utilities/gradient/_defaults.scss +0 -70
  403. package/packages/core/src/scss/utilities/gradient/_index.scss +0 -696
  404. package/packages/core/src/scss/utilities/gradient/_variables.scss +0 -29
  405. package/packages/core/src/scss/utilities/height/_defaults.scss +0 -54
  406. package/packages/core/src/scss/utilities/height/_index.scss +0 -525
  407. package/packages/core/src/scss/utilities/height/_variables.scss +0 -6
  408. package/packages/core/src/scss/utilities/inset/_defaults.scss +0 -55
  409. package/packages/core/src/scss/utilities/inset/_index.scss +0 -258
  410. package/packages/core/src/scss/utilities/inset/_variables.scss +0 -6
  411. package/packages/core/src/scss/utilities/justification/_defaults.scss +0 -73
  412. package/packages/core/src/scss/utilities/justification/_index.scss +0 -333
  413. package/packages/core/src/scss/utilities/justification/_variables.scss +0 -6
  414. package/packages/core/src/scss/utilities/list/_defaults.scss +0 -53
  415. package/packages/core/src/scss/utilities/list/_index.scss +0 -253
  416. package/packages/core/src/scss/utilities/list/_variables.scss +0 -6
  417. package/packages/core/src/scss/utilities/order/_defaults.scss +0 -36
  418. package/packages/core/src/scss/utilities/order/_index.scss +0 -246
  419. package/packages/core/src/scss/utilities/order/_variables.scss +0 -6
  420. package/packages/core/src/scss/utilities/position/_defaults.scss +0 -41
  421. package/packages/core/src/scss/utilities/position/_index.scss +0 -178
  422. package/packages/core/src/scss/utilities/position/_variables.scss +0 -6
  423. package/packages/core/src/scss/utilities/ratio/_defaults.scss +0 -42
  424. package/packages/core/src/scss/utilities/ratio/_index.scss +0 -188
  425. package/packages/core/src/scss/utilities/ratio/_variables.scss +0 -9
  426. package/packages/core/src/scss/utilities/spacing/_defaults.scss +0 -64
  427. package/packages/core/src/scss/utilities/spacing/_index.scss +0 -970
  428. package/packages/core/src/scss/utilities/spacing/_variables.scss +0 -6
  429. package/packages/core/src/scss/utilities/typography/_defaults.scss +0 -58
  430. package/packages/core/src/scss/utilities/typography/_index.scss +0 -1089
  431. package/packages/core/src/scss/utilities/typography/_variables.scss +0 -6
  432. package/packages/core/src/scss/utilities/visibility/_defaults.scss +0 -39
  433. package/packages/core/src/scss/utilities/visibility/_index.scss +0 -173
  434. package/packages/core/src/scss/utilities/visibility/_variables.scss +0 -6
  435. package/packages/core/src/scss/utilities/visually-hidden/_defaults.scss +0 -29
  436. package/packages/core/src/scss/utilities/visually-hidden/_index.scss +0 -189
  437. package/packages/core/src/scss/utilities/visually-hidden/_variables.scss +0 -6
  438. package/packages/core/src/scss/utilities/width/_defaults.scss +0 -54
  439. package/packages/core/src/scss/utilities/width/_index.scss +0 -525
  440. package/packages/core/src/scss/utilities/width/_variables.scss +0 -6
  441. package/packages/core/src/scss/utilities/z-index/_defaults.scss +0 -40
  442. package/packages/core/src/scss/utilities/z-index/_index.scss +0 -173
  443. package/packages/core/src/scss/utilities/z-index/_variables.scss +0 -6
  444. package/packages/core/vite.config.js +0 -28
  445. package/packages/icons/dist/css/base/button.css +0 -2
  446. package/packages/icons/dist/css/base/button.css.map +0 -1
  447. package/packages/icons/dist/css/base/link.css +0 -2
  448. package/packages/icons/dist/css/base/link.css.map +0 -1
  449. package/packages/icons/dist/css/base.css +0 -2
  450. package/packages/icons/dist/css/base.css.map +0 -1
  451. package/packages/icons/dist/css/component/icon.css +0 -2
  452. package/packages/icons/dist/css/component/icon.css.map +0 -1
  453. package/packages/icons/dist/css/component.css +0 -2
  454. package/packages/icons/dist/css/component.css.map +0 -1
  455. package/packages/icons/dist/css/icon.css +0 -2
  456. package/packages/icons/dist/css/icon.css.map +0 -1
  457. package/packages/icons/package.json +0 -48
  458. package/packages/icons/scss/base/button.scss +0 -3
  459. package/packages/icons/scss/base/link.scss +0 -3
  460. package/packages/icons/scss/base.scss +0 -3
  461. package/packages/icons/scss/component/icon.scss +0 -3
  462. package/packages/icons/scss/component.scss +0 -3
  463. package/packages/icons/scss/icon.scss +0 -3
  464. package/packages/icons/src/scss/_index.scss +0 -4
  465. package/packages/icons/src/scss/base/_index.scss +0 -4
  466. package/packages/icons/src/scss/base/button/_defaults.scss +0 -7
  467. package/packages/icons/src/scss/base/button/_index.scss +0 -58
  468. package/packages/icons/src/scss/base/button/_variables.scss +0 -7
  469. package/packages/icons/src/scss/base/link/_defaults.scss +0 -7
  470. package/packages/icons/src/scss/base/link/_index.scss +0 -58
  471. package/packages/icons/src/scss/base/link/_variables.scss +0 -7
  472. package/packages/icons/src/scss/component/_index.scss +0 -3
  473. package/packages/icons/src/scss/component/icon/_defaults.scss +0 -30
  474. package/packages/icons/src/scss/component/icon/_index.scss +0 -60
  475. package/packages/icons/src/scss/component/icon/_mixins.scss +0 -62
  476. package/packages/icons/src/scss/component/icon/_variables.scss +0 -24
  477. package/postcss.config.cjs +0 -11
  478. package/prettier.config.js +0 -16
  479. package/stylelint.config.js +0 -22
  480. package/vite.config.js +0 -28
@@ -1,268 +0,0 @@
1
- # Border Utilities
2
-
3
- The border utilities provide a set of classes to adjust the `border-width`, `border-color`, and `border-style` properties of elements.
4
-
5
- ## `.bordered`
6
-
7
- Applies the default border styling to an element.
8
-
9
- ```css
10
- .bordered {
11
- border-width: var(--graupl-border-width);
12
- border-radius: var(--graupl-border-radius);
13
- border-style: var(--graupl-border-style);
14
- }
15
- ```
16
-
17
- ## Border widths
18
-
19
- | Class Name | Property | Value |
20
- | --- | --- | --- |
21
- | [`.border-thick`](#border-thick) | `border-width` | `thick` |
22
- | [`.border-thin`](#border-thin) | `border-width` | `thin` |
23
- | [`.border-medium`](#border-medium) | `border-width` | `medium` |
24
-
25
- ### `.border-thick`
26
-
27
- Sets the `border-width` property to `thick`.
28
-
29
- ### `.border-thin`
30
-
31
- Sets the `border-width` property to `thin`.
32
-
33
- ### `.border-medium`
34
-
35
- Sets the `border-width` property to `medium`.
36
-
37
- ## Border colors
38
-
39
- | Class Name | Property | Value |
40
- | --- | --- | --- |
41
- | [`.border-primary-100`](#border-primary-100) | `border-color` | `var(--graupl-theme-active--primary--100)` |
42
- | [`.border-primary-200`](#border-primary-200) | `border-color` | `var(--graupl-theme-active--primary--200)` |
43
- | [`.border-primary-300`](#border-primary-300) | `border-color` | `var(--graupl-theme-active--primary--300)` |
44
- | [`.border-primary-400`](#border-primary-400) | `border-color` | `var(--graupl-theme-active--primary--400)` |
45
- | [`.border-primary-500`](#border-primary-500) | `border-color` | `var(--graupl-theme-active--primary--500)` |
46
- | [`.border-primary-600`](#border-primary-600) | `border-color` | `var(--graupl-theme-active--primary--600)` |
47
- | [`.border-primary-700`](#border-primary-700) | `border-color` | `var(--graupl-theme-active--primary--700)` |
48
- | [`.border-primary-800`](#border-primary-800) | `border-color` | `var(--graupl-theme-active--primary--800)` |
49
- | [`.border-primary-900`](#border-primary-900) | `border-color` | `var(--graupl-theme-active--primary--900)` |
50
- | [`.border-secondary-100`](#border-secondary-100) | `border-color` | `var(--graupl-theme-active--secondary--100)` |
51
- | [`.border-secondary-200`](#border-secondary-200) | `border-color` | `var(--graupl-theme-active--secondary--200)` |
52
- | [`.border-secondary-300`](#border-secondary-300) | `border-color` | `var(--graupl-theme-active--secondary--300)` |
53
- | [`.border-secondary-400`](#border-secondary-400) | `border-color` | `var(--graupl-theme-active--secondary--400)` |
54
- | [`.border-secondary-500`](#border-secondary-500) | `border-color` | `var(--graupl-theme-active--secondary--500)` |
55
- | [`.border-secondary-600`](#border-secondary-600) | `border-color` | `var(--graupl-theme-active--secondary--600)` |
56
- | [`.border-secondary-700`](#border-secondary-700) | `border-color` | `var(--graupl-theme-active--secondary--700)` |
57
- | [`.border-secondary-800`](#border-secondary-800) | `border-color` | `var(--graupl-theme-active--secondary--800)` |
58
- | [`.border-secondary-900`](#border-secondary-900) | `border-color` | `var(--graupl-theme-active--secondary--900)` |
59
- | [`.border-tertiary-100`](#border-tertiary-100) | `border-color` | `var(--graupl-theme-active--tertiary--100)` |
60
- | [`.border-tertiary-200`](#border-tertiary-200) | `border-color` | `var(--graupl-theme-active--tertiary--200)` |
61
- | [`.border-tertiary-300`](#border-tertiary-300) | `border-color` | `var(--graupl-theme-active--tertiary--300)` |
62
- | [`.border-tertiary-400`](#border-tertiary-400) | `border-color` | `var(--graupl-theme-active--tertiary--400)` |
63
- | [`.border-tertiary-500`](#border-tertiary-500) | `border-color` | `var(--graupl-theme-active--tertiary--500)` |
64
- | [`.border-tertiary-600`](#border-tertiary-600) | `border-color` | `var(--graupl-theme-active--tertiary--600)` |
65
- | [`.border-tertiary-700`](#border-tertiary-700) | `border-color` | `var(--graupl-theme-active--tertiary--700)` |
66
- | [`.border-tertiary-800`](#border-tertiary-800) | `border-color` | `var(--graupl-theme-active--tertiary--800)` |
67
- | [`.border-tertiary-900`](#border-tertiary-900) | `border-color` | `var(--graupl-theme-active--tertiary--900)` |
68
- | [`.border-transparent`](#border-transparent) | `border-color` | `transparent` |
69
-
70
- ### `.border-primary-100`
71
-
72
- Sets the `border-color` property to `var(--graupl-theme-active--primary--100)`.
73
-
74
- ### `.border-primary-200`
75
-
76
- Sets the `border-color` property to `var(--graupl-theme-active--primary--200)`.
77
-
78
- ### `.border-primary-300`
79
-
80
- Sets the `border-color` property to `var(--graupl-theme-active--primary--300)`.
81
-
82
- ### `.border-primary-400`
83
-
84
- Sets the `border-color` property to `var(--graupl-theme-active--primary--400)`.
85
-
86
- ### `.border-primary-500`
87
-
88
- Sets the `border-color` property to `var(--graupl-theme-active--primary--500)`.
89
-
90
- ### `.border-primary-600`
91
-
92
- Sets the `border-color` property to `var(--graupl-theme-active--primary--600)`.
93
-
94
- ### `.border-primary-700`
95
-
96
- Sets the `border-color` property to `var(--graupl-theme-active--primary--700)`.
97
-
98
- ### `.border-primary-800`
99
-
100
- Sets the `border-color` property to `var(--graupl-theme-active--primary--800)`.
101
-
102
- ### `.border-primary-900`
103
-
104
- Sets the `border-color` property to `var(--graupl-theme-active--primary--900)`.
105
-
106
- ### `.border-secondary-100`
107
-
108
- Sets the `border-color` property to `var(--graupl-theme-active--secondary--100)`.
109
-
110
- ### `.border-secondary-200`
111
-
112
- Sets the `border-color` property to `var(--graupl-theme-active--secondary--200)`.
113
-
114
- ### `.border-secondary-300`
115
-
116
- Sets the `border-color` property to `var(--graupl-theme-active--secondary--300)`.
117
-
118
- ### `.border-secondary-400`
119
-
120
- Sets the `border-color` property to `var(--graupl-theme-active--secondary--400)`.
121
-
122
- ### `.border-secondary-500`
123
-
124
- Sets the `border-color` property to `var(--graupl-theme-active--secondary--500)`.
125
-
126
- ### `.border-secondary-600`
127
-
128
- Sets the `border-color` property to `var(--graupl-theme-active--secondary--600)`.
129
-
130
- ### `.border-secondary-700`
131
-
132
- Sets the `border-color` property to `var(--graupl-theme-active--secondary--700)`.
133
-
134
- ### `.border-secondary-800`
135
-
136
- Sets the `border-color` property to `var(--graupl-theme-active--secondary--800)`.
137
-
138
- ### `.border-secondary-900`
139
-
140
- Sets the `border-color` property to `var(--graupl-theme-active--secondary--900)`.
141
-
142
- ### `.border-tertiary-100`
143
-
144
- Sets the `border-color` property to `var(--graupl-theme-active--tertiary--100)`.
145
-
146
- ### `.border-tertiary-200`
147
-
148
- Sets the `border-color` property to `var(--graupl-theme-active--tertiary--200)`.
149
-
150
- ### `.border-tertiary-300`
151
-
152
- Sets the `border-color` property to `var(--graupl-theme-active--tertiary--300)`.
153
-
154
- ### `.border-tertiary-400`
155
-
156
- Sets the `border-color` property to `var(--graupl-theme-active--tertiary--400)`.
157
-
158
- ### `.border-tertiary-500`
159
-
160
- Sets the `border-color` property to `var(--graupl-theme-active--tertiary--500)`.
161
-
162
- ### `.border-tertiary-600`
163
-
164
- Sets the `border-color` property to `var(--graupl-theme-active--tertiary--600)`.
165
-
166
- ### `.border-tertiary-700`
167
-
168
- Sets the `border-color` property to `var(--graupl-theme-active--tertiary--700)`.
169
-
170
- ### `.border-tertiary-800`
171
-
172
- Sets the `border-color` property to `var(--graupl-theme-active--tertiary--800)`.
173
-
174
- ### `.border-tertiary-900`
175
-
176
- Sets the `border-color` property to `var(--graupl-theme-active--tertiary--900)`.
177
-
178
- ### `.border-transparent`
179
-
180
- Sets the `border-color` property to `transparent`.
181
-
182
- ## Border styles
183
-
184
- | Class Name | Property | Value |
185
- | --- | --- | --- |
186
- | [`.border-solid`](#border-solid) | `border-style` | `solid` |
187
- | [`.border-dashed`](#border-dashed) | `border-style` | `dashed` |
188
- | [`.border-dotted`](#border-dotted) | `border-style` | `dotted` |
189
- | [`.border-double`](#border-double) | `border-style` | `double` |
190
- | [`.border-groove`](#border-groove) | `border-style` | `groove` |
191
- | [`.border-ridge`](#border-ridge) | `border-style` | `ridge` |
192
- | [`.border-inset`](#border-inset) | `border-style` | `inset` |
193
- | [`.border-outset`](#border-outset) | `border-style` | `outset` |
194
- | [`.border-none`](#border-none) | `border-style` | `none` |
195
-
196
- ### `.border-solid`
197
-
198
- Sets the `border-style` property to `solid`.
199
-
200
- ### `.border-dashed`
201
-
202
- Sets the `border-style` property to `dashed`.
203
-
204
- ### `.border-dotted`
205
-
206
- Sets the `border-style` property to `dotted`.
207
-
208
- ### `.border-double`
209
-
210
- Sets the `border-style` property to `double`.
211
-
212
- ### `.border-groove`
213
-
214
- Sets the `border-style` property to `groove`.
215
-
216
- ### `.border-ridge`
217
-
218
- Sets the `border-style` property to `ridge`.
219
-
220
- ### `.border-inset`
221
-
222
- Sets the `border-style` property to `inset`.
223
-
224
- ### `.border-outset`
225
-
226
- Sets the `border-style` property to `outset`.
227
-
228
- ### `.border-none`
229
-
230
- Sets the `border-style` property to `none`.
231
-
232
- ## Customization
233
-
234
- To customize the border utilities, you can use the following variables.
235
-
236
- | Variable | Default Value | Description |
237
- | --- | --- | --- |
238
- | `$selector-base` | `"."` | The base selector for the utility classes. |
239
- | `$use-important` | `true` | A flag to determine if the `!important` flag should be added to the utility classes. |
240
- | `$screen-aware` | `false` | A flag to generate screen-aware utility classes. |
241
- | `$theme-aware` | `false` | A flag to generate theme-aware utility classes. |
242
- | `$state-aware` | `false` | A flag to generate state-aware utility classes. |
243
- | `$container-aware` | `false` | A flag to generate container-aware utility classes. |
244
- | `$screen-aware-separator` | `":"` | The separator for screen-aware utility classes. |
245
- | `$theme-aware-separator` | `":"` | The separator for theme-aware utility classes. |
246
- | `$state-aware-separator` | `":"` | The separator for state-aware utility classes. |
247
- | `$container-aware-separator` | `":"` | The separator for container-aware utility classes. |
248
- | `$screen-aware-selector-prefix` | `""` | The prefix for the screen-aware utility classes. |
249
- | `$theme-aware-selector-prefix` | `""` | The prefix for the theme-aware utility classes. |
250
- | `$state-aware-selector-prefix` | `""` | The prefix for the state-aware utility classes. |
251
- | `$container-aware-selector-prefix` | `"cq:"` | The prefix for the container-aware utility classes. |
252
- | `$default-border-selector` | `"bordered"` | The selector for the default border utility class. |
253
- | `$border-width-selector-prefix` | `"border-"` | The prefix for the border width utility classes. |
254
- | `$custom-border-width-properties` | `()` | The custom properties and values for the border width utility classes. |
255
- | `$border-color-selector-prefix` | `"border-"` | The prefix for the border color utility classes. |
256
- | `$custom-border-color-properties` | `()` | The custom properties and values for the border color utility classes. |
257
- | `$border-style-selector-prefix` | `"border-"` | The prefix for the border style utility classes. |
258
- | `$custom-border-style-properties` | `()` | The custom properties and values for the border style utility classes. |
259
-
260
- ## Responsive variants
261
-
262
- To generate responsive border utilities, you can set the `$screen-aware`, `$theme-aware`, `$state-aware`, or `$container-aware` variables to `true`.
263
-
264
- By default, no responsive alignment utilities are generated.
265
-
266
- ::: tip :pencil2: Note
267
- For more information on responsive variants, refer to the [Responsive utility classes](./responsive-classes) documentation.
268
- :::
@@ -1,348 +0,0 @@
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
- :::
@@ -1,3 +0,0 @@
1
- # Container Utilities
2
-
3
- This page needs to be written!
@@ -1,3 +0,0 @@
1
- # Display Utilities
2
-
3
- This page needs to be written!
@@ -1,3 +0,0 @@
1
- # Flex Utilities
2
-
3
- This page needs to be written!
@@ -1,3 +0,0 @@
1
- # Gradient Utilities
2
-
3
- This page needs to be written!
@@ -1,3 +0,0 @@
1
- # Height Utilities
2
-
3
- This page needs to be written!
@@ -1,3 +0,0 @@
1
- # Inset Utilities
2
-
3
- This page needs to be written!
@@ -1,3 +0,0 @@
1
- # Justification Utilities
2
-
3
- This page needs to be written!
@@ -1,3 +0,0 @@
1
- # List Utilities
2
-
3
- This page needs to be written!
@@ -1,3 +0,0 @@
1
- # Order Utilities
2
-
3
- This page needs to be written!
@@ -1,3 +0,0 @@
1
- # Position Utilities
2
-
3
- This page needs to be written!
@@ -1,3 +0,0 @@
1
- # Ratio Utilities
2
-
3
- This page needs to be written!
@@ -1,3 +0,0 @@
1
- # Responsive Utility Classes
2
-
3
- This page needs to be written!
@@ -1,3 +0,0 @@
1
- # Spacing Utilities
2
-
3
- This page needs to be written!
@@ -1,3 +0,0 @@
1
- # Typography Utilities
2
-
3
- This page needs to be written!