@amsterdam/design-system-css 0.1.4 → 0.1.5

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 (81) hide show
  1. package/README.md +1 -1
  2. package/dist/accordion/accordion.css +1 -69
  3. package/dist/accordion/accordion.css.map +1 -1
  4. package/dist/blockquote/blockquote.css +1 -0
  5. package/dist/blockquote/blockquote.css.map +1 -0
  6. package/dist/breadcrumb/breadcrumb.css +1 -0
  7. package/dist/breadcrumb/breadcrumb.css.map +1 -0
  8. package/dist/button/button.css +1 -706
  9. package/dist/button/button.css.map +1 -1
  10. package/dist/checkbox/checkbox.css +1 -0
  11. package/dist/checkbox/checkbox.css.map +1 -0
  12. package/dist/footer/footer.css +1 -0
  13. package/dist/footer/footer.css.map +1 -0
  14. package/dist/form-label/form-label.css +1 -26
  15. package/dist/form-label/form-label.css.map +1 -1
  16. package/dist/grid/grid-cell.css +1 -0
  17. package/dist/grid/grid-cell.css.map +1 -0
  18. package/dist/grid/page-grid.css +1 -0
  19. package/dist/grid/page-grid.css.map +1 -0
  20. package/dist/heading/heading.css +1 -64
  21. package/dist/heading/heading.css.map +1 -1
  22. package/dist/icon/icon.css +1 -122
  23. package/dist/icon/icon.css.map +1 -1
  24. package/dist/index.css +1 -0
  25. package/dist/index.css.map +1 -0
  26. package/dist/link/link.css +1 -97
  27. package/dist/link/link.css.map +1 -1
  28. package/dist/ordered-list/ordered-list.css +1 -0
  29. package/dist/ordered-list/ordered-list.css.map +1 -0
  30. package/dist/page-heading/page-heading.css +1 -0
  31. package/dist/page-heading/page-heading.css.map +1 -0
  32. package/dist/page-menu/page-menu.css +1 -0
  33. package/dist/page-menu/page-menu.css.map +1 -0
  34. package/dist/paragraph/paragraph.css +1 -49
  35. package/dist/paragraph/paragraph.css.map +1 -1
  36. package/dist/testula/testula.css +9 -0
  37. package/dist/testula/testula.css.map +1 -0
  38. package/dist/top-task-link/top-task-link.css +1 -0
  39. package/dist/top-task-link/top-task-link.css.map +1 -0
  40. package/dist/unordered-list/unordered-list.css +1 -47
  41. package/dist/unordered-list/unordered-list.css.map +1 -1
  42. package/dist/visually-hidden/visually-hidden.css +1 -0
  43. package/dist/visually-hidden/visually-hidden.css.map +1 -0
  44. package/package.json +7 -6
  45. package/src/accordion/README.md +25 -2
  46. package/src/accordion/accordion.scss +2 -2
  47. package/src/blockquote/README.md +14 -0
  48. package/src/blockquote/blockquote.scss +41 -0
  49. package/src/breadcrumb/README.md +15 -0
  50. package/src/breadcrumb/breadcrumb.scss +68 -0
  51. package/src/button/button.scss +36 -4
  52. package/src/checkbox/README.md +1 -0
  53. package/src/checkbox/checkbox.scss +225 -0
  54. package/src/footer/README.md +11 -0
  55. package/src/footer/footer-css.md +11 -0
  56. package/src/footer/footer.scss +29 -0
  57. package/src/form-label/form-label.scss +2 -2
  58. package/src/grid/README.md +11 -0
  59. package/src/grid/grid-cell.scss +18 -0
  60. package/src/grid/page-grid.scss +19 -0
  61. package/src/heading/heading.scss +18 -15
  62. package/src/icon/icon.scss +10 -10
  63. package/src/index.scss +19 -0
  64. package/src/link/README.md +28 -12
  65. package/src/link/link.scss +61 -36
  66. package/src/ordered-list/README.md +7 -0
  67. package/src/ordered-list/ordered-list.scss +53 -0
  68. package/src/page-heading/README.md +16 -0
  69. package/src/page-heading/page-heading.scss +31 -0
  70. package/src/page-menu/README.md +15 -0
  71. package/src/page-menu/page-menu.scss +77 -0
  72. package/src/paragraph/paragraph.scss +12 -8
  73. package/src/top-task-link/README.md +13 -0
  74. package/src/top-task-link/top-task-link.scss +55 -0
  75. package/src/unordered-list/README.md +5 -13
  76. package/src/unordered-list/unordered-list.scss +26 -17
  77. package/src/visually-hidden/README.md +5 -0
  78. package/src/visually-hidden/visually-hidden.scss +17 -0
  79. package/dist/list/list.css +0 -12
  80. package/dist/list/list.css.map +0 -1
  81. package/src/list/list.scss +0 -16
package/README.md CHANGED
@@ -9,7 +9,7 @@ CSS components are developed using BEM class names and the stylesheets can be in
9
9
  Theoretically you can include the components in your HTML page like so, but this is not the typical use case of this library:
10
10
 
11
11
  ```html
12
- <!DOCTYPE html>
12
+ <!doctype html>
13
13
  <html lang="en">
14
14
  <head>
15
15
  <title>Example page</title>
@@ -1,69 +1 @@
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 */
1
+ .amsterdam-accordion__header{display:flex;margin-block:0;margin-inline:0}.amsterdam-accordion__button{background-color:rgba(0,0,0,0);border:0;color:var(--amsterdam-accordion-button-color);cursor:pointer;display:flex;font-family:var(--amsterdam-accordion-button-font-family);font-size:var(--amsterdam-accordion-button-narrow-font-size);font-weight:var(--amsterdam-accordion-button-font-weight);justify-content:space-between;line-height:var(--amsterdam-accordion-button-line-height);padding-block:.75rem;padding-inline:1rem;width:100%}@media screen and (width > 53.375rem){.amsterdam-accordion__button{font-size:var(--amsterdam-accordion-button-wide-font-size)}}.amsterdam-accordion__button:focus{outline-offset:var(--amsterdam-accordion-button-focus-outline-offset)}.amsterdam-accordion__button:hover{box-shadow:var(--amsterdam-accordion-button-hover-box-shadow)}.amsterdam-accordion__button svg{transform:rotate(0deg);transition:transform .3s ease}@media(prefers-reduced-motion){.amsterdam-accordion__button svg{transition:none}}.amsterdam-accordion__button[aria-expanded=true] svg{transform:rotate(180deg)}.amsterdam-accordion__panel{display:none;padding-block:1rem;padding-inline:1rem}.amsterdam-accordion__panel--expanded{display:block}/*# sourceMappingURL=accordion.css.map */
@@ -1 +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"}
1
+ {"version":3,"sourceRoot":"","sources":["../../src/accordion/accordion.scss"],"names":[],"mappings":"AAOA,6BACE,aACA,eACA,gBAGF,6BACE,+BACA,SACA,8CACA,eACA,aACA,0DACA,6DACA,0DACA,8BACA,0DACA,qBACA,oBACA,WAEA,sCAfF,6BAgBI,4DAGF,mCACE,sEAGF,mCACE,8DAGF,iCACE,uBACA,8BAEA,+BAJF,iCAKI,iBAKN,qDACE,yBAGF,4BACE,aACA,mBACA,oBAGF,sCACE","file":"accordion.css"}
@@ -0,0 +1 @@
1
+ .amsterdam-blockquote{color:var(--amsterdam-blockquote-color);font-family:var(--amsterdam-blockquote-font-family);font-size:var(--amsterdam-blockquote-narrow-font-size);font-weight:var(--amsterdam-blockquote-font-weight);line-height:var(--amsterdam-blockquote-line-height);quotes:"“" "”";box-sizing:border-box;break-after:avoid;break-inside:avoid;margin-block:0;margin-inline:0}.amsterdam-blockquote::before{content:open-quote}.amsterdam-blockquote::after{content:close-quote}@media screen and (width > 53.375rem){.amsterdam-blockquote{font-size:var(--amsterdam-blockquote-wide-font-size)}}.amsterdam-blockquote--inverse-color{color:var(--amsterdam-blockquote-inverse-color)}/*# sourceMappingURL=blockquote.css.map */
@@ -0,0 +1 @@
1
+ {"version":3,"sourceRoot":"","sources":["../../src/blockquote/blockquote.scss"],"names":[],"mappings":"CAeA,sBACE,wCACA,oDACA,uDACA,oDACA,oDACA,eAbA,sBACA,kBACA,mBACA,eACA,gBAWA,8BACE,mBAGF,6BACE,oBAGF,sCAhBF,sBAiBI,sDAMJ,qCACE","file":"blockquote.css"}
@@ -0,0 +1 @@
1
+ .amsterdam-breadcrumb{font-family:var(--amsterdam-breadcrumb-font-family, inherit);font-size:var(--amsterdam-breadcrumb-narrow-font-size);line-height:var(--amsterdam-breadcrumb-line-height)}@media screen and (width > 53.375rem){.amsterdam-breadcrumb{font-size:var(--amsterdam-breadcrumb-wide-font-size)}}.amsterdam-breadcrumb__list{break-after:avoid;break-inside:avoid;display:flex;flex-wrap:wrap;gap:.5rem;list-style:none;box-sizing:border-box;margin-block:0;padding-inline:0}.amsterdam-breadcrumb-item{align-items:center;display:flex}.amsterdam-breadcrumb-item:not(:last-child)::after{background-color:var(--amsterdam-breadcrumb-color);clip-path:path("M 4.725,16 3.275,14.545 9.815,8 3.275,1.455 4.725,0 l 8,8 z");content:"";display:inline-block;height:16px;margin-inline-start:1rem;width:16px}.amsterdam-breadcrumb-item__link{color:var(--amsterdam-breadcrumb-color);cursor:pointer;outline-offset:var(--amsterdam-breadcrumb-item-link-outline-offset);text-decoration:none}.amsterdam-breadcrumb-item__link::first-letter{text-transform:capitalize}.amsterdam-breadcrumb-item__link:focus,.amsterdam-breadcrumb-item__link:hover,.amsterdam-breadcrumb-item__link:active{color:var(--amsterdam-breadcrumb-item-link-hover-color);text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:3px}/*# sourceMappingURL=breadcrumb.css.map */
@@ -0,0 +1 @@
1
+ {"version":3,"sourceRoot":"","sources":["../../src/breadcrumb/breadcrumb.scss"],"names":[],"mappings":"AAaA,sBACE,6DACA,uDACA,oDAEA,sCALF,sBAMI,sDAIJ,4BACE,kBACA,mBACA,aACA,eACA,UACA,gBArBA,sBACA,eACA,iBAwBF,2BACE,mBACA,aAGF,mDACE,mDACA,8EACA,WACA,qBACA,YACA,yBACA,WAGF,iCACE,wCACA,eACA,oEACA,qBAEA,+CACE,0BAGF,sHAGE,wDACA,0BACA,8BACA","file":"breadcrumb.css"}