fokus-styles 2.0.0 → 2.3.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (131) hide show
  1. package/CHANGELOG.md +13 -0
  2. package/README.md +4 -3
  3. package/dist/css/components.css +510 -2
  4. package/dist/css/components.css.map +1 -1
  5. package/dist/css/components.min.css +1 -1
  6. package/dist/css/components.min.css.map +1 -1
  7. package/dist/css/fokus-components.css +4050 -0
  8. package/dist/css/fokus-components.css.map +1 -0
  9. package/dist/css/fokus-components.min.css +2 -0
  10. package/dist/css/fokus-components.min.css.map +1 -0
  11. package/dist/css/fokus-core.css +1563 -0
  12. package/dist/css/fokus-core.css.map +1 -0
  13. package/dist/css/fokus-core.min.css +2 -0
  14. package/dist/css/fokus-core.min.css.map +1 -0
  15. package/dist/css/fokus-dark.css +304 -0
  16. package/dist/css/fokus-dark.css.map +1 -0
  17. package/dist/css/fokus-dark.min.css +2 -0
  18. package/dist/css/fokus-dark.min.css.map +1 -0
  19. package/dist/css/fokus-utilities.css +4176 -0
  20. package/dist/css/fokus-utilities.css.map +1 -0
  21. package/dist/css/fokus-utilities.min.css +2 -0
  22. package/dist/css/fokus-utilities.min.css.map +1 -0
  23. package/dist/css/fokus.css +1339 -53
  24. package/dist/css/fokus.css.map +1 -1
  25. package/dist/css/fokus.min.css +1 -1
  26. package/dist/css/fokus.min.css.map +1 -1
  27. package/dist/css/forms.css +115 -2
  28. package/dist/css/forms.css.map +1 -1
  29. package/dist/css/forms.min.css +1 -1
  30. package/dist/css/forms.min.css.map +1 -1
  31. package/dist/css/helpers.css +376 -2
  32. package/dist/css/helpers.css.map +1 -1
  33. package/dist/css/helpers.min.css +1 -1
  34. package/dist/css/helpers.min.css.map +1 -1
  35. package/dist/css/layout.css +560 -2
  36. package/dist/css/layout.css.map +1 -1
  37. package/dist/css/layout.min.css +1 -1
  38. package/dist/css/layout.min.css.map +1 -1
  39. package/dist/js/fokus.js +347 -12
  40. package/dist/js/fokus.js.map +4 -4
  41. package/dist/js/fokus.min.js +17 -17
  42. package/dist/js/fokus.min.js.map +4 -4
  43. package/docs/components/accordion.md +3 -0
  44. package/docs/components/avatar.md +13 -0
  45. package/docs/components/button-group.md +13 -0
  46. package/docs/components/close-button.md +13 -0
  47. package/docs/components/code.md +13 -0
  48. package/docs/components/icon-link.md +13 -0
  49. package/docs/components/list-group.md +13 -0
  50. package/docs/components/modal.md +3 -0
  51. package/docs/components/navbar.md +3 -0
  52. package/docs/components/pagination.md +3 -0
  53. package/docs/components/placeholder.md +13 -0
  54. package/docs/components/ratio.md +13 -0
  55. package/docs/components/scrollspy.md +13 -0
  56. package/docs/components/skeleton.md +3 -0
  57. package/docs/components/table.md +3 -0
  58. package/docs/guides/javascript-api.md +9 -0
  59. package/docs/guides/utility-api.md +9 -0
  60. package/docs/reference/size-baseline.json +13 -13
  61. package/mockup/assets/example-theme.css +3 -1
  62. package/mockup/assets/example-theme.js +2 -0
  63. package/mockup/assets/showcase-contracts.js +2 -2
  64. package/mockup/assets/showcase.css +4 -2
  65. package/mockup/assets/showcase.js +2 -0
  66. package/mockup/examples/js-foundation.html +25 -0
  67. package/mockup/examples/tables-navbar.html +12 -8
  68. package/mockup/examples/theming.html +2 -1
  69. package/mockup/foundations.html +2 -2
  70. package/package.json +14 -1
  71. package/packages/fokus-cli/bin/fokus.mjs +18 -1
  72. package/packages/fokus-cli/lib/build.mjs +12 -2
  73. package/packages/fokus-components/scss/components/_accordion.scss +19 -0
  74. package/packages/fokus-components/scss/components/_avatar.scss +22 -0
  75. package/packages/fokus-components/scss/components/_button-group.scss +14 -0
  76. package/packages/fokus-components/scss/components/_close-button.scss +22 -0
  77. package/packages/fokus-components/scss/components/_code.scss +19 -0
  78. package/packages/fokus-components/scss/components/_icon-link.scss +8 -0
  79. package/packages/fokus-components/scss/components/_index.scss +10 -0
  80. package/packages/fokus-components/scss/components/_list-group.scss +26 -0
  81. package/packages/fokus-components/scss/components/_modal.scss +36 -0
  82. package/packages/fokus-components/scss/components/_navbar.scss +48 -0
  83. package/packages/fokus-components/scss/components/_offcanvas.scss +19 -0
  84. package/packages/fokus-components/scss/components/_pagination.scss +10 -0
  85. package/packages/fokus-components/scss/components/_placeholder.scss +13 -0
  86. package/packages/fokus-components/scss/components/_progress.scss +8 -0
  87. package/packages/fokus-components/scss/components/_ratio.scss +10 -0
  88. package/packages/fokus-components/scss/components/_scrollspy.scss +5 -0
  89. package/packages/fokus-components/scss/components/_skeleton.scss +19 -0
  90. package/packages/fokus-components/scss/components/_spinner.scss +9 -53
  91. package/packages/fokus-components/scss/components/_tables.scss +20 -0
  92. package/packages/fokus-components/scss/forms/_forms.scss +29 -0
  93. package/packages/fokus-core/scss/base/_accessibility.scss +45 -0
  94. package/packages/fokus-core/scss/base/_index.scss +1 -0
  95. package/packages/fokus-core/scss/layout/_grid.scss +18 -0
  96. package/packages/fokus-core/scss/settings/_config.scss +43 -0
  97. package/packages/fokus-core/scss/settings/_index.scss +1 -0
  98. package/packages/fokus-core/scss/themes/_dark.scss +38 -2
  99. package/packages/fokus-core/scss/tokens/_root.scss +14 -0
  100. package/packages/fokus-core/scss/tools/_mixins.scss +8 -0
  101. package/packages/fokus-js/js/accordion.js +7 -1
  102. package/packages/fokus-js/js/core/focus.js +20 -0
  103. package/packages/fokus-js/js/core/overlay.d.ts +2 -0
  104. package/packages/fokus-js/js/core/overlay.js +10 -0
  105. package/packages/fokus-js/js/core/register.js +4 -2
  106. package/packages/fokus-js/js/focus-trap.d.ts +3 -0
  107. package/packages/fokus-js/js/focus-trap.js +1 -0
  108. package/packages/fokus-js/js/fokus.d.ts +7 -0
  109. package/packages/fokus-js/js/fokus.js +7 -0
  110. package/packages/fokus-js/js/form-validation.d.ts +7 -0
  111. package/packages/fokus-js/js/form-validation.js +20 -0
  112. package/packages/fokus-js/js/modal.js +16 -2
  113. package/packages/fokus-js/js/navbar.d.ts +10 -0
  114. package/packages/fokus-js/js/navbar.js +27 -0
  115. package/packages/fokus-js/js/offcanvas.d.ts +4 -0
  116. package/packages/fokus-js/js/offcanvas.js +16 -2
  117. package/packages/fokus-js/js/pagination.d.ts +7 -0
  118. package/packages/fokus-js/js/pagination.js +38 -0
  119. package/packages/fokus-js/js/scrollspy.d.ts +7 -0
  120. package/packages/fokus-js/js/scrollspy.js +26 -0
  121. package/packages/fokus-js/js/spinner.d.ts +9 -0
  122. package/packages/fokus-js/js/spinner.js +18 -0
  123. package/packages/fokus-js/js/theme.d.ts +9 -0
  124. package/packages/fokus-js/js/theme.js +19 -0
  125. package/packages/fokus-js/js/toast.js +4 -0
  126. package/packages/fokus-utilities/scss/utilities/_api.scss +48 -0
  127. package/packages/fokus-utilities/scss/utilities/_index.scss +2 -0
  128. package/packages/fokus-utilities/scss/utilities/_states.scss +19 -0
  129. package/packages/fokus-utilities/scss/utilities/_visibility.scss +24 -0
  130. package/scss/entries/core-entry.scss +5 -0
  131. package/scss/entries/dark-entry.scss +3 -0
@@ -6,4 +6,28 @@
6
6
  .fs-u-invisible {
7
7
  visibility: hidden;
8
8
  }
9
+
10
+ .fs-u-visually-hidden,
11
+ .fs-u-visually-hidden-focusable {
12
+ position: absolute !important;
13
+ width: 1px !important;
14
+ height: 1px !important;
15
+ padding: 0 !important;
16
+ margin: -1px !important;
17
+ overflow: hidden !important;
18
+ clip-path: inset(50%) !important;
19
+ white-space: nowrap !important;
20
+ border: 0 !important;
21
+ }
22
+
23
+ .fs-u-visually-hidden-focusable:focus,
24
+ .fs-u-visually-hidden-focusable:focus-within {
25
+ position: static !important;
26
+ width: auto !important;
27
+ height: auto !important;
28
+ margin: 0 !important;
29
+ overflow: visible !important;
30
+ clip-path: none !important;
31
+ white-space: normal !important;
32
+ }
9
33
  }
@@ -0,0 +1,5 @@
1
+ @charset "UTF-8";
2
+ @use "../../packages/fokus-core/scss/tokens";
3
+ @use "../../packages/fokus-core/scss/base";
4
+ @use "../../packages/fokus-core/scss/layout";
5
+ @use "../../packages/fokus-core/scss/themes";
@@ -0,0 +1,3 @@
1
+ @charset "UTF-8";
2
+ @use "../../packages/fokus-core/scss/tokens";
3
+ @use "../../packages/fokus-core/scss/themes/dark";