@db-ux/core-foundations 5.7.0 → 6.0.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 (28) hide show
  1. package/CHANGELOG.md +32 -0
  2. package/README.md +2 -2
  3. package/build/styles/bundle.css +979 -933
  4. package/build/styles/bundle.scss +1 -1
  5. package/build/styles/defaults/default-code.css +1 -1
  6. package/build/styles/defaults/default-fonts.css +1 -25
  7. package/build/styles/defaults/default-fonts.scss +0 -29
  8. package/build/styles/defaults/default-icons.css +9 -1
  9. package/build/styles/defaults/default-icons.scss +15 -0
  10. package/build/styles/defaults/default-required.css +25 -1
  11. package/build/styles/defaults/default-required.scss +48 -1
  12. package/build/styles/defaults/default-root.css +1 -1
  13. package/build/styles/helpers/_a11y.scss +5 -1
  14. package/build/styles/helpers/_focus.scss +27 -0
  15. package/build/styles/helpers/classes/all.css +7 -0
  16. package/build/styles/helpers/classes/focus.css +7 -0
  17. package/build/styles/helpers/classes/focus.scss +5 -0
  18. package/build/styles/icons/_icon-helpers.scss +7 -3
  19. package/build/styles/icons/absolute.css +1 -1
  20. package/build/styles/icons/relative.css +1 -1
  21. package/build/styles/icons/relative.scss +0 -13
  22. package/build/styles/icons/rollup.css +1 -1
  23. package/build/styles/icons/webpack.css +1 -1
  24. package/build/styles/theme/absolute.css +1 -1
  25. package/build/styles/theme/relative.css +1 -1
  26. package/build/styles/theme/rollup.css +1 -1
  27. package/build/styles/theme/webpack.css +1 -1
  28. package/package.json +5 -5
package/build/styles/bundle.scss CHANGED
@@ -1,9 +1,9 @@
1
+ @forward "defaults/default-required";
1
2
  @forward "defaults/default-root";
2
3
  @forward "defaults/default-elevation";
3
4
  @forward "defaults/default-fonts";
4
5
  @forward "defaults/default-code";
5
6
  @forward "defaults/default-icons";
6
- @forward "defaults/default-required";
7
7
  @forward "defaults/default-container-properties";
8
8
 
9
9
  [data-mode] {
package/build/styles/defaults/default-code.css CHANGED
@@ -94,4 +94,4 @@ blockquote:not([class]){--db-adaptive-bg-basic-level-1-default:var(
94
94
  --db-neutral-on-bg-vibrant-hovered
95
95
  );--db-adaptive-on-bg-vibrant-pressed:var(
96
96
  --db-neutral-on-bg-vibrant-pressed
97
- );background-color:var(--db-neutral-bg-basic-transparent-semi-default);color:var(--db-neutral-on-bg-basic-emphasis-100-default)}blockquote:not([class]):after,blockquote:not([class]):before{--db-icon-color:var(--db-neutral-on-bg-basic-emphasis-100-default)}pre:not([class]):has(code){background-color:var(--db-adaptive-bg-inverted-contrast-max-default);color:var(--db-adaptive-on-bg-inverted-default);padding:var(--db-spacing-fixed-xs)}pre:not([class]):has(code),pre:not([class]):has(code) :is(code,span){font-family:monospace}a:has(code:not([class]):only-child){background-color:var(--db-adaptive-bg-inverted-contrast-max-default);color:var(--db-adaptive-on-bg-inverted-default)}a:has(code:not([class]):only-child):hover{cursor:var(--db-overwrite-cursor,pointer);color:var(--db-adaptive-on-bg-inverted-hovered)}a:has(code:not([class]):only-child):active{cursor:var(--db-overwrite-cursor,pointer);color:var(--db-adaptive-on-bg-inverted-pressed)}a:has(code:not([class]):only-child)>code{color:inherit}code:not([class]){background-color:var(--db-adaptive-bg-inverted-contrast-max-default);color:var(--db-adaptive-on-bg-inverted-default);padding-block:var(--db-spacing-fixed-3xs);padding-inline:var(--db-spacing-fixed-2xs)}code:not([class]),code:not([class]) span{font-family:monospace}blockquote:not([class]){margin:0;padding:var(--db-spacing-fixed-sm) var(--db-spacing-fixed-md)}
97
+ );background-color:var(--db-neutral-bg-basic-transparent-semi-default);color:var(--db-neutral-on-bg-basic-emphasis-100-default)}blockquote:not([class]):after,blockquote:not([class]):before{--db-icon-color:var(--db-neutral-on-bg-basic-emphasis-100-default)}pre:not([class]):has(code){background-color:var(--db-adaptive-bg-inverted-contrast-max-default);color:var(--db-adaptive-on-bg-inverted-default);padding:var(--db-spacing-fixed-xs)}code:not([class]),code:not([class]) span,pre:not([class]):has(code),pre:not([class]):has(code) :is(code,span){font-family:monospace}a:has(code:not([class]):only-child){background-color:var(--db-adaptive-bg-inverted-contrast-max-default);color:var(--db-adaptive-on-bg-inverted-default)}a:has(code:not([class]):only-child):hover{cursor:var(--db-overwrite-cursor,pointer);color:var(--db-adaptive-on-bg-inverted-hovered)}a:has(code:not([class]):only-child):active{cursor:var(--db-overwrite-cursor,pointer);color:var(--db-adaptive-on-bg-inverted-pressed)}a:has(code:not([class]):only-child)>code{color:inherit}code:not([class]){background-color:var(--db-adaptive-bg-inverted-contrast-max-default);color:var(--db-adaptive-on-bg-inverted-default);padding-block:var(--db-spacing-fixed-3xs);padding-inline:var(--db-spacing-fixed-2xs)}blockquote:not([class]){margin:0;padding:var(--db-spacing-fixed-sm) var(--db-spacing-fixed-md)}
package/build/styles/defaults/default-fonts.css CHANGED
@@ -1,25 +1 @@
1
- code,small{font:var(--db-type-body-sm);--db-icon-font-weight:var(--db-base-body-icon-weight-sm);--db-icon-font-size:var(--db-base-body-icon-font-size-sm)}h1{font:var(--db-type-headline-xl);margin-block:var(--db-spacing-fixed-xl)}h1:after,h1:before{--db-icon-font-size:var(
2
- --db-base-headline-icon-font-size-xl
3
- );--db-icon-font-weight:var(
4
- --db-base-headline-icon-weight-xl
5
- )}h2{font:var(--db-type-headline-lg);margin-block:var(--db-spacing-fixed-lg)}h2:after,h2:before{--db-icon-font-size:var(
6
- --db-base-headline-icon-font-size-lg
7
- );--db-icon-font-weight:var(
8
- --db-base-headline-icon-weight-lg
9
- )}h3{font:var(--db-type-headline-md);margin-block:var(--db-spacing-fixed-md)}h3:after,h3:before{--db-icon-font-size:var(
10
- --db-base-headline-icon-font-size-md
11
- );--db-icon-font-weight:var(
12
- --db-base-headline-icon-weight-md
13
- )}h4{font:var(--db-type-headline-sm);margin-block:var(--db-spacing-fixed-sm)}h4:after,h4:before{--db-icon-font-size:var(
14
- --db-base-headline-icon-font-size-sm
15
- );--db-icon-font-weight:var(
16
- --db-base-headline-icon-weight-sm
17
- )}h5{font:var(--db-type-headline-xs);margin-block:var(--db-spacing-fixed-xs)}h5:after,h5:before{--db-icon-font-size:var(
18
- --db-base-headline-icon-font-size-xs
19
- );--db-icon-font-weight:var(
20
- --db-base-headline-icon-weight-xs
21
- )}h6{font:var(--db-type-headline-2xs);margin-block:var(--db-spacing-fixed-2xs)}h6:after,h6:before{--db-icon-font-size:var(
22
- --db-base-headline-icon-font-size-2xs
23
- );--db-icon-font-weight:var(
24
- --db-base-headline-icon-weight-2xs
25
- )}:is(h1,h2,h3,h4,h5,h6){font-family:var(--db-font-family-head);font-weight:bolder;text-wrap:balance}:is(h1,h2,h3,h4,h5,h6)[data-variant=light]{font-weight:300}:is(h1,h2,h3,h4,h5,h6)[data-variant=regular]{font-weight:400}p{margin-block:var(--db-spacing-fixed-md)}[data-font=digital]{font-weight:300}[data-font=regular]{font-weight:400}[data-font=medium]{font-weight:500}[data-font=semibold]{font-weight:600}[data-font=bold],strong{font-weight:700}
1
+ code,small{font:var(--db-type-body-sm);--db-icon-font-weight:var(--db-base-body-icon-weight-sm);--db-icon-font-size:var(--db-base-body-icon-font-size-sm)}:is(h1,h2,h3,h4,h5,h6)[data-variant=light]{font-weight:300}:is(h1,h2,h3,h4,h5,h6)[data-variant=regular]{font-weight:400}[data-font=digital]{font-weight:300}[data-font=regular]{font-weight:400}[data-font=medium]{font-weight:500}[data-font=semibold]{font-weight:600}[data-font=bold],strong{font-weight:700}
package/build/styles/defaults/default-fonts.scss CHANGED
@@ -1,6 +1,4 @@
1
1
  /* Use this file if you want the default fonts for paragraph and headlines in your project */
2
- @use "sass:string";
3
- @use "../variables";
4
2
  @use "../fonts";
5
3
 
6
4
  small,
@@ -8,30 +6,7 @@ code {
8
6
  @extend %db-overwrite-font-size-sm;
9
7
  }
10
8
 
11
- @each $headline, $size in fonts.$headlines {
12
- #{string.unquote($headline)} {
13
- /* stylelint-disable custom-property-pattern */
14
- font: var(--db-type-headline-#{string.unquote($size)});
15
- margin-block: var(--db-spacing-fixed-#{string.unquote($size)});
16
-
17
- &::before,
18
- &::after {
19
- --db-icon-font-size: var(
20
- --db-base-headline-icon-font-size-#{string.unquote($size)}
21
- );
22
- --db-icon-font-weight: var(
23
- --db-base-headline-icon-weight-#{string.unquote($size)}
24
- );
25
- }
26
- /* stylelint-enable custom-property-pattern */
27
- }
28
- }
29
-
30
9
  :is(h1, h2, h3, h4, h5, h6) {
31
- font-family: var(--db-font-family-head);
32
- font-weight: bolder;
33
- text-wrap: balance;
34
-
35
10
  &[data-variant="light"] {
36
11
  font-weight: 300;
37
12
  }
@@ -41,10 +16,6 @@ code {
41
16
  }
42
17
  }
43
18
 
44
- p {
45
- margin-block: variables.$db-spacing-fixed-md;
46
- }
47
-
48
19
  [data-font="digital"] {
49
20
  font-weight: 300;
50
21
  }
package/build/styles/defaults/default-icons.css CHANGED
@@ -1 +1,9 @@
1
- [data-icon-leading]:before,[data-icon-trailing]:after,[data-icon]:before{color:var(--db-icon-color,inherit);display:inline-block;font-family:var(--db-icon-font-family,var(--db-icon-default-font-family,"db-ux-default","icon-font-fallback"))!important;font-size:var(--db-icon-font-size,1.5rem);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-style:normal;font-variant:normal;font-weight:var(--db-icon-font-weight,normal);line-height:1;speak:none;speak:never;text-transform:none;overflow:clip;contain:layout;vertical-align:var(--db-icon-vertical-align,middle);block-size:var(--db-icon-font-size,1.5rem);inline-size:var(--db-icon-font-size,1.5rem);aspect-ratio:1;flex-shrink:0;text-underline-position:auto;content:var(--db-icon,attr(data-icon))}@supports(content:""/""){[data-icon-leading]:before,[data-icon-trailing]:after,[data-icon]:before{content:var(--db-icon,attr(data-icon))/""}}@media aural{[data-icon-leading]:before,[data-icon-trailing]:after,[data-icon]:before{content:none}}@media speech{[data-icon-leading]:before,[data-icon-trailing]:after,[data-icon]:before{content:none}}[data-icon-leading]:is(span):not([hidden]),[data-icon-trailing]:is(span):not([hidden]),[data-icon]:is(span):not([hidden]){display:inline-flex}[data-icon-leading]:is(span),[data-icon-trailing]:is(span),[data-icon]:is(span){vertical-align:initial}[data-icon-leading=none]:before,[data-icon=none]:before,[data-show-icon-leading=false]:before,[data-show-icon=false]:before{content:none}[data-icon-trailing]:after{content:var(--db-icon-trailing,attr(data-icon-trailing))}@supports(content:""/""){[data-icon-trailing]:after{content:var(--db-icon-trailing,attr(data-icon-trailing))/""}}[data-icon-trailing=none]:after,[data-show-icon-trailing=false]:after{content:none}.is-icon-text-replace[data-icon-leading],.is-icon-text-replace[data-icon-trailing],.is-icon-text-replace[data-icon]{font-size:0!important}@font-face{font-display:block;font-family:icon-font-fallback;font-style:normal;font-weight:400;src:url("data:application/octet-stream;base64,d09GMgABAAAAAALAAAsAAAAAB8gAAAJzAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHFQGYACFegoUPAE2AiQDCAsGAAQgBYUOBysbJAfIrjBu4YkWdj4mP/wNUwgBWAAK8Tz92uu5bzeIKpJ4PLCOwgJxKmxlVZUBVhLY/+63n6ZlVd+q+JYluo4VQv5R4ejdz9BP+Dk5hUpNjXBxv1sBaSJaC0igiNLJzS9wsNc8ihPOOIQQDhtwgIHHieM+PDyHi1tAAf8GeS/KbE3LojUWRgWST5B5exuFB3wIN0wv8NNgfEfQbtFccWvn4BgaN8+xh5YyNRvi/Ny8Zgjq3KNWw3iraG57bRo5Szkujxf+6fPVUqBoqqg37N5Cwoc5rzWOpudsgi8raEKFWaAmr+ojL1XKpCXtqeMq0KoPFcy58/oPRRSB1Op2NAA8R2mm1BqaRf4/kNsJOYtiI8CcJThDcI7gPMEFgosElwguE1whuEpwjeA6wQ2CmwS3CG4T3CG4S3CP4D7BA4KHBI8IHhM8IXhK8Izg+HBAAXXa8BOMJ38cKc/DzT/WMg9r1ILw5bU7Q/1vhVyEX53987Xt7P5KlNBG505O4806S401qeGyRnO7dvHDYvT6rJmO/t24W/TH5iq0N6GglrRp0mGZZv12aDfj8uYOA95U6jYx6h1QdPtAZdSvoJb802Q40mw00W4vc06H8XxNBN/VwbPzC2RtRmJzqMyDpVTYIXeKU5XyVfA4VFZ8ZFt5lYiVxOwF80czYtaoU3C41eRlytqAMYW1EtxbMsdxP7bsyp4IDlaEwOvSvpXDv5xYVoYIG4cU44FFUuue6ytPKUluxTaPhnoGvQTbVt9TmTBF/jzzAuUeGSOMaUhLAgdtjWRVo0QCFMt3rSkC61n2CEVjfT1Ot7X21uR1ipQK7baUlFQyBwAAAAA=")}
1
+ [data-icon-leading]:before,[data-icon-trailing]:after,[data-icon]:before{color:var(--db-icon-color,inherit);display:inline-block;font-family:var(--db-icon-font-family,var(--db-icon-default-font-family,"db-ux-default","icon-font-fallback"))!important;font-size:var(--db-icon-font-size,1.5rem);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-style:normal;font-variant:normal;font-weight:var(--db-icon-font-weight,normal);line-height:1;speak:none;speak:never;text-transform:none;overflow:clip;contain:layout;vertical-align:var(--db-icon-vertical-align,middle);block-size:var(--db-icon-font-size,1.5rem);inline-size:var(--db-icon-font-size,1.5rem);aspect-ratio:1;flex-shrink:0;text-underline-position:auto;content:var(--db-icon,attr(data-icon))}@supports(content:""/""){[data-icon-leading]:before,[data-icon-trailing]:after,[data-icon]:before{content:var(--db-icon,attr(data-icon))/""}}@media aural{[data-icon-leading]:before,[data-icon-trailing]:after,[data-icon]:before{content:none}}@media speech{[data-icon-leading]:before,[data-icon-trailing]:after,[data-icon]:before{content:none}}[data-icon-leading]:is(span):not([hidden]),[data-icon-trailing]:is(span):not([hidden]),[data-icon]:is(span):not([hidden]){display:inline-flex}[data-icon-leading]:is(span),[data-icon-trailing]:is(span),[data-icon]:is(span){vertical-align:initial}[data-icon-variant-after=default]:after,[data-icon-variant-before=default]:before,[data-icon-variant=default]:before{--db-icon-font-family:var(
2
+ --db-icon-default-font-family,
3
+ "db-ux-default",
4
+ "icon-font-fallback"
5
+ )}[data-icon-variant-after=filled]:after,[data-icon-variant-before=filled]:before,[data-icon-variant=filled]:before{--db-icon-font-family:var(
6
+ --db-icon-filled-font-family,
7
+ "db-ux-filled",
8
+ "icon-font-fallback"
9
+ )}[data-icon-leading=none]:before,[data-icon=none]:before,[data-show-icon-leading=false]:before,[data-show-icon=false]:before{content:none}[data-icon-trailing]:after{content:var(--db-icon-trailing,attr(data-icon-trailing))}@supports(content:""/""){[data-icon-trailing]:after{content:var(--db-icon-trailing,attr(data-icon-trailing))/""}}[data-icon-trailing=none]:after,[data-show-icon-trailing=false]:after{content:none}.is-icon-text-replace[data-icon-leading],.is-icon-text-replace[data-icon-trailing],.is-icon-text-replace[data-icon]{font-size:0!important}@font-face{font-display:block;font-family:icon-font-fallback;font-style:normal;font-weight:400;src:url("data:application/octet-stream;base64,d09GMgABAAAAAALAAAsAAAAAB8gAAAJzAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHFQGYACFegoUPAE2AiQDCAsGAAQgBYUOBysbJAfIrjBu4YkWdj4mP/wNUwgBWAAK8Tz92uu5bzeIKpJ4PLCOwgJxKmxlVZUBVhLY/+63n6ZlVd+q+JYluo4VQv5R4ejdz9BP+Dk5hUpNjXBxv1sBaSJaC0igiNLJzS9wsNc8ihPOOIQQDhtwgIHHieM+PDyHi1tAAf8GeS/KbE3LojUWRgWST5B5exuFB3wIN0wv8NNgfEfQbtFccWvn4BgaN8+xh5YyNRvi/Ny8Zgjq3KNWw3iraG57bRo5Szkujxf+6fPVUqBoqqg37N5Cwoc5rzWOpudsgi8raEKFWaAmr+ojL1XKpCXtqeMq0KoPFcy58/oPRRSB1Op2NAA8R2mm1BqaRf4/kNsJOYtiI8CcJThDcI7gPMEFgosElwguE1whuEpwjeA6wQ2CmwS3CG4T3CG4S3CP4D7BA4KHBI8IHhM8IXhK8Izg+HBAAXXa8BOMJ38cKc/DzT/WMg9r1ILw5bU7Q/1vhVyEX53987Xt7P5KlNBG505O4806S401qeGyRnO7dvHDYvT6rJmO/t24W/TH5iq0N6GglrRp0mGZZv12aDfj8uYOA95U6jYx6h1QdPtAZdSvoJb802Q40mw00W4vc06H8XxNBN/VwbPzC2RtRmJzqMyDpVTYIXeKU5XyVfA4VFZ8ZFt5lYiVxOwF80czYtaoU3C41eRlytqAMYW1EtxbMsdxP7bsyp4IDlaEwOvSvpXDv5xYVoYIG4cU44FFUuue6ytPKUluxTaPhnoGvQTbVt9TmTBF/jzzAuUeGSOMaUhLAgdtjWRVo0QCFMt3rSkC61n2CEVjfT1Ot7X21uR1ipQK7baUlFQyBwAAAAA=")}
package/build/styles/defaults/default-icons.scss CHANGED
@@ -18,6 +18,21 @@
18
18
  }
19
19
  }
20
20
 
21
+ @each $variant in icons.$default-icon-variants {
22
+ [data-icon-variant="#{$variant}"],
23
+ [data-icon-variant-before="#{$variant}"] {
24
+ &::before {
25
+ @include icons.icon-font-family($variant);
26
+ }
27
+ }
28
+
29
+ [data-icon-variant-after="#{$variant}"] {
30
+ &::after {
31
+ @include icons.icon-font-family($variant);
32
+ }
33
+ }
34
+ }
35
+
21
36
  [data-show-icon="false"],
22
37
  [data-show-icon-leading="false"],
23
38
  [data-icon="none"],
package/build/styles/defaults/default-required.css CHANGED
@@ -2590,4 +2590,28 @@
2590
2590
  );--db-burgundy-bg-vibrant-pressed:light-dark(
2591
2591
  var(--db-burgundy-10),
2592
2592
  var(--db-burgundy-10)
2593
- )}:where(html){line-height:1.15;-webkit-text-size-adjust:100%;text-size-adjust:100%}:where(h1){font-size:2em;margin-block-end:.67em;margin-block-start:.67em}:where(dl,ol,ul) :where(dl,ol,ul){margin-block-end:0;margin-block-start:0}:where(hr){box-sizing:initial;color:inherit;height:0}:where(abbr[title]){text-decoration:underline;text-decoration:underline dotted}:where(b,strong){font-weight:bolder}:where(code,kbd,pre,samp){font-family:monospace,monospace;font-size:1em}:where(small){font-size:80%}:where(table){border-color:currentColor;text-indent:0}:where(button,input,select){margin:0}:where(button){text-transform:none}:where(button,input:is([type=button i],[type=reset i],[type=submit i])){-webkit-appearance:button}:where(progress){vertical-align:initial}:where(select){text-transform:none}:where(textarea){margin:0}:where(input[type=search i]){-webkit-appearance:textfield;outline-offset:-2px}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}::-webkit-input-placeholder{color:inherit;opacity:.54}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}:where(button,input:is([type=button i],[type=color i],[type=reset i],[type=submit i]))::-moz-focus-inner{border-style:none;padding:0}:where(button,input:is([type=button i],[type=color i],[type=reset i],[type=submit i]))::-moz-focusring{outline:1px dotted ButtonText}:where(:-moz-ui-invalid){box-shadow:none}:where(dialog){background-color:#fff;border:solid;color:#000;height:-moz-fit-content;height:fit-content;left:0;margin:auto;padding:1em;position:absolute;right:0;width:-moz-fit-content;width:fit-content}:where(dialog:not([open])){display:none}:where(summary){display:list-item}@property --db-screen-xs{syntax:"*";inherits:true;initial-value:20em}@property --db-screen-sm{syntax:"*";inherits:true;initial-value:48em}@property --db-screen-md{syntax:"*";inherits:true;initial-value:64em}@property --db-screen-lg{syntax:"*";inherits:true;initial-value:90em}@property --db-screen-xl{syntax:"*";inherits:true;initial-value:120em}:root{color-scheme:var(--db-color-scheme,light dark)}:root:has([name=color-scheme]:is([content~=light],[content~=dark])){color-scheme:var(--db-color-scheme)}[data-mode=light]{color-scheme:light}[data-mode=dark]{color-scheme:dark}[data-pride=true]{--db-pride-red:var(--db-red-origin-default);--db-pride-orange:var(--db-orange-origin-default);--db-pride-yellow:var(--db-yellow-origin-default);--db-pride-green:var(--db-light-green-origin-default);--db-pride-blue:var(--db-blue-origin-default);--db-pride-violet:var(--db-violet-origin-default)}body,html{margin:0;padding:0}body{font-family:var(--db-font-family-sans)}html{-webkit-tap-highlight-color:var(--db-informational-bg-basic-transparent-semi-default)}*,:after,:before{box-sizing:var(--db-box-sizing,border-box)}*{-webkit-font-smoothing:antialiased;font-synthesis:none;text-rendering:optimizelegibility}a,body,button,input,select,summary,textarea{color:inherit}embed,iframe,img,object,video{block-size:auto;max-inline-size:100%}iframe{border:0}:where(ul){padding-inline-start:var(--db-spacing-fixed-md);list-style-type:var(--db-list-bullet)}:where(ul) li::marker{color:var(--db-brand-origin-default)}[role=navigation] :is(ol,ul),nav ol,nav ul{list-style-type:"";margin:0;padding:0}fieldset{border:0}details>*,details>:after,details>:before{box-sizing:var(--db-box-sizing,border-box)}
2593
+ )}:where(html){line-height:1.15;-webkit-text-size-adjust:100%;text-size-adjust:100%}:where(h1){font-size:2em;margin-block:.67em}:where(dl,ol,ul) :where(dl,ol,ul){margin-block:0}:where(hr){box-sizing:initial;color:inherit;height:0}:where(abbr[title]){text-decoration:underline;text-decoration:underline dotted}:where(b,strong){font-weight:bolder}:where(code,kbd,pre,samp){font-family:monospace,monospace;font-size:1em}:where(small){font-size:80%}:where(table){border-color:currentColor;text-indent:0}:where(button,input,select),:where(textarea){margin:0}:where(button),:where(select){text-transform:none}:where(button,input:is([type=button i],[type=reset i],[type=submit i])){-webkit-appearance:button}:where(progress){vertical-align:initial}:where(input[type=search i]){-webkit-appearance:textfield;outline-offset:-2px}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}::-webkit-input-placeholder{color:inherit;opacity:.54}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}:where(button,input:is([type=button i],[type=color i],[type=reset i],[type=submit i]))::-moz-focus-inner{border-style:none;padding:0}:where(button,input:is([type=button i],[type=color i],[type=reset i],[type=submit i]))::-moz-focusring{outline:1px dotted ButtonText}:where(:-moz-ui-invalid){box-shadow:none}:where(dialog){background-color:#fff;border:solid;color:#000;height:-moz-fit-content;height:fit-content;left:0;margin:auto;padding:1em;position:absolute;right:0;width:-moz-fit-content;width:fit-content}:where(dialog:not([open])){display:none}:where(summary){display:list-item}@property --db-screen-xs{syntax:"*";inherits:true;initial-value:20em}@property --db-screen-sm{syntax:"*";inherits:true;initial-value:48em}@property --db-screen-md{syntax:"*";inherits:true;initial-value:64em}@property --db-screen-lg{syntax:"*";inherits:true;initial-value:90em}@property --db-screen-xl{syntax:"*";inherits:true;initial-value:120em}:root{color-scheme:var(--db-color-scheme,light dark)}:root:has([name=color-scheme]:is([content~=light],[content~=dark])){color-scheme:var(--db-color-scheme)}[data-mode=light]{color-scheme:light}[data-mode=dark]{color-scheme:dark}[data-pride=true]{--db-pride-red:var(--db-red-origin-default);--db-pride-orange:var(--db-orange-origin-default);--db-pride-yellow:var(--db-yellow-origin-default);--db-pride-green:var(--db-light-green-origin-default);--db-pride-blue:var(--db-blue-origin-default);--db-pride-violet:var(--db-violet-origin-default)}body,html{margin:0;padding:0}[data-text-spacing=true]{--db-text-spacing:0.5}[data-text-spacing=false]{--db-text-spacing:0}:where(h1,h2,h3,h4,h5,h6,p){margin-block:calc(1lh * var(--db-text-spacing,0))}:where(h1){font:var(--db-type-headline-xl)}:where(h1):after,:where(h1):before{--db-icon-font-size:var(
2594
+ --db-base-headline-icon-font-size-xl
2595
+ );--db-icon-font-weight:var(
2596
+ --db-base-headline-icon-weight-xl
2597
+ )}:where(h2){font:var(--db-type-headline-lg)}:where(h2):after,:where(h2):before{--db-icon-font-size:var(
2598
+ --db-base-headline-icon-font-size-lg
2599
+ );--db-icon-font-weight:var(
2600
+ --db-base-headline-icon-weight-lg
2601
+ )}:where(h3){font:var(--db-type-headline-md)}:where(h3):after,:where(h3):before{--db-icon-font-size:var(
2602
+ --db-base-headline-icon-font-size-md
2603
+ );--db-icon-font-weight:var(
2604
+ --db-base-headline-icon-weight-md
2605
+ )}:where(h4){font:var(--db-type-headline-sm)}:where(h4):after,:where(h4):before{--db-icon-font-size:var(
2606
+ --db-base-headline-icon-font-size-sm
2607
+ );--db-icon-font-weight:var(
2608
+ --db-base-headline-icon-weight-sm
2609
+ )}:where(h5){font:var(--db-type-headline-xs)}:where(h5):after,:where(h5):before{--db-icon-font-size:var(
2610
+ --db-base-headline-icon-font-size-xs
2611
+ );--db-icon-font-weight:var(
2612
+ --db-base-headline-icon-weight-xs
2613
+ )}:where(h6){font:var(--db-type-headline-2xs)}:where(h6):after,:where(h6):before{--db-icon-font-size:var(
2614
+ --db-base-headline-icon-font-size-2xs
2615
+ );--db-icon-font-weight:var(
2616
+ --db-base-headline-icon-weight-2xs
2617
+ )}body{font-family:var(--db-font-family-sans)}:where(h1,h2,h3,h4,h5,h6){font-family:var(--db-font-family-head);font-weight:bolder;text-wrap:balance}html{-webkit-tap-highlight-color:var(--db-informational-bg-basic-transparent-semi-default)}*,:after,:before,details>*,details>:after,details>:before{box-sizing:var(--db-box-sizing,border-box)}*{-webkit-font-smoothing:antialiased;font-synthesis:none;text-rendering:optimizelegibility}a,body,button,input,select,summary,textarea{color:inherit}embed,iframe,img,object,video{block-size:auto;max-inline-size:100%}fieldset,iframe{border:0}:where(ul){padding-inline-start:var(--db-spacing-fixed-md);list-style-type:var(--db-list-bullet)}:where(ul) li::marker{color:var(--db-brand-origin-default)}[role=navigation] :is(ol,ul),nav ol,nav ul{list-style-type:"";margin:0;padding:0}
package/build/styles/defaults/default-required.scss CHANGED
@@ -1,5 +1,5 @@
1
1
  /* Required styles to normalize default css */
2
-
2
+ @use "sass:string";
3
3
  @use "../variables";
4
4
  @use "../colors";
5
5
  @use "../helpers";
@@ -50,10 +50,57 @@ body {
50
50
  padding: 0;
51
51
  }
52
52
 
53
+ $block-text-elements: "h1, h2, h3, h4, h5, h6, p";
54
+
55
+ /* Block-level text carries no `margin-block` by default. The opt-in is driven
56
+ * through the inheriting `--db-text-spacing` custom property rather than
57
+ * descendant selectors, so the nearest `data-text-spacing` ancestor - or the
58
+ * element itself - wins by proximity instead of by source order. That makes
59
+ * `true` win when it is the closer ancestor and `false` opt a subtree back out,
60
+ * and it covers the attribute sitting on the block-text element itself. The
61
+ * property only carries the half-line-height multiplier; `1lh` is resolved on
62
+ * the text element in `margin-block`, so the spacing stays derived from each
63
+ * element's own line height rather than the ancestor's. */
64
+ [data-text-spacing="true"] {
65
+ --db-text-spacing: 0.5;
66
+ }
67
+
68
+ [data-text-spacing="false"] {
69
+ --db-text-spacing: 0;
70
+ }
71
+
72
+ :where(#{$block-text-elements}) {
73
+ margin-block: calc(1lh * var(--db-text-spacing, 0));
74
+ }
75
+
76
+ @each $headline, $size in fonts.$headlines {
77
+ :where(#{string.unquote($headline)}) {
78
+ /* stylelint-disable custom-property-pattern */
79
+ font: var(--db-type-headline-#{string.unquote($size)});
80
+
81
+ &::before,
82
+ &::after {
83
+ --db-icon-font-size: var(
84
+ --db-base-headline-icon-font-size-#{string.unquote($size)}
85
+ );
86
+ --db-icon-font-weight: var(
87
+ --db-base-headline-icon-weight-#{string.unquote($size)}
88
+ );
89
+ }
90
+ /* stylelint-enable custom-property-pattern */
91
+ }
92
+ }
93
+
53
94
  body {
54
95
  font-family: var(--db-font-family-sans);
55
96
  }
56
97
 
98
+ :where(h1, h2, h3, h4, h5, h6) {
99
+ font-family: var(--db-font-family-head);
100
+ font-weight: bolder;
101
+ text-wrap: balance;
102
+ }
103
+
57
104
  html {
58
105
  -webkit-tap-highlight-color: #{colors.$db-informational-bg-basic-transparent-semi-default};
59
106
  }
package/build/styles/defaults/default-root.css CHANGED
@@ -94,4 +94,4 @@
94
94
  --db-neutral-on-bg-vibrant-hovered
95
95
  );--db-adaptive-on-bg-vibrant-pressed:var(
96
96
  --db-neutral-on-bg-vibrant-pressed
97
- )}:host,:root{background-color:var(--db-neutral-bg-basic-level-1-default);color:var(--db-neutral-on-bg-basic-emphasis-100-default)}:root:after,:root:before{--db-icon-color:var(--db-neutral-on-bg-basic-emphasis-100-default)}:host,:root{font:var(--db-type-body-md);--db-icon-font-weight:var(--db-base-body-icon-weight-md);--db-icon-font-size:var(--db-base-body-icon-font-size-md)}:host,:root{--db-sizing-3xs:var(--db-sizing-regular-3xs);--db-sizing-2xs:var(--db-sizing-regular-2xs);--db-sizing-xs:var(--db-sizing-regular-xs);--db-sizing-sm:var(--db-sizing-regular-sm);--db-sizing-md:var(--db-sizing-regular-md);--db-sizing-lg:var(--db-sizing-regular-lg);--db-sizing-xl:var(--db-sizing-regular-xl);--db-sizing-2xl:var(--db-sizing-regular-2xl);--db-sizing-3xl:var(--db-sizing-regular-3xl);--db-spacing-fixed-3xs:var(--db-spacing-fixed-regular-3xs);--db-spacing-fixed-2xs:var(--db-spacing-fixed-regular-2xs);--db-spacing-fixed-xs:var(--db-spacing-fixed-regular-xs);--db-spacing-fixed-sm:var(--db-spacing-fixed-regular-sm);--db-spacing-fixed-md:var(--db-spacing-fixed-regular-md);--db-spacing-fixed-lg:var(--db-spacing-fixed-regular-lg);--db-spacing-fixed-xl:var(--db-spacing-fixed-regular-xl);--db-spacing-fixed-2xl:var(--db-spacing-fixed-regular-2xl);--db-spacing-fixed-3xl:var(--db-spacing-fixed-regular-3xl)}@media(width<=48em){:host,:root{--db-spacing-responsive-3xs:var(--db-spacing-responsive-regular-mobile-3xs);--db-spacing-responsive-2xs:var(--db-spacing-responsive-regular-mobile-2xs);--db-spacing-responsive-xs:var(--db-spacing-responsive-regular-mobile-xs);--db-spacing-responsive-sm:var(--db-spacing-responsive-regular-mobile-sm);--db-spacing-responsive-md:var(--db-spacing-responsive-regular-mobile-md);--db-spacing-responsive-lg:var(--db-spacing-responsive-regular-mobile-lg);--db-spacing-responsive-xl:var(--db-spacing-responsive-regular-mobile-xl);--db-spacing-responsive-2xl:var(--db-spacing-responsive-regular-mobile-2xl);--db-spacing-responsive-3xl:var(--db-spacing-responsive-regular-mobile-3xl)}}@media(48em<width<=64em){:host,:root{--db-spacing-responsive-3xs:var(--db-spacing-responsive-regular-tablet-3xs);--db-spacing-responsive-2xs:var(--db-spacing-responsive-regular-tablet-2xs);--db-spacing-responsive-xs:var(--db-spacing-responsive-regular-tablet-xs);--db-spacing-responsive-sm:var(--db-spacing-responsive-regular-tablet-sm);--db-spacing-responsive-md:var(--db-spacing-responsive-regular-tablet-md);--db-spacing-responsive-lg:var(--db-spacing-responsive-regular-tablet-lg);--db-spacing-responsive-xl:var(--db-spacing-responsive-regular-tablet-xl);--db-spacing-responsive-2xl:var(--db-spacing-responsive-regular-tablet-2xl);--db-spacing-responsive-3xl:var(--db-spacing-responsive-regular-tablet-3xl)}}@media(64em<width){:host,:root{--db-spacing-responsive-3xs:var(--db-spacing-responsive-regular-desktop-3xs);--db-spacing-responsive-2xs:var(--db-spacing-responsive-regular-desktop-2xs);--db-spacing-responsive-xs:var(--db-spacing-responsive-regular-desktop-xs);--db-spacing-responsive-sm:var(--db-spacing-responsive-regular-desktop-sm);--db-spacing-responsive-md:var(--db-spacing-responsive-regular-desktop-md);--db-spacing-responsive-lg:var(--db-spacing-responsive-regular-desktop-lg);--db-spacing-responsive-xl:var(--db-spacing-responsive-regular-desktop-xl);--db-spacing-responsive-2xl:var(--db-spacing-responsive-regular-desktop-2xl);--db-spacing-responsive-3xl:var(--db-spacing-responsive-regular-desktop-3xl)}}@media(width<=48em){:host,:root{--db-type-headline-3xs:var(--db-typography-regular-mobile-headline-3xs);--db-base-headline-icon-weight-3xs:var(--db-base-icon-weight-regular-mobile-headline-3xs);--db-base-headline-icon-font-size-3xs:var(--db-base-icon-font-size-regular-mobile-headline-3xs);--db-type-headline-2xs:var(--db-typography-regular-mobile-headline-2xs);--db-base-headline-icon-weight-2xs:var(--db-base-icon-weight-regular-mobile-headline-2xs);--db-base-headline-icon-font-size-2xs:var(--db-base-icon-font-size-regular-mobile-headline-2xs);--db-type-headline-xs:var(--db-typography-regular-mobile-headline-xs);--db-base-headline-icon-weight-xs:var(--db-base-icon-weight-regular-mobile-headline-xs);--db-base-headline-icon-font-size-xs:var(--db-base-icon-font-size-regular-mobile-headline-xs);--db-type-headline-sm:var(--db-typography-regular-mobile-headline-sm);--db-base-headline-icon-weight-sm:var(--db-base-icon-weight-regular-mobile-headline-sm);--db-base-headline-icon-font-size-sm:var(--db-base-icon-font-size-regular-mobile-headline-sm);--db-type-headline-md:var(--db-typography-regular-mobile-headline-md);--db-base-headline-icon-weight-md:var(--db-base-icon-weight-regular-mobile-headline-md);--db-base-headline-icon-font-size-md:var(--db-base-icon-font-size-regular-mobile-headline-md);--db-type-headline-lg:var(--db-typography-regular-mobile-headline-lg);--db-base-headline-icon-weight-lg:var(--db-base-icon-weight-regular-mobile-headline-lg);--db-base-headline-icon-font-size-lg:var(--db-base-icon-font-size-regular-mobile-headline-lg);--db-type-headline-xl:var(--db-typography-regular-mobile-headline-xl);--db-base-headline-icon-weight-xl:var(--db-base-icon-weight-regular-mobile-headline-xl);--db-base-headline-icon-font-size-xl:var(--db-base-icon-font-size-regular-mobile-headline-xl);--db-type-headline-2xl:var(--db-typography-regular-mobile-headline-2xl);--db-base-headline-icon-weight-2xl:var(--db-base-icon-weight-regular-mobile-headline-2xl);--db-base-headline-icon-font-size-2xl:var(--db-base-icon-font-size-regular-mobile-headline-2xl);--db-type-headline-3xl:var(--db-typography-regular-mobile-headline-3xl);--db-base-headline-icon-weight-3xl:var(--db-base-icon-weight-regular-mobile-headline-3xl);--db-base-headline-icon-font-size-3xl:var(--db-base-icon-font-size-regular-mobile-headline-3xl)}}@media(48em<width<=64em){:host,:root{--db-type-headline-3xs:var(--db-typography-regular-tablet-headline-3xs);--db-base-headline-icon-weight-3xs:var(--db-base-icon-weight-regular-tablet-headline-3xs);--db-base-headline-icon-font-size-3xs:var(--db-base-icon-font-size-regular-tablet-headline-3xs);--db-type-headline-2xs:var(--db-typography-regular-tablet-headline-2xs);--db-base-headline-icon-weight-2xs:var(--db-base-icon-weight-regular-tablet-headline-2xs);--db-base-headline-icon-font-size-2xs:var(--db-base-icon-font-size-regular-tablet-headline-2xs);--db-type-headline-xs:var(--db-typography-regular-tablet-headline-xs);--db-base-headline-icon-weight-xs:var(--db-base-icon-weight-regular-tablet-headline-xs);--db-base-headline-icon-font-size-xs:var(--db-base-icon-font-size-regular-tablet-headline-xs);--db-type-headline-sm:var(--db-typography-regular-tablet-headline-sm);--db-base-headline-icon-weight-sm:var(--db-base-icon-weight-regular-tablet-headline-sm);--db-base-headline-icon-font-size-sm:var(--db-base-icon-font-size-regular-tablet-headline-sm);--db-type-headline-md:var(--db-typography-regular-tablet-headline-md);--db-base-headline-icon-weight-md:var(--db-base-icon-weight-regular-tablet-headline-md);--db-base-headline-icon-font-size-md:var(--db-base-icon-font-size-regular-tablet-headline-md);--db-type-headline-lg:var(--db-typography-regular-tablet-headline-lg);--db-base-headline-icon-weight-lg:var(--db-base-icon-weight-regular-tablet-headline-lg);--db-base-headline-icon-font-size-lg:var(--db-base-icon-font-size-regular-tablet-headline-lg);--db-type-headline-xl:var(--db-typography-regular-tablet-headline-xl);--db-base-headline-icon-weight-xl:var(--db-base-icon-weight-regular-tablet-headline-xl);--db-base-headline-icon-font-size-xl:var(--db-base-icon-font-size-regular-tablet-headline-xl);--db-type-headline-2xl:var(--db-typography-regular-tablet-headline-2xl);--db-base-headline-icon-weight-2xl:var(--db-base-icon-weight-regular-tablet-headline-2xl);--db-base-headline-icon-font-size-2xl:var(--db-base-icon-font-size-regular-tablet-headline-2xl);--db-type-headline-3xl:var(--db-typography-regular-tablet-headline-3xl);--db-base-headline-icon-weight-3xl:var(--db-base-icon-weight-regular-tablet-headline-3xl);--db-base-headline-icon-font-size-3xl:var(--db-base-icon-font-size-regular-tablet-headline-3xl)}}@media(64em<width){:host,:root{--db-type-headline-3xs:var(--db-typography-regular-desktop-headline-3xs);--db-base-headline-icon-weight-3xs:var(--db-base-icon-weight-regular-desktop-headline-3xs);--db-base-headline-icon-font-size-3xs:var(--db-base-icon-font-size-regular-desktop-headline-3xs);--db-type-headline-2xs:var(--db-typography-regular-desktop-headline-2xs);--db-base-headline-icon-weight-2xs:var(--db-base-icon-weight-regular-desktop-headline-2xs);--db-base-headline-icon-font-size-2xs:var(--db-base-icon-font-size-regular-desktop-headline-2xs);--db-type-headline-xs:var(--db-typography-regular-desktop-headline-xs);--db-base-headline-icon-weight-xs:var(--db-base-icon-weight-regular-desktop-headline-xs);--db-base-headline-icon-font-size-xs:var(--db-base-icon-font-size-regular-desktop-headline-xs);--db-type-headline-sm:var(--db-typography-regular-desktop-headline-sm);--db-base-headline-icon-weight-sm:var(--db-base-icon-weight-regular-desktop-headline-sm);--db-base-headline-icon-font-size-sm:var(--db-base-icon-font-size-regular-desktop-headline-sm);--db-type-headline-md:var(--db-typography-regular-desktop-headline-md);--db-base-headline-icon-weight-md:var(--db-base-icon-weight-regular-desktop-headline-md);--db-base-headline-icon-font-size-md:var(--db-base-icon-font-size-regular-desktop-headline-md);--db-type-headline-lg:var(--db-typography-regular-desktop-headline-lg);--db-base-headline-icon-weight-lg:var(--db-base-icon-weight-regular-desktop-headline-lg);--db-base-headline-icon-font-size-lg:var(--db-base-icon-font-size-regular-desktop-headline-lg);--db-type-headline-xl:var(--db-typography-regular-desktop-headline-xl);--db-base-headline-icon-weight-xl:var(--db-base-icon-weight-regular-desktop-headline-xl);--db-base-headline-icon-font-size-xl:var(--db-base-icon-font-size-regular-desktop-headline-xl);--db-type-headline-2xl:var(--db-typography-regular-desktop-headline-2xl);--db-base-headline-icon-weight-2xl:var(--db-base-icon-weight-regular-desktop-headline-2xl);--db-base-headline-icon-font-size-2xl:var(--db-base-icon-font-size-regular-desktop-headline-2xl);--db-type-headline-3xl:var(--db-typography-regular-desktop-headline-3xl);--db-base-headline-icon-weight-3xl:var(--db-base-icon-weight-regular-desktop-headline-3xl);--db-base-headline-icon-font-size-3xl:var(--db-base-icon-font-size-regular-desktop-headline-3xl)}}@media(width<=48em){:host,:root{--db-type-body-3xs:var(--db-typography-regular-mobile-body-3xs);--db-base-body-icon-weight-3xs:var(--db-base-icon-weight-regular-mobile-body-3xs);--db-base-body-icon-font-size-3xs:var(--db-base-icon-font-size-regular-mobile-body-3xs);--db-type-body-2xs:var(--db-typography-regular-mobile-body-2xs);--db-base-body-icon-weight-2xs:var(--db-base-icon-weight-regular-mobile-body-2xs);--db-base-body-icon-font-size-2xs:var(--db-base-icon-font-size-regular-mobile-body-2xs);--db-type-body-xs:var(--db-typography-regular-mobile-body-xs);--db-base-body-icon-weight-xs:var(--db-base-icon-weight-regular-mobile-body-xs);--db-base-body-icon-font-size-xs:var(--db-base-icon-font-size-regular-mobile-body-xs);--db-type-body-sm:var(--db-typography-regular-mobile-body-sm);--db-base-body-icon-weight-sm:var(--db-base-icon-weight-regular-mobile-body-sm);--db-base-body-icon-font-size-sm:var(--db-base-icon-font-size-regular-mobile-body-sm);--db-type-body-md:var(--db-typography-regular-mobile-body-md);--db-base-body-icon-weight-md:var(--db-base-icon-weight-regular-mobile-body-md);--db-base-body-icon-font-size-md:var(--db-base-icon-font-size-regular-mobile-body-md);--db-type-body-lg:var(--db-typography-regular-mobile-body-lg);--db-base-body-icon-weight-lg:var(--db-base-icon-weight-regular-mobile-body-lg);--db-base-body-icon-font-size-lg:var(--db-base-icon-font-size-regular-mobile-body-lg);--db-type-body-xl:var(--db-typography-regular-mobile-body-xl);--db-base-body-icon-weight-xl:var(--db-base-icon-weight-regular-mobile-body-xl);--db-base-body-icon-font-size-xl:var(--db-base-icon-font-size-regular-mobile-body-xl);--db-type-body-2xl:var(--db-typography-regular-mobile-body-2xl);--db-base-body-icon-weight-2xl:var(--db-base-icon-weight-regular-mobile-body-2xl);--db-base-body-icon-font-size-2xl:var(--db-base-icon-font-size-regular-mobile-body-2xl);--db-type-body-3xl:var(--db-typography-regular-mobile-body-3xl);--db-base-body-icon-weight-3xl:var(--db-base-icon-weight-regular-mobile-body-3xl);--db-base-body-icon-font-size-3xl:var(--db-base-icon-font-size-regular-mobile-body-3xl)}}@media(48em<width<=64em){:host,:root{--db-type-body-3xs:var(--db-typography-regular-tablet-body-3xs);--db-base-body-icon-weight-3xs:var(--db-base-icon-weight-regular-tablet-body-3xs);--db-base-body-icon-font-size-3xs:var(--db-base-icon-font-size-regular-tablet-body-3xs);--db-type-body-2xs:var(--db-typography-regular-tablet-body-2xs);--db-base-body-icon-weight-2xs:var(--db-base-icon-weight-regular-tablet-body-2xs);--db-base-body-icon-font-size-2xs:var(--db-base-icon-font-size-regular-tablet-body-2xs);--db-type-body-xs:var(--db-typography-regular-tablet-body-xs);--db-base-body-icon-weight-xs:var(--db-base-icon-weight-regular-tablet-body-xs);--db-base-body-icon-font-size-xs:var(--db-base-icon-font-size-regular-tablet-body-xs);--db-type-body-sm:var(--db-typography-regular-tablet-body-sm);--db-base-body-icon-weight-sm:var(--db-base-icon-weight-regular-tablet-body-sm);--db-base-body-icon-font-size-sm:var(--db-base-icon-font-size-regular-tablet-body-sm);--db-type-body-md:var(--db-typography-regular-tablet-body-md);--db-base-body-icon-weight-md:var(--db-base-icon-weight-regular-tablet-body-md);--db-base-body-icon-font-size-md:var(--db-base-icon-font-size-regular-tablet-body-md);--db-type-body-lg:var(--db-typography-regular-tablet-body-lg);--db-base-body-icon-weight-lg:var(--db-base-icon-weight-regular-tablet-body-lg);--db-base-body-icon-font-size-lg:var(--db-base-icon-font-size-regular-tablet-body-lg);--db-type-body-xl:var(--db-typography-regular-tablet-body-xl);--db-base-body-icon-weight-xl:var(--db-base-icon-weight-regular-tablet-body-xl);--db-base-body-icon-font-size-xl:var(--db-base-icon-font-size-regular-tablet-body-xl);--db-type-body-2xl:var(--db-typography-regular-tablet-body-2xl);--db-base-body-icon-weight-2xl:var(--db-base-icon-weight-regular-tablet-body-2xl);--db-base-body-icon-font-size-2xl:var(--db-base-icon-font-size-regular-tablet-body-2xl);--db-type-body-3xl:var(--db-typography-regular-tablet-body-3xl);--db-base-body-icon-weight-3xl:var(--db-base-icon-weight-regular-tablet-body-3xl);--db-base-body-icon-font-size-3xl:var(--db-base-icon-font-size-regular-tablet-body-3xl)}}@media(64em<width){:host,:root{--db-type-body-3xs:var(--db-typography-regular-desktop-body-3xs);--db-base-body-icon-weight-3xs:var(--db-base-icon-weight-regular-desktop-body-3xs);--db-base-body-icon-font-size-3xs:var(--db-base-icon-font-size-regular-desktop-body-3xs);--db-type-body-2xs:var(--db-typography-regular-desktop-body-2xs);--db-base-body-icon-weight-2xs:var(--db-base-icon-weight-regular-desktop-body-2xs);--db-base-body-icon-font-size-2xs:var(--db-base-icon-font-size-regular-desktop-body-2xs);--db-type-body-xs:var(--db-typography-regular-desktop-body-xs);--db-base-body-icon-weight-xs:var(--db-base-icon-weight-regular-desktop-body-xs);--db-base-body-icon-font-size-xs:var(--db-base-icon-font-size-regular-desktop-body-xs);--db-type-body-sm:var(--db-typography-regular-desktop-body-sm);--db-base-body-icon-weight-sm:var(--db-base-icon-weight-regular-desktop-body-sm);--db-base-body-icon-font-size-sm:var(--db-base-icon-font-size-regular-desktop-body-sm);--db-type-body-md:var(--db-typography-regular-desktop-body-md);--db-base-body-icon-weight-md:var(--db-base-icon-weight-regular-desktop-body-md);--db-base-body-icon-font-size-md:var(--db-base-icon-font-size-regular-desktop-body-md);--db-type-body-lg:var(--db-typography-regular-desktop-body-lg);--db-base-body-icon-weight-lg:var(--db-base-icon-weight-regular-desktop-body-lg);--db-base-body-icon-font-size-lg:var(--db-base-icon-font-size-regular-desktop-body-lg);--db-type-body-xl:var(--db-typography-regular-desktop-body-xl);--db-base-body-icon-weight-xl:var(--db-base-icon-weight-regular-desktop-body-xl);--db-base-body-icon-font-size-xl:var(--db-base-icon-font-size-regular-desktop-body-xl);--db-type-body-2xl:var(--db-typography-regular-desktop-body-2xl);--db-base-body-icon-weight-2xl:var(--db-base-icon-weight-regular-desktop-body-2xl);--db-base-body-icon-font-size-2xl:var(--db-base-icon-font-size-regular-desktop-body-2xl);--db-type-body-3xl:var(--db-typography-regular-desktop-body-3xl);--db-base-body-icon-weight-3xl:var(--db-base-icon-weight-regular-desktop-body-3xl);--db-base-body-icon-font-size-3xl:var(--db-base-icon-font-size-regular-desktop-body-3xl)}}
97
+ )}:host,:root{background-color:var(--db-neutral-bg-basic-level-1-default);color:var(--db-neutral-on-bg-basic-emphasis-100-default)}:root:after,:root:before{--db-icon-color:var(--db-neutral-on-bg-basic-emphasis-100-default)}:host,:root{font:var(--db-type-body-md);--db-icon-font-weight:var(--db-base-body-icon-weight-md);--db-icon-font-size:var(--db-base-body-icon-font-size-md)}:host,:root{--db-sizing-3xs:var(--db-sizing-regular-3xs);--db-sizing-2xs:var(--db-sizing-regular-2xs);--db-sizing-xs:var(--db-sizing-regular-xs);--db-sizing-sm:var(--db-sizing-regular-sm);--db-sizing-md:var(--db-sizing-regular-md);--db-sizing-lg:var(--db-sizing-regular-lg);--db-sizing-xl:var(--db-sizing-regular-xl);--db-sizing-2xl:var(--db-sizing-regular-2xl);--db-sizing-3xl:var(--db-sizing-regular-3xl);--db-spacing-fixed-3xs:var(--db-spacing-fixed-regular-3xs);--db-spacing-fixed-2xs:var(--db-spacing-fixed-regular-2xs);--db-spacing-fixed-xs:var(--db-spacing-fixed-regular-xs);--db-spacing-fixed-sm:var(--db-spacing-fixed-regular-sm);--db-spacing-fixed-md:var(--db-spacing-fixed-regular-md);--db-spacing-fixed-lg:var(--db-spacing-fixed-regular-lg);--db-spacing-fixed-xl:var(--db-spacing-fixed-regular-xl);--db-spacing-fixed-2xl:var(--db-spacing-fixed-regular-2xl);--db-spacing-fixed-3xl:var(--db-spacing-fixed-regular-3xl)}@media(width<=48em){:host,:root{--db-spacing-responsive-3xs:var(--db-spacing-responsive-regular-mobile-3xs);--db-spacing-responsive-2xs:var(--db-spacing-responsive-regular-mobile-2xs);--db-spacing-responsive-xs:var(--db-spacing-responsive-regular-mobile-xs);--db-spacing-responsive-sm:var(--db-spacing-responsive-regular-mobile-sm);--db-spacing-responsive-md:var(--db-spacing-responsive-regular-mobile-md);--db-spacing-responsive-lg:var(--db-spacing-responsive-regular-mobile-lg);--db-spacing-responsive-xl:var(--db-spacing-responsive-regular-mobile-xl);--db-spacing-responsive-2xl:var(--db-spacing-responsive-regular-mobile-2xl);--db-spacing-responsive-3xl:var(--db-spacing-responsive-regular-mobile-3xl)}:host,:root{--db-type-headline-3xs:var(--db-typography-regular-mobile-headline-3xs);--db-base-headline-icon-weight-3xs:var(--db-base-icon-weight-regular-mobile-headline-3xs);--db-base-headline-icon-font-size-3xs:var(--db-base-icon-font-size-regular-mobile-headline-3xs);--db-type-headline-2xs:var(--db-typography-regular-mobile-headline-2xs);--db-base-headline-icon-weight-2xs:var(--db-base-icon-weight-regular-mobile-headline-2xs);--db-base-headline-icon-font-size-2xs:var(--db-base-icon-font-size-regular-mobile-headline-2xs);--db-type-headline-xs:var(--db-typography-regular-mobile-headline-xs);--db-base-headline-icon-weight-xs:var(--db-base-icon-weight-regular-mobile-headline-xs);--db-base-headline-icon-font-size-xs:var(--db-base-icon-font-size-regular-mobile-headline-xs);--db-type-headline-sm:var(--db-typography-regular-mobile-headline-sm);--db-base-headline-icon-weight-sm:var(--db-base-icon-weight-regular-mobile-headline-sm);--db-base-headline-icon-font-size-sm:var(--db-base-icon-font-size-regular-mobile-headline-sm);--db-type-headline-md:var(--db-typography-regular-mobile-headline-md);--db-base-headline-icon-weight-md:var(--db-base-icon-weight-regular-mobile-headline-md);--db-base-headline-icon-font-size-md:var(--db-base-icon-font-size-regular-mobile-headline-md);--db-type-headline-lg:var(--db-typography-regular-mobile-headline-lg);--db-base-headline-icon-weight-lg:var(--db-base-icon-weight-regular-mobile-headline-lg);--db-base-headline-icon-font-size-lg:var(--db-base-icon-font-size-regular-mobile-headline-lg);--db-type-headline-xl:var(--db-typography-regular-mobile-headline-xl);--db-base-headline-icon-weight-xl:var(--db-base-icon-weight-regular-mobile-headline-xl);--db-base-headline-icon-font-size-xl:var(--db-base-icon-font-size-regular-mobile-headline-xl);--db-type-headline-2xl:var(--db-typography-regular-mobile-headline-2xl);--db-base-headline-icon-weight-2xl:var(--db-base-icon-weight-regular-mobile-headline-2xl);--db-base-headline-icon-font-size-2xl:var(--db-base-icon-font-size-regular-mobile-headline-2xl);--db-type-headline-3xl:var(--db-typography-regular-mobile-headline-3xl);--db-base-headline-icon-weight-3xl:var(--db-base-icon-weight-regular-mobile-headline-3xl);--db-base-headline-icon-font-size-3xl:var(--db-base-icon-font-size-regular-mobile-headline-3xl)}:host,:root{--db-type-body-3xs:var(--db-typography-regular-mobile-body-3xs);--db-base-body-icon-weight-3xs:var(--db-base-icon-weight-regular-mobile-body-3xs);--db-base-body-icon-font-size-3xs:var(--db-base-icon-font-size-regular-mobile-body-3xs);--db-type-body-2xs:var(--db-typography-regular-mobile-body-2xs);--db-base-body-icon-weight-2xs:var(--db-base-icon-weight-regular-mobile-body-2xs);--db-base-body-icon-font-size-2xs:var(--db-base-icon-font-size-regular-mobile-body-2xs);--db-type-body-xs:var(--db-typography-regular-mobile-body-xs);--db-base-body-icon-weight-xs:var(--db-base-icon-weight-regular-mobile-body-xs);--db-base-body-icon-font-size-xs:var(--db-base-icon-font-size-regular-mobile-body-xs);--db-type-body-sm:var(--db-typography-regular-mobile-body-sm);--db-base-body-icon-weight-sm:var(--db-base-icon-weight-regular-mobile-body-sm);--db-base-body-icon-font-size-sm:var(--db-base-icon-font-size-regular-mobile-body-sm);--db-type-body-md:var(--db-typography-regular-mobile-body-md);--db-base-body-icon-weight-md:var(--db-base-icon-weight-regular-mobile-body-md);--db-base-body-icon-font-size-md:var(--db-base-icon-font-size-regular-mobile-body-md);--db-type-body-lg:var(--db-typography-regular-mobile-body-lg);--db-base-body-icon-weight-lg:var(--db-base-icon-weight-regular-mobile-body-lg);--db-base-body-icon-font-size-lg:var(--db-base-icon-font-size-regular-mobile-body-lg);--db-type-body-xl:var(--db-typography-regular-mobile-body-xl);--db-base-body-icon-weight-xl:var(--db-base-icon-weight-regular-mobile-body-xl);--db-base-body-icon-font-size-xl:var(--db-base-icon-font-size-regular-mobile-body-xl);--db-type-body-2xl:var(--db-typography-regular-mobile-body-2xl);--db-base-body-icon-weight-2xl:var(--db-base-icon-weight-regular-mobile-body-2xl);--db-base-body-icon-font-size-2xl:var(--db-base-icon-font-size-regular-mobile-body-2xl);--db-type-body-3xl:var(--db-typography-regular-mobile-body-3xl);--db-base-body-icon-weight-3xl:var(--db-base-icon-weight-regular-mobile-body-3xl);--db-base-body-icon-font-size-3xl:var(--db-base-icon-font-size-regular-mobile-body-3xl)}}@media(48em<width<=64em){:host,:root{--db-spacing-responsive-3xs:var(--db-spacing-responsive-regular-tablet-3xs);--db-spacing-responsive-2xs:var(--db-spacing-responsive-regular-tablet-2xs);--db-spacing-responsive-xs:var(--db-spacing-responsive-regular-tablet-xs);--db-spacing-responsive-sm:var(--db-spacing-responsive-regular-tablet-sm);--db-spacing-responsive-md:var(--db-spacing-responsive-regular-tablet-md);--db-spacing-responsive-lg:var(--db-spacing-responsive-regular-tablet-lg);--db-spacing-responsive-xl:var(--db-spacing-responsive-regular-tablet-xl);--db-spacing-responsive-2xl:var(--db-spacing-responsive-regular-tablet-2xl);--db-spacing-responsive-3xl:var(--db-spacing-responsive-regular-tablet-3xl)}:host,:root{--db-type-headline-3xs:var(--db-typography-regular-tablet-headline-3xs);--db-base-headline-icon-weight-3xs:var(--db-base-icon-weight-regular-tablet-headline-3xs);--db-base-headline-icon-font-size-3xs:var(--db-base-icon-font-size-regular-tablet-headline-3xs);--db-type-headline-2xs:var(--db-typography-regular-tablet-headline-2xs);--db-base-headline-icon-weight-2xs:var(--db-base-icon-weight-regular-tablet-headline-2xs);--db-base-headline-icon-font-size-2xs:var(--db-base-icon-font-size-regular-tablet-headline-2xs);--db-type-headline-xs:var(--db-typography-regular-tablet-headline-xs);--db-base-headline-icon-weight-xs:var(--db-base-icon-weight-regular-tablet-headline-xs);--db-base-headline-icon-font-size-xs:var(--db-base-icon-font-size-regular-tablet-headline-xs);--db-type-headline-sm:var(--db-typography-regular-tablet-headline-sm);--db-base-headline-icon-weight-sm:var(--db-base-icon-weight-regular-tablet-headline-sm);--db-base-headline-icon-font-size-sm:var(--db-base-icon-font-size-regular-tablet-headline-sm);--db-type-headline-md:var(--db-typography-regular-tablet-headline-md);--db-base-headline-icon-weight-md:var(--db-base-icon-weight-regular-tablet-headline-md);--db-base-headline-icon-font-size-md:var(--db-base-icon-font-size-regular-tablet-headline-md);--db-type-headline-lg:var(--db-typography-regular-tablet-headline-lg);--db-base-headline-icon-weight-lg:var(--db-base-icon-weight-regular-tablet-headline-lg);--db-base-headline-icon-font-size-lg:var(--db-base-icon-font-size-regular-tablet-headline-lg);--db-type-headline-xl:var(--db-typography-regular-tablet-headline-xl);--db-base-headline-icon-weight-xl:var(--db-base-icon-weight-regular-tablet-headline-xl);--db-base-headline-icon-font-size-xl:var(--db-base-icon-font-size-regular-tablet-headline-xl);--db-type-headline-2xl:var(--db-typography-regular-tablet-headline-2xl);--db-base-headline-icon-weight-2xl:var(--db-base-icon-weight-regular-tablet-headline-2xl);--db-base-headline-icon-font-size-2xl:var(--db-base-icon-font-size-regular-tablet-headline-2xl);--db-type-headline-3xl:var(--db-typography-regular-tablet-headline-3xl);--db-base-headline-icon-weight-3xl:var(--db-base-icon-weight-regular-tablet-headline-3xl);--db-base-headline-icon-font-size-3xl:var(--db-base-icon-font-size-regular-tablet-headline-3xl)}:host,:root{--db-type-body-3xs:var(--db-typography-regular-tablet-body-3xs);--db-base-body-icon-weight-3xs:var(--db-base-icon-weight-regular-tablet-body-3xs);--db-base-body-icon-font-size-3xs:var(--db-base-icon-font-size-regular-tablet-body-3xs);--db-type-body-2xs:var(--db-typography-regular-tablet-body-2xs);--db-base-body-icon-weight-2xs:var(--db-base-icon-weight-regular-tablet-body-2xs);--db-base-body-icon-font-size-2xs:var(--db-base-icon-font-size-regular-tablet-body-2xs);--db-type-body-xs:var(--db-typography-regular-tablet-body-xs);--db-base-body-icon-weight-xs:var(--db-base-icon-weight-regular-tablet-body-xs);--db-base-body-icon-font-size-xs:var(--db-base-icon-font-size-regular-tablet-body-xs);--db-type-body-sm:var(--db-typography-regular-tablet-body-sm);--db-base-body-icon-weight-sm:var(--db-base-icon-weight-regular-tablet-body-sm);--db-base-body-icon-font-size-sm:var(--db-base-icon-font-size-regular-tablet-body-sm);--db-type-body-md:var(--db-typography-regular-tablet-body-md);--db-base-body-icon-weight-md:var(--db-base-icon-weight-regular-tablet-body-md);--db-base-body-icon-font-size-md:var(--db-base-icon-font-size-regular-tablet-body-md);--db-type-body-lg:var(--db-typography-regular-tablet-body-lg);--db-base-body-icon-weight-lg:var(--db-base-icon-weight-regular-tablet-body-lg);--db-base-body-icon-font-size-lg:var(--db-base-icon-font-size-regular-tablet-body-lg);--db-type-body-xl:var(--db-typography-regular-tablet-body-xl);--db-base-body-icon-weight-xl:var(--db-base-icon-weight-regular-tablet-body-xl);--db-base-body-icon-font-size-xl:var(--db-base-icon-font-size-regular-tablet-body-xl);--db-type-body-2xl:var(--db-typography-regular-tablet-body-2xl);--db-base-body-icon-weight-2xl:var(--db-base-icon-weight-regular-tablet-body-2xl);--db-base-body-icon-font-size-2xl:var(--db-base-icon-font-size-regular-tablet-body-2xl);--db-type-body-3xl:var(--db-typography-regular-tablet-body-3xl);--db-base-body-icon-weight-3xl:var(--db-base-icon-weight-regular-tablet-body-3xl);--db-base-body-icon-font-size-3xl:var(--db-base-icon-font-size-regular-tablet-body-3xl)}}@media(64em<width){:host,:root{--db-spacing-responsive-3xs:var(--db-spacing-responsive-regular-desktop-3xs);--db-spacing-responsive-2xs:var(--db-spacing-responsive-regular-desktop-2xs);--db-spacing-responsive-xs:var(--db-spacing-responsive-regular-desktop-xs);--db-spacing-responsive-sm:var(--db-spacing-responsive-regular-desktop-sm);--db-spacing-responsive-md:var(--db-spacing-responsive-regular-desktop-md);--db-spacing-responsive-lg:var(--db-spacing-responsive-regular-desktop-lg);--db-spacing-responsive-xl:var(--db-spacing-responsive-regular-desktop-xl);--db-spacing-responsive-2xl:var(--db-spacing-responsive-regular-desktop-2xl);--db-spacing-responsive-3xl:var(--db-spacing-responsive-regular-desktop-3xl)}:host,:root{--db-type-headline-3xs:var(--db-typography-regular-desktop-headline-3xs);--db-base-headline-icon-weight-3xs:var(--db-base-icon-weight-regular-desktop-headline-3xs);--db-base-headline-icon-font-size-3xs:var(--db-base-icon-font-size-regular-desktop-headline-3xs);--db-type-headline-2xs:var(--db-typography-regular-desktop-headline-2xs);--db-base-headline-icon-weight-2xs:var(--db-base-icon-weight-regular-desktop-headline-2xs);--db-base-headline-icon-font-size-2xs:var(--db-base-icon-font-size-regular-desktop-headline-2xs);--db-type-headline-xs:var(--db-typography-regular-desktop-headline-xs);--db-base-headline-icon-weight-xs:var(--db-base-icon-weight-regular-desktop-headline-xs);--db-base-headline-icon-font-size-xs:var(--db-base-icon-font-size-regular-desktop-headline-xs);--db-type-headline-sm:var(--db-typography-regular-desktop-headline-sm);--db-base-headline-icon-weight-sm:var(--db-base-icon-weight-regular-desktop-headline-sm);--db-base-headline-icon-font-size-sm:var(--db-base-icon-font-size-regular-desktop-headline-sm);--db-type-headline-md:var(--db-typography-regular-desktop-headline-md);--db-base-headline-icon-weight-md:var(--db-base-icon-weight-regular-desktop-headline-md);--db-base-headline-icon-font-size-md:var(--db-base-icon-font-size-regular-desktop-headline-md);--db-type-headline-lg:var(--db-typography-regular-desktop-headline-lg);--db-base-headline-icon-weight-lg:var(--db-base-icon-weight-regular-desktop-headline-lg);--db-base-headline-icon-font-size-lg:var(--db-base-icon-font-size-regular-desktop-headline-lg);--db-type-headline-xl:var(--db-typography-regular-desktop-headline-xl);--db-base-headline-icon-weight-xl:var(--db-base-icon-weight-regular-desktop-headline-xl);--db-base-headline-icon-font-size-xl:var(--db-base-icon-font-size-regular-desktop-headline-xl);--db-type-headline-2xl:var(--db-typography-regular-desktop-headline-2xl);--db-base-headline-icon-weight-2xl:var(--db-base-icon-weight-regular-desktop-headline-2xl);--db-base-headline-icon-font-size-2xl:var(--db-base-icon-font-size-regular-desktop-headline-2xl);--db-type-headline-3xl:var(--db-typography-regular-desktop-headline-3xl);--db-base-headline-icon-weight-3xl:var(--db-base-icon-weight-regular-desktop-headline-3xl);--db-base-headline-icon-font-size-3xl:var(--db-base-icon-font-size-regular-desktop-headline-3xl)}:host,:root{--db-type-body-3xs:var(--db-typography-regular-desktop-body-3xs);--db-base-body-icon-weight-3xs:var(--db-base-icon-weight-regular-desktop-body-3xs);--db-base-body-icon-font-size-3xs:var(--db-base-icon-font-size-regular-desktop-body-3xs);--db-type-body-2xs:var(--db-typography-regular-desktop-body-2xs);--db-base-body-icon-weight-2xs:var(--db-base-icon-weight-regular-desktop-body-2xs);--db-base-body-icon-font-size-2xs:var(--db-base-icon-font-size-regular-desktop-body-2xs);--db-type-body-xs:var(--db-typography-regular-desktop-body-xs);--db-base-body-icon-weight-xs:var(--db-base-icon-weight-regular-desktop-body-xs);--db-base-body-icon-font-size-xs:var(--db-base-icon-font-size-regular-desktop-body-xs);--db-type-body-sm:var(--db-typography-regular-desktop-body-sm);--db-base-body-icon-weight-sm:var(--db-base-icon-weight-regular-desktop-body-sm);--db-base-body-icon-font-size-sm:var(--db-base-icon-font-size-regular-desktop-body-sm);--db-type-body-md:var(--db-typography-regular-desktop-body-md);--db-base-body-icon-weight-md:var(--db-base-icon-weight-regular-desktop-body-md);--db-base-body-icon-font-size-md:var(--db-base-icon-font-size-regular-desktop-body-md);--db-type-body-lg:var(--db-typography-regular-desktop-body-lg);--db-base-body-icon-weight-lg:var(--db-base-icon-weight-regular-desktop-body-lg);--db-base-body-icon-font-size-lg:var(--db-base-icon-font-size-regular-desktop-body-lg);--db-type-body-xl:var(--db-typography-regular-desktop-body-xl);--db-base-body-icon-weight-xl:var(--db-base-icon-weight-regular-desktop-body-xl);--db-base-body-icon-font-size-xl:var(--db-base-icon-font-size-regular-desktop-body-xl);--db-type-body-2xl:var(--db-typography-regular-desktop-body-2xl);--db-base-body-icon-weight-2xl:var(--db-base-icon-weight-regular-desktop-body-2xl);--db-base-body-icon-font-size-2xl:var(--db-base-icon-font-size-regular-desktop-body-2xl);--db-type-body-3xl:var(--db-typography-regular-desktop-body-3xl);--db-base-body-icon-weight-3xl:var(--db-base-icon-weight-regular-desktop-body-3xl);--db-base-body-icon-font-size-3xl:var(--db-base-icon-font-size-regular-desktop-body-3xl)}}
package/build/styles/helpers/_a11y.scss CHANGED
@@ -1,5 +1,5 @@
1
1
  // stylelint-disable property-no-deprecated, db-ux/use-sizing
2
- %a11y-visually-hidden {
2
+ @mixin a11y-visually-hidden {
3
3
  position: absolute !important;
4
4
  inset-block-start: 0 !important;
5
5
  inline-size: 1px !important;
@@ -12,6 +12,10 @@
12
12
  pointer-events: none !important;
13
13
  }
14
14
 
15
+ %a11y-visually-hidden {
16
+ @include a11y-visually-hidden;
17
+ }
18
+
15
19
  // Hides text while keeping the element visible (e.g. for background images).
16
20
  // RTL-safe alternative to text-indent: -9999px.
17
21
  @mixin a11y-visually-hidden-text {
package/build/styles/helpers/_focus.scss CHANGED
@@ -1,6 +1,11 @@
1
1
  @use "../variables";
2
2
  @use "../colors";
3
3
 
4
+ // Room the focus ring needs outside the border box, for scroll containers to reserve.
5
+ $db-focus-outline-reach: calc(
6
+ #{variables.$db-border-width-xs} + #{variables.$db-border-width-2xs}
7
+ );
8
+
4
9
  @mixin get-focus-placeholder {
5
10
  outline: #{variables.$db-border-width-2xs} solid
6
11
  var(
@@ -21,3 +26,25 @@
21
26
  }
22
27
  }
23
28
  }
29
+
30
+ // Reserves ring space inside a clipping container, margin compensating it.
31
+ // This owns the `padding` and `margin` of the element it sits on. CSS cannot
32
+ // read an existing value, so there is nothing to add to: the shorthands either
33
+ // replace all four sides of a container's own spacing, or lose against a more
34
+ // specific selector and silently reserve nothing. The padding and the
35
+ // `content-box` are also what keeps the reserve layout-neutral, and that only
36
+ // works out while the padding is ours alone. So this belongs on a container
37
+ // without spacing or a fixed size of its own; for anything else, move the clip
38
+ // to a wrapper and put this on the wrapper, keeping the spacing inside.
39
+ @mixin get-focus-container {
40
+ // `border-box` would absorb the padding, leaving the margin to displace.
41
+ box-sizing: content-box;
42
+ // stylelint-disable-next-line db-ux/use-spacings
43
+ padding: $db-focus-outline-reach;
44
+ // stylelint-disable-next-line db-ux/use-spacings
45
+ margin: calc(-1 * #{$db-focus-outline-reach});
46
+ }
47
+
48
+ %focus-container-placeholder {
49
+ @include get-focus-container;
50
+ }
package/build/styles/helpers/classes/all.css CHANGED
@@ -12,6 +12,13 @@
12
12
  border-radius: var(--db-border-radius-xs);
13
13
  }
14
14
 
15
+ .db-focus-container,
16
+ [data-focus-container=true] {
17
+ box-sizing: content-box;
18
+ padding: calc(var(--db-border-width-xs) + var(--db-border-width-2xs));
19
+ margin: calc(-1 * calc(var(--db-border-width-xs) + var(--db-border-width-2xs)));
20
+ }
21
+
15
22
  .db-divider-top-before,
16
23
  [data-divider=top-before] {
17
24
  --db-divider-bg-color: var(--db-adaptive-on-bg-basic-emphasis-60-default);
package/build/styles/helpers/classes/focus.css CHANGED
@@ -11,3 +11,10 @@
11
11
  [data-focus=default]:not([data-disable-focus=true]):not([type=radio], [role=switch]) {
12
12
  border-radius: var(--db-border-radius-xs);
13
13
  }
14
+
15
+ .db-focus-container,
16
+ [data-focus-container=true] {
17
+ box-sizing: content-box;
18
+ padding: calc(var(--db-border-width-xs) + var(--db-border-width-2xs));
19
+ margin: calc(-1 * calc(var(--db-border-width-xs) + var(--db-border-width-2xs)));
20
+ }
package/build/styles/helpers/classes/focus.scss CHANGED
@@ -4,3 +4,8 @@
4
4
  [data-focus="default"] {
5
5
  @extend %focus-placeholder;
6
6
  }
7
+
8
+ .db-focus-container,
9
+ [data-focus-container="true"] {
10
+ @extend %focus-container-placeholder;
11
+ }
package/build/styles/icons/_icon-helpers.scss CHANGED
@@ -41,14 +41,18 @@ $default-icon-font-size: var(--db-icon-font-size, #{$default-icon-size-rem});
41
41
  }
42
42
  }
43
43
 
44
- @mixin to-filled-icon() {
44
+ @mixin icon-font-family($variant) {
45
45
  --db-icon-font-family: var(
46
- --db-icon-filled-font-family,
47
- "db-ux-filled",
46
+ --db-icon-#{$variant}-font-family,
47
+ "db-ux-#{$variant}",
48
48
  "icon-font-fallback"
49
49
  );
50
50
  }
51
51
 
52
+ @mixin to-filled-icon() {
53
+ @include icon-font-family("filled");
54
+ }
55
+
52
56
  // Icon SCSS mixin
53
57
  @mixin set-icon($icon: "", $position: "before") {
54
58
  $pos: "leading";
package/build/styles/icons/absolute.css CHANGED
@@ -1 +1 @@
1
- @font-face{font-display:block;font-family:db-ux-default;font-style:normal;font-weight:400;src:url(/assets/icons/fonts/default/db-ux.woff2) format("woff2")}@font-face{font-display:block;font-family:db-ux-default;font-style:normal;font-weight:16;src:url(/assets/icons/fonts/default_16/db-ux.woff2) format("woff2")}@font-face{font-display:block;font-family:db-ux-default;font-style:normal;font-weight:20;src:url(/assets/icons/fonts/default_20/db-ux.woff2) format("woff2")}@font-face{font-display:block;font-family:db-ux-default;font-style:normal;font-weight:24;src:url(/assets/icons/fonts/default_24/db-ux.woff2) format("woff2")}@font-face{font-display:block;font-family:db-ux-default;font-style:normal;font-weight:32;src:url(/assets/icons/fonts/default_32/db-ux.woff2) format("woff2")}@font-face{font-display:block;font-family:db-ux-default;font-style:normal;font-weight:48;src:url(/assets/icons/fonts/default_48/db-ux.woff2) format("woff2")}@font-face{font-display:block;font-family:db-ux-default;font-style:normal;font-weight:64;src:url(/assets/icons/fonts/default_64/db-ux.woff2) format("woff2")}[data-icon-variant-after=default]:after,[data-icon-variant-before=default]:before,[data-icon-variant=default]:before{--db-icon-font-family:"db-ux-default"}@font-face{font-display:block;font-family:db-ux-filled;font-style:normal;font-weight:400;src:url(/assets/icons/fonts/filled/db-ux.woff2) format("woff2")}@font-face{font-display:block;font-family:db-ux-filled;font-style:normal;font-weight:16;src:url(/assets/icons/fonts/filled_16/db-ux.woff2) format("woff2")}[data-icon-weight-after="16"]:after,[data-icon-weight-before="16"]:before,[data-icon-weight="16"]:before{--db-icon-font-weight:16}@font-face{font-display:block;font-family:db-ux-filled;font-style:normal;font-weight:20;src:url(/assets/icons/fonts/filled_20/db-ux.woff2) format("woff2")}[data-icon-weight-after="20"]:after,[data-icon-weight-before="20"]:before,[data-icon-weight="20"]:before{--db-icon-font-weight:20}@font-face{font-display:block;font-family:db-ux-filled;font-style:normal;font-weight:24;src:url(/assets/icons/fonts/filled_24/db-ux.woff2) format("woff2")}[data-icon-weight-after="24"]:after,[data-icon-weight-before="24"]:before,[data-icon-weight="24"]:before{--db-icon-font-weight:24}@font-face{font-display:block;font-family:db-ux-filled;font-style:normal;font-weight:32;src:url(/assets/icons/fonts/filled_32/db-ux.woff2) format("woff2")}[data-icon-weight-after="32"]:after,[data-icon-weight-before="32"]:before,[data-icon-weight="32"]:before{--db-icon-font-weight:32}@font-face{font-display:block;font-family:db-ux-filled;font-style:normal;font-weight:48;src:url(/assets/icons/fonts/filled_48/db-ux.woff2) format("woff2")}[data-icon-weight-after="48"]:after,[data-icon-weight-before="48"]:before,[data-icon-weight="48"]:before{--db-icon-font-weight:48}@font-face{font-display:block;font-family:db-ux-filled;font-style:normal;font-weight:64;src:url(/assets/icons/fonts/filled_64/db-ux.woff2) format("woff2")}[data-icon-weight-after="64"]:after,[data-icon-weight-before="64"]:before,[data-icon-weight="64"]:before{--db-icon-font-weight:64}[data-icon-variant-after=filled]:after,[data-icon-variant-before=filled]:before,[data-icon-variant=filled]:before{--db-icon-font-family:"db-ux-filled"}
1
+ @font-face{font-display:block;font-family:db-ux-default;font-style:normal;font-weight:400;src:url(/assets/icons/fonts/default/db-ux.woff2) format("woff2")}@font-face{font-display:block;font-family:db-ux-default;font-style:normal;font-weight:16;src:url(/assets/icons/fonts/default_16/db-ux.woff2) format("woff2")}@font-face{font-display:block;font-family:db-ux-default;font-style:normal;font-weight:20;src:url(/assets/icons/fonts/default_20/db-ux.woff2) format("woff2")}@font-face{font-display:block;font-family:db-ux-default;font-style:normal;font-weight:24;src:url(/assets/icons/fonts/default_24/db-ux.woff2) format("woff2")}@font-face{font-display:block;font-family:db-ux-default;font-style:normal;font-weight:32;src:url(/assets/icons/fonts/default_32/db-ux.woff2) format("woff2")}@font-face{font-display:block;font-family:db-ux-default;font-style:normal;font-weight:48;src:url(/assets/icons/fonts/default_48/db-ux.woff2) format("woff2")}@font-face{font-display:block;font-family:db-ux-default;font-style:normal;font-weight:64;src:url(/assets/icons/fonts/default_64/db-ux.woff2) format("woff2")}@font-face{font-display:block;font-family:db-ux-filled;font-style:normal;font-weight:400;src:url(/assets/icons/fonts/filled/db-ux.woff2) format("woff2")}@font-face{font-display:block;font-family:db-ux-filled;font-style:normal;font-weight:16;src:url(/assets/icons/fonts/filled_16/db-ux.woff2) format("woff2")}[data-icon-weight-after="16"]:after,[data-icon-weight-before="16"]:before,[data-icon-weight="16"]:before{--db-icon-font-weight:16}@font-face{font-display:block;font-family:db-ux-filled;font-style:normal;font-weight:20;src:url(/assets/icons/fonts/filled_20/db-ux.woff2) format("woff2")}[data-icon-weight-after="20"]:after,[data-icon-weight-before="20"]:before,[data-icon-weight="20"]:before{--db-icon-font-weight:20}@font-face{font-display:block;font-family:db-ux-filled;font-style:normal;font-weight:24;src:url(/assets/icons/fonts/filled_24/db-ux.woff2) format("woff2")}[data-icon-weight-after="24"]:after,[data-icon-weight-before="24"]:before,[data-icon-weight="24"]:before{--db-icon-font-weight:24}@font-face{font-display:block;font-family:db-ux-filled;font-style:normal;font-weight:32;src:url(/assets/icons/fonts/filled_32/db-ux.woff2) format("woff2")}[data-icon-weight-after="32"]:after,[data-icon-weight-before="32"]:before,[data-icon-weight="32"]:before{--db-icon-font-weight:32}@font-face{font-display:block;font-family:db-ux-filled;font-style:normal;font-weight:48;src:url(/assets/icons/fonts/filled_48/db-ux.woff2) format("woff2")}[data-icon-weight-after="48"]:after,[data-icon-weight-before="48"]:before,[data-icon-weight="48"]:before{--db-icon-font-weight:48}@font-face{font-display:block;font-family:db-ux-filled;font-style:normal;font-weight:64;src:url(/assets/icons/fonts/filled_64/db-ux.woff2) format("woff2")}[data-icon-weight-after="64"]:after,[data-icon-weight-before="64"]:before,[data-icon-weight="64"]:before{--db-icon-font-weight:64}
package/build/styles/icons/relative.css CHANGED
@@ -1 +1 @@
1
- @font-face{font-display:block;font-family:db-ux-default;font-style:normal;font-weight:400;src:url(../../assets/icons/fonts/default/db-ux.woff2) format("woff2")}@font-face{font-display:block;font-family:db-ux-default;font-style:normal;font-weight:16;src:url(../../assets/icons/fonts/default_16/db-ux.woff2) format("woff2")}@font-face{font-display:block;font-family:db-ux-default;font-style:normal;font-weight:20;src:url(../../assets/icons/fonts/default_20/db-ux.woff2) format("woff2")}@font-face{font-display:block;font-family:db-ux-default;font-style:normal;font-weight:24;src:url(../../assets/icons/fonts/default_24/db-ux.woff2) format("woff2")}@font-face{font-display:block;font-family:db-ux-default;font-style:normal;font-weight:32;src:url(../../assets/icons/fonts/default_32/db-ux.woff2) format("woff2")}@font-face{font-display:block;font-family:db-ux-default;font-style:normal;font-weight:48;src:url(../../assets/icons/fonts/default_48/db-ux.woff2) format("woff2")}@font-face{font-display:block;font-family:db-ux-default;font-style:normal;font-weight:64;src:url(../../assets/icons/fonts/default_64/db-ux.woff2) format("woff2")}[data-icon-variant-after=default]:after,[data-icon-variant-before=default]:before,[data-icon-variant=default]:before{--db-icon-font-family:"db-ux-default"}@font-face{font-display:block;font-family:db-ux-filled;font-style:normal;font-weight:400;src:url(../../assets/icons/fonts/filled/db-ux.woff2) format("woff2")}@font-face{font-display:block;font-family:db-ux-filled;font-style:normal;font-weight:16;src:url(../../assets/icons/fonts/filled_16/db-ux.woff2) format("woff2")}[data-icon-weight-after="16"]:after,[data-icon-weight-before="16"]:before,[data-icon-weight="16"]:before{--db-icon-font-weight:16}@font-face{font-display:block;font-family:db-ux-filled;font-style:normal;font-weight:20;src:url(../../assets/icons/fonts/filled_20/db-ux.woff2) format("woff2")}[data-icon-weight-after="20"]:after,[data-icon-weight-before="20"]:before,[data-icon-weight="20"]:before{--db-icon-font-weight:20}@font-face{font-display:block;font-family:db-ux-filled;font-style:normal;font-weight:24;src:url(../../assets/icons/fonts/filled_24/db-ux.woff2) format("woff2")}[data-icon-weight-after="24"]:after,[data-icon-weight-before="24"]:before,[data-icon-weight="24"]:before{--db-icon-font-weight:24}@font-face{font-display:block;font-family:db-ux-filled;font-style:normal;font-weight:32;src:url(../../assets/icons/fonts/filled_32/db-ux.woff2) format("woff2")}[data-icon-weight-after="32"]:after,[data-icon-weight-before="32"]:before,[data-icon-weight="32"]:before{--db-icon-font-weight:32}@font-face{font-display:block;font-family:db-ux-filled;font-style:normal;font-weight:48;src:url(../../assets/icons/fonts/filled_48/db-ux.woff2) format("woff2")}[data-icon-weight-after="48"]:after,[data-icon-weight-before="48"]:before,[data-icon-weight="48"]:before{--db-icon-font-weight:48}@font-face{font-display:block;font-family:db-ux-filled;font-style:normal;font-weight:64;src:url(../../assets/icons/fonts/filled_64/db-ux.woff2) format("woff2")}[data-icon-weight-after="64"]:after,[data-icon-weight-before="64"]:before,[data-icon-weight="64"]:before{--db-icon-font-weight:64}[data-icon-variant-after=filled]:after,[data-icon-variant-before=filled]:before,[data-icon-variant=filled]:before{--db-icon-font-family:"db-ux-filled"}
1
+ @font-face{font-display:block;font-family:db-ux-default;font-style:normal;font-weight:400;src:url(../../assets/icons/fonts/default/db-ux.woff2) format("woff2")}@font-face{font-display:block;font-family:db-ux-default;font-style:normal;font-weight:16;src:url(../../assets/icons/fonts/default_16/db-ux.woff2) format("woff2")}@font-face{font-display:block;font-family:db-ux-default;font-style:normal;font-weight:20;src:url(../../assets/icons/fonts/default_20/db-ux.woff2) format("woff2")}@font-face{font-display:block;font-family:db-ux-default;font-style:normal;font-weight:24;src:url(../../assets/icons/fonts/default_24/db-ux.woff2) format("woff2")}@font-face{font-display:block;font-family:db-ux-default;font-style:normal;font-weight:32;src:url(../../assets/icons/fonts/default_32/db-ux.woff2) format("woff2")}@font-face{font-display:block;font-family:db-ux-default;font-style:normal;font-weight:48;src:url(../../assets/icons/fonts/default_48/db-ux.woff2) format("woff2")}@font-face{font-display:block;font-family:db-ux-default;font-style:normal;font-weight:64;src:url(../../assets/icons/fonts/default_64/db-ux.woff2) format("woff2")}@font-face{font-display:block;font-family:db-ux-filled;font-style:normal;font-weight:400;src:url(../../assets/icons/fonts/filled/db-ux.woff2) format("woff2")}@font-face{font-display:block;font-family:db-ux-filled;font-style:normal;font-weight:16;src:url(../../assets/icons/fonts/filled_16/db-ux.woff2) format("woff2")}[data-icon-weight-after="16"]:after,[data-icon-weight-before="16"]:before,[data-icon-weight="16"]:before{--db-icon-font-weight:16}@font-face{font-display:block;font-family:db-ux-filled;font-style:normal;font-weight:20;src:url(../../assets/icons/fonts/filled_20/db-ux.woff2) format("woff2")}[data-icon-weight-after="20"]:after,[data-icon-weight-before="20"]:before,[data-icon-weight="20"]:before{--db-icon-font-weight:20}@font-face{font-display:block;font-family:db-ux-filled;font-style:normal;font-weight:24;src:url(../../assets/icons/fonts/filled_24/db-ux.woff2) format("woff2")}[data-icon-weight-after="24"]:after,[data-icon-weight-before="24"]:before,[data-icon-weight="24"]:before{--db-icon-font-weight:24}@font-face{font-display:block;font-family:db-ux-filled;font-style:normal;font-weight:32;src:url(../../assets/icons/fonts/filled_32/db-ux.woff2) format("woff2")}[data-icon-weight-after="32"]:after,[data-icon-weight-before="32"]:before,[data-icon-weight="32"]:before{--db-icon-font-weight:32}@font-face{font-display:block;font-family:db-ux-filled;font-style:normal;font-weight:48;src:url(../../assets/icons/fonts/filled_48/db-ux.woff2) format("woff2")}[data-icon-weight-after="48"]:after,[data-icon-weight-before="48"]:before,[data-icon-weight="48"]:before{--db-icon-font-weight:48}@font-face{font-display:block;font-family:db-ux-filled;font-style:normal;font-weight:64;src:url(../../assets/icons/fonts/filled_64/db-ux.woff2) format("woff2")}[data-icon-weight-after="64"]:after,[data-icon-weight-before="64"]:before,[data-icon-weight="64"]:before{--db-icon-font-weight:64}
package/build/styles/icons/relative.scss CHANGED
@@ -34,17 +34,4 @@
34
34
  }
35
35
  }
36
36
  }
37
-
38
- [data-icon-variant="#{$variant}"],
39
- [data-icon-variant-before="#{$variant}"] {
40
- &::before {
41
- --db-icon-font-family: "db-ux-#{$variant}";
42
- }
43
- }
44
-
45
- [data-icon-variant-after="#{$variant}"] {
46
- &::after {
47
- --db-icon-font-family: "db-ux-#{$variant}";
48
- }
49
- }
50
37
  }
package/build/styles/icons/rollup.css CHANGED
@@ -1 +1 @@
1
- @font-face{font-display:block;font-family:db-ux-default;font-style:normal;font-weight:400;src:url(@db-ux/core-foundations/assets/icons/fonts/default/db-ux.woff2) format("woff2")}@font-face{font-display:block;font-family:db-ux-default;font-style:normal;font-weight:16;src:url(@db-ux/core-foundations/assets/icons/fonts/default_16/db-ux.woff2) format("woff2")}@font-face{font-display:block;font-family:db-ux-default;font-style:normal;font-weight:20;src:url(@db-ux/core-foundations/assets/icons/fonts/default_20/db-ux.woff2) format("woff2")}@font-face{font-display:block;font-family:db-ux-default;font-style:normal;font-weight:24;src:url(@db-ux/core-foundations/assets/icons/fonts/default_24/db-ux.woff2) format("woff2")}@font-face{font-display:block;font-family:db-ux-default;font-style:normal;font-weight:32;src:url(@db-ux/core-foundations/assets/icons/fonts/default_32/db-ux.woff2) format("woff2")}@font-face{font-display:block;font-family:db-ux-default;font-style:normal;font-weight:48;src:url(@db-ux/core-foundations/assets/icons/fonts/default_48/db-ux.woff2) format("woff2")}@font-face{font-display:block;font-family:db-ux-default;font-style:normal;font-weight:64;src:url(@db-ux/core-foundations/assets/icons/fonts/default_64/db-ux.woff2) format("woff2")}[data-icon-variant-after=default]:after,[data-icon-variant-before=default]:before,[data-icon-variant=default]:before{--db-icon-font-family:"db-ux-default"}@font-face{font-display:block;font-family:db-ux-filled;font-style:normal;font-weight:400;src:url(@db-ux/core-foundations/assets/icons/fonts/filled/db-ux.woff2) format("woff2")}@font-face{font-display:block;font-family:db-ux-filled;font-style:normal;font-weight:16;src:url(@db-ux/core-foundations/assets/icons/fonts/filled_16/db-ux.woff2) format("woff2")}[data-icon-weight-after="16"]:after,[data-icon-weight-before="16"]:before,[data-icon-weight="16"]:before{--db-icon-font-weight:16}@font-face{font-display:block;font-family:db-ux-filled;font-style:normal;font-weight:20;src:url(@db-ux/core-foundations/assets/icons/fonts/filled_20/db-ux.woff2) format("woff2")}[data-icon-weight-after="20"]:after,[data-icon-weight-before="20"]:before,[data-icon-weight="20"]:before{--db-icon-font-weight:20}@font-face{font-display:block;font-family:db-ux-filled;font-style:normal;font-weight:24;src:url(@db-ux/core-foundations/assets/icons/fonts/filled_24/db-ux.woff2) format("woff2")}[data-icon-weight-after="24"]:after,[data-icon-weight-before="24"]:before,[data-icon-weight="24"]:before{--db-icon-font-weight:24}@font-face{font-display:block;font-family:db-ux-filled;font-style:normal;font-weight:32;src:url(@db-ux/core-foundations/assets/icons/fonts/filled_32/db-ux.woff2) format("woff2")}[data-icon-weight-after="32"]:after,[data-icon-weight-before="32"]:before,[data-icon-weight="32"]:before{--db-icon-font-weight:32}@font-face{font-display:block;font-family:db-ux-filled;font-style:normal;font-weight:48;src:url(@db-ux/core-foundations/assets/icons/fonts/filled_48/db-ux.woff2) format("woff2")}[data-icon-weight-after="48"]:after,[data-icon-weight-before="48"]:before,[data-icon-weight="48"]:before{--db-icon-font-weight:48}@font-face{font-display:block;font-family:db-ux-filled;font-style:normal;font-weight:64;src:url(@db-ux/core-foundations/assets/icons/fonts/filled_64/db-ux.woff2) format("woff2")}[data-icon-weight-after="64"]:after,[data-icon-weight-before="64"]:before,[data-icon-weight="64"]:before{--db-icon-font-weight:64}[data-icon-variant-after=filled]:after,[data-icon-variant-before=filled]:before,[data-icon-variant=filled]:before{--db-icon-font-family:"db-ux-filled"}
1
+ @font-face{font-display:block;font-family:db-ux-default;font-style:normal;font-weight:400;src:url(@db-ux/core-foundations/assets/icons/fonts/default/db-ux.woff2) format("woff2")}@font-face{font-display:block;font-family:db-ux-default;font-style:normal;font-weight:16;src:url(@db-ux/core-foundations/assets/icons/fonts/default_16/db-ux.woff2) format("woff2")}@font-face{font-display:block;font-family:db-ux-default;font-style:normal;font-weight:20;src:url(@db-ux/core-foundations/assets/icons/fonts/default_20/db-ux.woff2) format("woff2")}@font-face{font-display:block;font-family:db-ux-default;font-style:normal;font-weight:24;src:url(@db-ux/core-foundations/assets/icons/fonts/default_24/db-ux.woff2) format("woff2")}@font-face{font-display:block;font-family:db-ux-default;font-style:normal;font-weight:32;src:url(@db-ux/core-foundations/assets/icons/fonts/default_32/db-ux.woff2) format("woff2")}@font-face{font-display:block;font-family:db-ux-default;font-style:normal;font-weight:48;src:url(@db-ux/core-foundations/assets/icons/fonts/default_48/db-ux.woff2) format("woff2")}@font-face{font-display:block;font-family:db-ux-default;font-style:normal;font-weight:64;src:url(@db-ux/core-foundations/assets/icons/fonts/default_64/db-ux.woff2) format("woff2")}@font-face{font-display:block;font-family:db-ux-filled;font-style:normal;font-weight:400;src:url(@db-ux/core-foundations/assets/icons/fonts/filled/db-ux.woff2) format("woff2")}@font-face{font-display:block;font-family:db-ux-filled;font-style:normal;font-weight:16;src:url(@db-ux/core-foundations/assets/icons/fonts/filled_16/db-ux.woff2) format("woff2")}[data-icon-weight-after="16"]:after,[data-icon-weight-before="16"]:before,[data-icon-weight="16"]:before{--db-icon-font-weight:16}@font-face{font-display:block;font-family:db-ux-filled;font-style:normal;font-weight:20;src:url(@db-ux/core-foundations/assets/icons/fonts/filled_20/db-ux.woff2) format("woff2")}[data-icon-weight-after="20"]:after,[data-icon-weight-before="20"]:before,[data-icon-weight="20"]:before{--db-icon-font-weight:20}@font-face{font-display:block;font-family:db-ux-filled;font-style:normal;font-weight:24;src:url(@db-ux/core-foundations/assets/icons/fonts/filled_24/db-ux.woff2) format("woff2")}[data-icon-weight-after="24"]:after,[data-icon-weight-before="24"]:before,[data-icon-weight="24"]:before{--db-icon-font-weight:24}@font-face{font-display:block;font-family:db-ux-filled;font-style:normal;font-weight:32;src:url(@db-ux/core-foundations/assets/icons/fonts/filled_32/db-ux.woff2) format("woff2")}[data-icon-weight-after="32"]:after,[data-icon-weight-before="32"]:before,[data-icon-weight="32"]:before{--db-icon-font-weight:32}@font-face{font-display:block;font-family:db-ux-filled;font-style:normal;font-weight:48;src:url(@db-ux/core-foundations/assets/icons/fonts/filled_48/db-ux.woff2) format("woff2")}[data-icon-weight-after="48"]:after,[data-icon-weight-before="48"]:before,[data-icon-weight="48"]:before{--db-icon-font-weight:48}@font-face{font-display:block;font-family:db-ux-filled;font-style:normal;font-weight:64;src:url(@db-ux/core-foundations/assets/icons/fonts/filled_64/db-ux.woff2) format("woff2")}[data-icon-weight-after="64"]:after,[data-icon-weight-before="64"]:before,[data-icon-weight="64"]:before{--db-icon-font-weight:64}
package/build/styles/icons/webpack.css CHANGED
@@ -1 +1 @@
1
- @font-face{font-display:block;font-family:db-ux-default;font-style:normal;font-weight:400;src:url(~@db-ux/core-foundations/assets/icons/fonts/default/db-ux.woff2) format("woff2")}@font-face{font-display:block;font-family:db-ux-default;font-style:normal;font-weight:16;src:url(~@db-ux/core-foundations/assets/icons/fonts/default_16/db-ux.woff2) format("woff2")}@font-face{font-display:block;font-family:db-ux-default;font-style:normal;font-weight:20;src:url(~@db-ux/core-foundations/assets/icons/fonts/default_20/db-ux.woff2) format("woff2")}@font-face{font-display:block;font-family:db-ux-default;font-style:normal;font-weight:24;src:url(~@db-ux/core-foundations/assets/icons/fonts/default_24/db-ux.woff2) format("woff2")}@font-face{font-display:block;font-family:db-ux-default;font-style:normal;font-weight:32;src:url(~@db-ux/core-foundations/assets/icons/fonts/default_32/db-ux.woff2) format("woff2")}@font-face{font-display:block;font-family:db-ux-default;font-style:normal;font-weight:48;src:url(~@db-ux/core-foundations/assets/icons/fonts/default_48/db-ux.woff2) format("woff2")}@font-face{font-display:block;font-family:db-ux-default;font-style:normal;font-weight:64;src:url(~@db-ux/core-foundations/assets/icons/fonts/default_64/db-ux.woff2) format("woff2")}[data-icon-variant-after=default]:after,[data-icon-variant-before=default]:before,[data-icon-variant=default]:before{--db-icon-font-family:"db-ux-default"}@font-face{font-display:block;font-family:db-ux-filled;font-style:normal;font-weight:400;src:url(~@db-ux/core-foundations/assets/icons/fonts/filled/db-ux.woff2) format("woff2")}@font-face{font-display:block;font-family:db-ux-filled;font-style:normal;font-weight:16;src:url(~@db-ux/core-foundations/assets/icons/fonts/filled_16/db-ux.woff2) format("woff2")}[data-icon-weight-after="16"]:after,[data-icon-weight-before="16"]:before,[data-icon-weight="16"]:before{--db-icon-font-weight:16}@font-face{font-display:block;font-family:db-ux-filled;font-style:normal;font-weight:20;src:url(~@db-ux/core-foundations/assets/icons/fonts/filled_20/db-ux.woff2) format("woff2")}[data-icon-weight-after="20"]:after,[data-icon-weight-before="20"]:before,[data-icon-weight="20"]:before{--db-icon-font-weight:20}@font-face{font-display:block;font-family:db-ux-filled;font-style:normal;font-weight:24;src:url(~@db-ux/core-foundations/assets/icons/fonts/filled_24/db-ux.woff2) format("woff2")}[data-icon-weight-after="24"]:after,[data-icon-weight-before="24"]:before,[data-icon-weight="24"]:before{--db-icon-font-weight:24}@font-face{font-display:block;font-family:db-ux-filled;font-style:normal;font-weight:32;src:url(~@db-ux/core-foundations/assets/icons/fonts/filled_32/db-ux.woff2) format("woff2")}[data-icon-weight-after="32"]:after,[data-icon-weight-before="32"]:before,[data-icon-weight="32"]:before{--db-icon-font-weight:32}@font-face{font-display:block;font-family:db-ux-filled;font-style:normal;font-weight:48;src:url(~@db-ux/core-foundations/assets/icons/fonts/filled_48/db-ux.woff2) format("woff2")}[data-icon-weight-after="48"]:after,[data-icon-weight-before="48"]:before,[data-icon-weight="48"]:before{--db-icon-font-weight:48}@font-face{font-display:block;font-family:db-ux-filled;font-style:normal;font-weight:64;src:url(~@db-ux/core-foundations/assets/icons/fonts/filled_64/db-ux.woff2) format("woff2")}[data-icon-weight-after="64"]:after,[data-icon-weight-before="64"]:before,[data-icon-weight="64"]:before{--db-icon-font-weight:64}[data-icon-variant-after=filled]:after,[data-icon-variant-before=filled]:before,[data-icon-variant=filled]:before{--db-icon-font-family:"db-ux-filled"}
1
+ @font-face{font-display:block;font-family:db-ux-default;font-style:normal;font-weight:400;src:url(~@db-ux/core-foundations/assets/icons/fonts/default/db-ux.woff2) format("woff2")}@font-face{font-display:block;font-family:db-ux-default;font-style:normal;font-weight:16;src:url(~@db-ux/core-foundations/assets/icons/fonts/default_16/db-ux.woff2) format("woff2")}@font-face{font-display:block;font-family:db-ux-default;font-style:normal;font-weight:20;src:url(~@db-ux/core-foundations/assets/icons/fonts/default_20/db-ux.woff2) format("woff2")}@font-face{font-display:block;font-family:db-ux-default;font-style:normal;font-weight:24;src:url(~@db-ux/core-foundations/assets/icons/fonts/default_24/db-ux.woff2) format("woff2")}@font-face{font-display:block;font-family:db-ux-default;font-style:normal;font-weight:32;src:url(~@db-ux/core-foundations/assets/icons/fonts/default_32/db-ux.woff2) format("woff2")}@font-face{font-display:block;font-family:db-ux-default;font-style:normal;font-weight:48;src:url(~@db-ux/core-foundations/assets/icons/fonts/default_48/db-ux.woff2) format("woff2")}@font-face{font-display:block;font-family:db-ux-default;font-style:normal;font-weight:64;src:url(~@db-ux/core-foundations/assets/icons/fonts/default_64/db-ux.woff2) format("woff2")}@font-face{font-display:block;font-family:db-ux-filled;font-style:normal;font-weight:400;src:url(~@db-ux/core-foundations/assets/icons/fonts/filled/db-ux.woff2) format("woff2")}@font-face{font-display:block;font-family:db-ux-filled;font-style:normal;font-weight:16;src:url(~@db-ux/core-foundations/assets/icons/fonts/filled_16/db-ux.woff2) format("woff2")}[data-icon-weight-after="16"]:after,[data-icon-weight-before="16"]:before,[data-icon-weight="16"]:before{--db-icon-font-weight:16}@font-face{font-display:block;font-family:db-ux-filled;font-style:normal;font-weight:20;src:url(~@db-ux/core-foundations/assets/icons/fonts/filled_20/db-ux.woff2) format("woff2")}[data-icon-weight-after="20"]:after,[data-icon-weight-before="20"]:before,[data-icon-weight="20"]:before{--db-icon-font-weight:20}@font-face{font-display:block;font-family:db-ux-filled;font-style:normal;font-weight:24;src:url(~@db-ux/core-foundations/assets/icons/fonts/filled_24/db-ux.woff2) format("woff2")}[data-icon-weight-after="24"]:after,[data-icon-weight-before="24"]:before,[data-icon-weight="24"]:before{--db-icon-font-weight:24}@font-face{font-display:block;font-family:db-ux-filled;font-style:normal;font-weight:32;src:url(~@db-ux/core-foundations/assets/icons/fonts/filled_32/db-ux.woff2) format("woff2")}[data-icon-weight-after="32"]:after,[data-icon-weight-before="32"]:before,[data-icon-weight="32"]:before{--db-icon-font-weight:32}@font-face{font-display:block;font-family:db-ux-filled;font-style:normal;font-weight:48;src:url(~@db-ux/core-foundations/assets/icons/fonts/filled_48/db-ux.woff2) format("woff2")}[data-icon-weight-after="48"]:after,[data-icon-weight-before="48"]:before,[data-icon-weight="48"]:before{--db-icon-font-weight:48}@font-face{font-display:block;font-family:db-ux-filled;font-style:normal;font-weight:64;src:url(~@db-ux/core-foundations/assets/icons/fonts/filled_64/db-ux.woff2) format("woff2")}[data-icon-weight-after="64"]:after,[data-icon-weight-before="64"]:before,[data-icon-weight="64"]:before{--db-icon-font-weight:64}