@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
@@ -1,305 +0,0 @@
1
- // @graupl/graupl menu component styles.
2
-
3
- @use "defaults";
4
- @use "variables" as *;
5
- @use "../../defaults" as root-defaults;
6
- @use "../../base/button/defaults" as button-defaults;
7
- @use "../../base/button/variables" as button-variables;
8
- @use "../../mixins/layer" as *;
9
- @use "../../mixins/animation";
10
-
11
- @include layer(component) {
12
- #{defaults.$menu-selector} {
13
- --#{root-defaults.$prefix}-link-padding: #{$menu-link-padding};
14
- --#{root-defaults.$prefix}-link-border-width: #{$menu-link-border-width};
15
- --#{root-defaults.$prefix}-link-border-radius: #{$menu-link-border-radius};
16
- --#{root-defaults.$prefix}-link-border-style: #{$menu-link-border-style};
17
- --#{root-defaults.$prefix}-link-text-decoration: #{$menu-link-text-decoration};
18
- --#{root-defaults.$prefix}-link-text-decoration-thickness: #{$menu-link-text-decoration-thickness};
19
- --#{root-defaults.$prefix}-link-text-decoration-style: #{$menu-link-text-decoration-style};
20
- --#{root-defaults.$prefix}-link-transform: #{$menu-link-transform};
21
- --#{root-defaults.$prefix}-link-visited-text-decoration: #{$menu-link-visited-text-decoration};
22
- --#{root-defaults.$prefix}-link-visited-text-decoration-thickness: #{$menu-link-visited-text-decoration-thickness};
23
- --#{root-defaults.$prefix}-link-visited-text-decoration-style: #{$menu-link-visited-text-decoration-style};
24
- --#{root-defaults.$prefix}-link-visited-transform: #{$menu-link-visited-transform};
25
- --#{root-defaults.$prefix}-link-focus-text-decoration: #{$menu-link-focus-text-decoration};
26
- --#{root-defaults.$prefix}-link-focus-text-decoration-thickness: #{$menu-link-focus-text-decoration-thickness};
27
- --#{root-defaults.$prefix}-link-focus-text-decoration-style: #{$menu-link-focus-text-decoration-style};
28
- --#{root-defaults.$prefix}-link-focus-transform: #{$menu-link-focus-transform};
29
- --#{root-defaults.$prefix}-link-hover-text-decoration: #{$menu-link-hover-text-decoration};
30
- --#{root-defaults.$prefix}-link-hover-text-decoration-thickness: #{$menu-link-hover-text-decoration-thickness};
31
- --#{root-defaults.$prefix}-link-hover-text-decoration-style: #{$menu-link-hover-text-decoration-style};
32
- --#{root-defaults.$prefix}-link-hover-transform: #{$menu-link-hover-transform};
33
- --#{root-defaults.$prefix}-link-active-text-decoration: #{$menu-link-active-text-decoration};
34
- --#{root-defaults.$prefix}-link-active-text-decoration-thickness: #{$menu-link-active-text-decoration-thickness};
35
- --#{root-defaults.$prefix}-link-active-text-decoration-style: #{$menu-link-active-text-decoration-style};
36
- --#{root-defaults.$prefix}-link-active-transform: #{$menu-link-active-transform};
37
- --#{root-defaults.$prefix}-link-disabled-text-decoration: #{$menu-link-disabled-text-decoration};
38
- --#{root-defaults.$prefix}-link-disabled-text-decoration-thickness: #{$menu-link-disabled-text-decoration-thickness};
39
- --#{root-defaults.$prefix}-link-disabled-text-decoration-style: #{$menu-link-disabled-text-decoration-style};
40
- --#{root-defaults.$prefix}-link-disabled-transform: #{$menu-link-disabled-transform};
41
-
42
- display: $menu-display;
43
- flex-direction: $menu-flex-direction;
44
- padding: $menu-padding;
45
- border: $menu-border;
46
- border-radius: $menu-border-radius;
47
- list-style: none;
48
- gap: $menu-gap;
49
- isolation: isolate;
50
-
51
- &#{defaults.$menu-show-selector} {
52
- --#{root-defaults.$prefix}-menu-display: #{$menu-show-display};
53
- }
54
-
55
- &#{defaults.$menu-hide-selector} {
56
- --#{root-defaults.$prefix}-menu-display: #{$menu-hide-display};
57
- }
58
- }
59
-
60
- #{defaults.$submenu-selector} {
61
- display: $submenu-display;
62
- position: $submenu-position;
63
- z-index: $submenu-z-index;
64
- flex: 1 1;
65
- flex-direction: $submenu-flex-direction;
66
- padding: $submenu-padding;
67
- border: $submenu-border;
68
- border-radius: $submenu-border-radius;
69
- list-style: none;
70
- gap: $submenu-gap;
71
- isolation: isolate;
72
- inset: $submenu-inset;
73
-
74
- &#{defaults.$menu-show-selector} {
75
- --#{root-defaults.$prefix}-submenu-display: #{$submenu-show-display};
76
- }
77
-
78
- &#{defaults.$menu-hide-selector} {
79
- --#{root-defaults.$prefix}-submenu-display: #{$submenu-hide-display};
80
- }
81
- }
82
-
83
- #{defaults.$menu-item-selector} {
84
- display: flex;
85
- position: relative;
86
- flex-wrap: wrap;
87
- align-items: center;
88
- justify-content: center;
89
- min-width: $menu-item-min-width;
90
- max-width: $menu-item-max-width;
91
- padding: $menu-item-padding;
92
- }
93
-
94
- #{defaults.$menu-link-selector} {
95
- display: flex;
96
- width: 100%;
97
- padding: $menu-link-padding;
98
- transform: $menu-link-transform;
99
- transition: $menu-link-transition;
100
- border: $menu-link-border;
101
- border-radius: $menu-link-border-radius;
102
- text-decoration: $menu-link-text-decoration;
103
- text-decoration-style: $menu-link-text-decoration-style;
104
- gap: $menu-link-gap;
105
- text-decoration-thickness: $menu-link-text-decoration-thickness;
106
-
107
- &:visited {
108
- --#{root-defaults.$prefix}-menu-link-text-decoration: #{$menu-link-visited-text-decoration};
109
- --#{root-defaults.$prefix}-menu-link-text-decoration-thickness: #{$menu-link-visited-text-decoration-thickness};
110
- --#{root-defaults.$prefix}-menu-link-text-decoration-style: #{$menu-link-visited-text-decoration-style};
111
- --#{root-defaults.$prefix}-menu-link-transform: #{$menu-link-visited-transform};
112
- }
113
-
114
- &:focus-visible {
115
- --#{root-defaults.$prefix}-menu-link-text-decoration: #{$menu-link-focus-text-decoration};
116
- --#{root-defaults.$prefix}-menu-link-text-decoration-thickness: #{$menu-link-focus-text-decoration-thickness};
117
- --#{root-defaults.$prefix}-menu-link-text-decoration-style: #{$menu-link-focus-text-decoration-style};
118
- --#{root-defaults.$prefix}-menu-link-transform: #{$menu-link-focus-transform};
119
- }
120
-
121
- &:hover {
122
- --#{root-defaults.$prefix}-menu-link-text-decoration: #{$menu-link-hover-text-decoration};
123
- --#{root-defaults.$prefix}-menu-link-text-decoration-thickness: #{$menu-link-hover-text-decoration-thickness};
124
- --#{root-defaults.$prefix}-menu-link-text-decoration-style: #{$menu-link-hover-text-decoration-style};
125
- --#{root-defaults.$prefix}-menu-link-transform: #{$menu-link-hover-transform};
126
- }
127
-
128
- &:active {
129
- --#{root-defaults.$prefix}-menu-link-text-decoration: #{$menu-link-active-text-decoration};
130
- --#{root-defaults.$prefix}-menu-link-text-decoration-thickness: #{$menu-link-active-text-decoration-thickness};
131
- --#{root-defaults.$prefix}-menu-link-text-decoration-style: #{$menu-link-active-text-decoration-style};
132
- --#{root-defaults.$prefix}-menu-link-transform: #{$menu-link-active-transform};
133
- }
134
-
135
- &:disabled,
136
- &[disabled] {
137
- &,
138
- &:visited,
139
- &:focus-visible,
140
- &:hover,
141
- &:active {
142
- --#{root-defaults.$prefix}-menu-link-text-decoration: #{$menu-link-disabled-text-decoration};
143
- --#{root-defaults.$prefix}-menu-link-text-decoration-thickness: #{$menu-link-disabled-text-decoration-thickness};
144
- --#{root-defaults.$prefix}-menu-link-text-decoration-style: #{$menu-link-disabled-text-decoration-style};
145
- --#{root-defaults.$prefix}-menu-link-transform: #{$menu-link-disabled-transform};
146
- }
147
- }
148
-
149
- &#{button-defaults.$button-selector} {
150
- --#{root-defaults.$prefix}-menu-link-padding: #{button-variables.$button-padding};
151
- --#{root-defaults.$prefix}-menu-link-border-width: #{button-variables.$button-border-width};
152
- --#{root-defaults.$prefix}-menu-link-border-radius: #{button-variables.$button-border-radius};
153
- --#{root-defaults.$prefix}-menu-link-border-style: #{button-variables.$button-border-style};
154
- --#{root-defaults.$prefix}-menu-link-text-decoration: none;
155
- --#{root-defaults.$prefix}-menu-link-visited-text-decoration: none;
156
- --#{root-defaults.$prefix}-menu-link-focus-text-decoration: none;
157
- --#{root-defaults.$prefix}-menu-link-hover-text-decoration: none;
158
- --#{root-defaults.$prefix}-menu-link-active-text-decoration: none;
159
- --#{root-defaults.$prefix}-menu-link-disabled-text-decoration: none;
160
- --#{root-defaults.$prefix}-menu-link-transition: #{button-variables.$button-transition};
161
- --#{root-defaults.$prefix}-menu-link-transition-reduced-motion: #{button-variables.$button-transition-reduced-motion};
162
- --#{root-defaults.$prefix}-menu-link-transform: #{button-variables.$button-transform};
163
- --#{root-defaults.$prefix}-menu-link-visited-transform: #{button-variables.$button-visited-transform};
164
- --#{root-defaults.$prefix}-menu-link-focus-transform: #{button-variables.$button-focus-transform};
165
- --#{root-defaults.$prefix}-menu-link-hover-transform: #{button-variables.$button-hover-transform};
166
- --#{root-defaults.$prefix}-menu-link-active-transform: #{button-variables.$button-active-transform};
167
- --#{root-defaults.$prefix}-menu-link-disabled-transform: #{button-variables.$button-disabled-transform};
168
- }
169
- }
170
-
171
- #{defaults.$submenu-toggle-selector} {
172
- display: flex;
173
- align-items: center;
174
- justify-content: space-between;
175
-
176
- &::after {
177
- content: $submenu-toggle-content;
178
- display: block;
179
- transform: $submenu-toggle-transform;
180
- transition: $submenu-toggle-transition;
181
- }
182
-
183
- &[aria-expanded="true"]::after {
184
- --#{root-defaults.$prefix}-submenu-toggle-transform: #{$submenu-toggle-open-transform};
185
- }
186
- }
187
-
188
- @include animation.off {
189
- #{defaults.$menu-link-selector} {
190
- --#{root-defaults.$prefix}-menu-link-transition: #{$menu-link-transition-reduced-motion};
191
- }
192
-
193
- #{defaults.$submenu-toggle-selector}::after {
194
- --#{root-defaults.$prefix}-submenu-toggle-transition: #{$submenu-toggle-transition-reduced-motion};
195
- }
196
- }
197
- }
198
-
199
- @include layer(theme) {
200
- #{defaults.$menu-selector} {
201
- --#{root-defaults.$prefix}-link-color: #{$menu-link-color};
202
- --#{root-defaults.$prefix}-link-background: #{$menu-link-background};
203
- --#{root-defaults.$prefix}-link-border-color: #{$menu-link-border-color};
204
- --#{root-defaults.$prefix}-link-text-decoration-color: #{$menu-link-text-decoration-color};
205
- --#{root-defaults.$prefix}-link-visited-color: #{$menu-link-visited-color};
206
- --#{root-defaults.$prefix}-link-visited-background: #{$menu-link-visited-background};
207
- --#{root-defaults.$prefix}-link-visited-border-color: #{$menu-link-visited-border-color};
208
- --#{root-defaults.$prefix}-link-visited-text-decoration-color: #{$menu-link-visited-text-decoration-color};
209
- --#{root-defaults.$prefix}-link-focus-color: #{$menu-link-focus-color};
210
- --#{root-defaults.$prefix}-link-focus-background: #{$menu-link-focus-background};
211
- --#{root-defaults.$prefix}-link-focus-border-color: #{$menu-link-focus-border-color};
212
- --#{root-defaults.$prefix}-link-focus-text-decoration-color: #{$menu-link-focus-text-decoration-color};
213
- --#{root-defaults.$prefix}-link-hover-color: #{$menu-link-hover-color};
214
- --#{root-defaults.$prefix}-link-hover-background: #{$menu-link-hover-background};
215
- --#{root-defaults.$prefix}-link-hover-border-color: #{$menu-link-hover-border-color};
216
- --#{root-defaults.$prefix}-link-hover-text-decoration-color: #{$menu-link-hover-text-decoration-color};
217
- --#{root-defaults.$prefix}-link-active-color: #{$menu-link-active-color};
218
- --#{root-defaults.$prefix}-link-active-background: #{$menu-link-active-background};
219
- --#{root-defaults.$prefix}-link-active-border-color: #{$menu-link-active-border-color};
220
- --#{root-defaults.$prefix}-link-active-text-decoration-color: #{$menu-link-active-text-decoration-color};
221
- --#{root-defaults.$prefix}-link-disabled-color: #{$menu-link-disabled-color};
222
- --#{root-defaults.$prefix}-link-disabled-background: #{$menu-link-disabled-background};
223
- --#{root-defaults.$prefix}-link-disabled-border-color: #{$menu-link-disabled-border-color};
224
- --#{root-defaults.$prefix}-link-disabled-text-decoration-color: #{$menu-link-disabled-text-decoration-color};
225
-
226
- border-color: $menu-border-color;
227
- background: $menu-background;
228
- color: $menu-color;
229
- }
230
-
231
- #{defaults.$submenu-selector} {
232
- border-color: $submenu-border-color;
233
- background: $submenu-background;
234
- color: $submenu-color;
235
- }
236
-
237
- #{defaults.$menu-link-selector} {
238
- border-color: $menu-link-border-color;
239
- background: $menu-link-background;
240
- color: $menu-link-color;
241
- text-decoration-color: $menu-link-text-decoration-color;
242
-
243
- &:visited {
244
- --#{root-defaults.$prefix}-menu-link-background: #{$menu-link-visited-background};
245
- --#{root-defaults.$prefix}-menu-link-color: #{$menu-link-visited-color};
246
- --#{root-defaults.$prefix}-menu-link-text-decoration-color: #{$menu-link-visited-text-decoration-color};
247
- --#{root-defaults.$prefix}-menu-link-border-color: #{$menu-link-visited-border-color};
248
- }
249
-
250
- &:focus-visible {
251
- --#{root-defaults.$prefix}-menu-link-background: #{$menu-link-focus-background};
252
- --#{root-defaults.$prefix}-menu-link-color: #{$menu-link-focus-color};
253
- --#{root-defaults.$prefix}-menu-link-text-decoration-color: #{$menu-link-focus-text-decoration-color};
254
- --#{root-defaults.$prefix}-menu-link-border-color: #{$menu-link-focus-border-color};
255
- }
256
-
257
- &:hover {
258
- --#{root-defaults.$prefix}-menu-link-background: #{$menu-link-hover-background};
259
- --#{root-defaults.$prefix}-menu-link-color: #{$menu-link-hover-color};
260
- --#{root-defaults.$prefix}-menu-link-text-decoration-color: #{$menu-link-hover-text-decoration-color};
261
- --#{root-defaults.$prefix}-menu-link-border-color: #{$menu-link-hover-border-color};
262
- }
263
-
264
- &:active {
265
- --#{root-defaults.$prefix}-menu-link-background: #{$menu-link-active-background};
266
- --#{root-defaults.$prefix}-menu-link-color: #{$menu-link-active-color};
267
- --#{root-defaults.$prefix}-menu-link-text-decoration-color: #{$menu-link-active-text-decoration-color};
268
- --#{root-defaults.$prefix}-menu-link-border-color: #{$menu-link-active-border-color};
269
- }
270
-
271
- &:disabled {
272
- &,
273
- &:hover,
274
- &:active,
275
- &:focus-visible,
276
- &:visited {
277
- --#{root-defaults.$prefix}-menu-link-background: #{$menu-link-disabled-background};
278
- --#{root-defaults.$prefix}-menu-link-color: #{$menu-link-disabled-color};
279
- --#{root-defaults.$prefix}-menu-link-text-decoration-color: #{$menu-link-disabled-text-decoration-color};
280
- --#{root-defaults.$prefix}-menu-link-border-color: #{$menu-link-disabled-border-color};
281
- }
282
- }
283
-
284
- &#{button-defaults.$button-selector} {
285
- --#{root-defaults.$prefix}-menu-link-background: #{button-variables.$button-background};
286
- --#{root-defaults.$prefix}-menu-link-color: #{button-variables.$button-color};
287
- --#{root-defaults.$prefix}-menu-link-border-color: #{button-variables.$button-border-color};
288
- --#{root-defaults.$prefix}-menu-link-visited-background: #{button-variables.$button-visited-background};
289
- --#{root-defaults.$prefix}-menu-link-visited-color: #{button-variables.$button-visited-color};
290
- --#{root-defaults.$prefix}-menu-link-visited-border-color: #{button-variables.$button-visited-border-color};
291
- --#{root-defaults.$prefix}-menu-link-focus-background: #{button-variables.$button-focus-background};
292
- --#{root-defaults.$prefix}-menu-link-focus-color: #{button-variables.$button-focus-color};
293
- --#{root-defaults.$prefix}-menu-link-focus-border-color: #{button-variables.$button-focus-border-color};
294
- --#{root-defaults.$prefix}-menu-link-hover-background: #{button-variables.$button-hover-background};
295
- --#{root-defaults.$prefix}-menu-link-hover-color: #{button-variables.$button-hover-color};
296
- --#{root-defaults.$prefix}-menu-link-hover-border-color: #{button-variables.$button-hover-border-color};
297
- --#{root-defaults.$prefix}-menu-link-active-background: #{button-variables.$button-active-background};
298
- --#{root-defaults.$prefix}-menu-link-active-color: #{button-variables.$button-active-color};
299
- --#{root-defaults.$prefix}-menu-link-active-border-color: #{button-variables.$button-active-border-color};
300
- --#{root-defaults.$prefix}-menu-link-disabled-background: #{button-variables.$button-disabled-background};
301
- --#{root-defaults.$prefix}-menu-link-disabled-color: #{button-variables.$button-disabled-color};
302
- --#{root-defaults.$prefix}-menu-link-disabled-border-color: #{button-variables.$button-disabled-border-color};
303
- }
304
- }
305
- }