@amsterdam/design-system-css 0.1.2 → 0.1.4

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 (50) hide show
  1. package/dist/accordion/accordion.css +69 -0
  2. package/dist/accordion/accordion.css.map +1 -0
  3. package/dist/button/button.css +706 -0
  4. package/dist/button/button.css.map +1 -0
  5. package/dist/form-label/form-label.css +26 -0
  6. package/dist/form-label/form-label.css.map +1 -0
  7. package/dist/heading/heading.css +45 -95
  8. package/dist/heading/heading.css.map +1 -1
  9. package/dist/icon/icon.css +106 -21
  10. package/dist/icon/icon.css.map +1 -1
  11. package/dist/link/link.css +83 -55
  12. package/dist/link/link.css.map +1 -1
  13. package/dist/list/list.css +5 -0
  14. package/dist/list/list.css.map +1 -1
  15. package/dist/paragraph/paragraph.css +40 -44
  16. package/dist/paragraph/paragraph.css.map +1 -1
  17. package/dist/unordered-list/unordered-list.css +47 -0
  18. package/dist/unordered-list/unordered-list.css.map +1 -0
  19. package/package.json +7 -6
  20. package/src/accordion/README.md +19 -0
  21. package/src/accordion/accordion.scss +63 -0
  22. package/src/button/README.md +24 -0
  23. package/src/button/button-css.md +12 -0
  24. package/src/button/button.scss +19 -0
  25. package/src/form-label/README.md +3 -0
  26. package/src/form-label/form-label.scss +18 -0
  27. package/src/heading/README.md +23 -0
  28. package/src/heading/heading-css.md +3 -0
  29. package/src/heading/heading.scss +41 -25
  30. package/src/icon/README.md +19 -0
  31. package/src/icon/icon.scss +88 -18
  32. package/src/link/README.md +26 -0
  33. package/src/link/link.scss +88 -32
  34. package/src/list/list.scss +11 -0
  35. package/src/paragraph/README.md +24 -0
  36. package/src/paragraph/paragraph-css.md +3 -0
  37. package/src/paragraph/paragraph.scss +36 -9
  38. package/src/unordered-list/README.md +15 -0
  39. package/src/unordered-list/unordered-list.scss +44 -0
  40. package/utils/breakpoint.scss +7 -2
  41. package/utils/calculate-fluid-style.scss +6 -1
  42. package/dist/document/document.css +0 -22
  43. package/dist/document/document.css.map +0 -1
  44. package/dist/grid/grid.css +0 -340
  45. package/dist/grid/grid.css.map +0 -1
  46. package/dist/spacing/spacing.css +0 -249
  47. package/dist/spacing/spacing.css.map +0 -1
  48. package/src/document/document.scss +0 -16
  49. package/src/grid/grid.scss +0 -83
  50. package/src/spacing/spacing.scss +0 -60
@@ -0,0 +1,69 @@
1
+ /**
2
+ * @license EUPL-1.2+
3
+ * Copyright (c) 2023 Gemeente Amsterdam
4
+ */
5
+ /**
6
+ * @license EUPL-1.2+
7
+ * Copyright (c) 2023 Gemeente Amsterdam
8
+ */
9
+ /*
10
+ The breakpoint is 854px / 16 = 53.375rems
11
+ https://developer.mozilla.org/en-US/docs/Web/CSS/@media#accessibility_concerns
12
+ */
13
+ .amsterdam-accordion__header {
14
+ display: flex;
15
+ margin-block: 0;
16
+ margin-inline: 0;
17
+ }
18
+
19
+ .amsterdam-accordion__button {
20
+ background-color: transparent;
21
+ border: 0;
22
+ color: var(--amsterdam-accordion-button-color);
23
+ cursor: pointer;
24
+ display: flex;
25
+ font-family: var(--amsterdam-accordion-button-font-family);
26
+ font-size: var(--amsterdam-accordion-button-font-size-narrow);
27
+ font-weight: var(--amsterdam-accordion-button-font-weight);
28
+ justify-content: space-between;
29
+ line-height: var(--amsterdam-accordion-button-line-height);
30
+ padding-block: 0.75rem;
31
+ padding-inline: 1rem;
32
+ width: 100%;
33
+ }
34
+ @media screen and (width > 53.375rem) {
35
+ .amsterdam-accordion__button {
36
+ font-size: var(--amsterdam-accordion-button-font-size-wide);
37
+ }
38
+ }
39
+ .amsterdam-accordion__button:focus {
40
+ outline-offset: var(--amsterdam-accordion-button-focus-outline-offset);
41
+ }
42
+ .amsterdam-accordion__button:hover {
43
+ box-shadow: var(--amsterdam-accordion-button-hover-box-shadow);
44
+ }
45
+ .amsterdam-accordion__button svg {
46
+ transform: rotate(0deg);
47
+ transition: transform 0.3s ease;
48
+ }
49
+ @media (prefers-reduced-motion) {
50
+ .amsterdam-accordion__button svg {
51
+ transition: none;
52
+ }
53
+ }
54
+
55
+ .amsterdam-accordion__button[aria-expanded=true] svg {
56
+ transform: rotate(180deg);
57
+ }
58
+
59
+ .amsterdam-accordion__panel {
60
+ display: none;
61
+ padding-block: 1rem;
62
+ padding-inline: 1rem;
63
+ }
64
+
65
+ .amsterdam-accordion__panel--expanded {
66
+ display: block;
67
+ }
68
+
69
+ /*# sourceMappingURL=accordion.css.map */
@@ -0,0 +1 @@
1
+ {"version":3,"sourceRoot":"","sources":["../../src/accordion/accordion.scss","../../utils/breakpoint.scss"],"names":[],"mappings":"AAAA;AAAA;AAAA;AAAA;ACAA;AAAA;AAAA;AAAA;AAKA;AAAA;AAAA;AAAA;ADEA;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EAfF;IAgBI;;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;EACA;;AAEA;EAJF;IAKI;;;;AAKN;EACE;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE","file":"accordion.css"}