@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.
- package/dist/accordion/accordion.css +69 -0
- package/dist/accordion/accordion.css.map +1 -0
- package/dist/button/button.css +706 -0
- package/dist/button/button.css.map +1 -0
- package/dist/form-label/form-label.css +26 -0
- package/dist/form-label/form-label.css.map +1 -0
- package/dist/heading/heading.css +45 -95
- package/dist/heading/heading.css.map +1 -1
- package/dist/icon/icon.css +106 -21
- package/dist/icon/icon.css.map +1 -1
- package/dist/link/link.css +83 -55
- package/dist/link/link.css.map +1 -1
- package/dist/list/list.css +5 -0
- package/dist/list/list.css.map +1 -1
- package/dist/paragraph/paragraph.css +40 -44
- package/dist/paragraph/paragraph.css.map +1 -1
- package/dist/unordered-list/unordered-list.css +47 -0
- package/dist/unordered-list/unordered-list.css.map +1 -0
- package/package.json +7 -6
- package/src/accordion/README.md +19 -0
- package/src/accordion/accordion.scss +63 -0
- package/src/button/README.md +24 -0
- package/src/button/button-css.md +12 -0
- package/src/button/button.scss +19 -0
- package/src/form-label/README.md +3 -0
- package/src/form-label/form-label.scss +18 -0
- package/src/heading/README.md +23 -0
- package/src/heading/heading-css.md +3 -0
- package/src/heading/heading.scss +41 -25
- package/src/icon/README.md +19 -0
- package/src/icon/icon.scss +88 -18
- package/src/link/README.md +26 -0
- package/src/link/link.scss +88 -32
- package/src/list/list.scss +11 -0
- package/src/paragraph/README.md +24 -0
- package/src/paragraph/paragraph-css.md +3 -0
- package/src/paragraph/paragraph.scss +36 -9
- package/src/unordered-list/README.md +15 -0
- package/src/unordered-list/unordered-list.scss +44 -0
- package/utils/breakpoint.scss +7 -2
- package/utils/calculate-fluid-style.scss +6 -1
- package/dist/document/document.css +0 -22
- package/dist/document/document.css.map +0 -1
- package/dist/grid/grid.css +0 -340
- package/dist/grid/grid.css.map +0 -1
- package/dist/spacing/spacing.css +0 -249
- package/dist/spacing/spacing.css.map +0 -1
- package/src/document/document.scss +0 -16
- package/src/grid/grid.scss +0 -83
- 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"}
|