@db-ux/core-foundations 4.4.2 → 4.5.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.
- package/CHANGELOG.md +9 -1
- package/build/styles/_screen-sizes.scss +2 -4
- package/build/styles/_variables.scss +10 -10
- package/build/styles/absolute.css +113 -45
- package/build/styles/colors/_variables.additional-palette.scss +2 -2
- package/build/styles/colors/_variables.palette.scss +2 -2
- package/build/styles/defaults/default-code.css +1 -1
- package/build/styles/defaults/default-elevation.css +1 -1
- package/build/styles/defaults/default-required.scss +1 -1
- package/build/styles/density/classes/all.css +0 -22
- package/build/styles/density/classes/expressive.css +0 -22
- package/build/styles/density/classes/functional.css +0 -22
- package/build/styles/density/classes/regular.css +0 -22
- package/build/styles/fonts/_font-sizes.scss +4 -6
- package/build/styles/fonts/_variables.scss +2 -2
- package/build/styles/fonts/classes/all.css +0 -19
- package/build/styles/fonts/classes/body/2xl.css +0 -19
- package/build/styles/fonts/classes/body/2xs.css +0 -19
- package/build/styles/fonts/classes/body/3xl.css +0 -19
- package/build/styles/fonts/classes/body/3xs.css +0 -19
- package/build/styles/fonts/classes/body/all.css +0 -19
- package/build/styles/fonts/classes/body/lg.css +0 -19
- package/build/styles/fonts/classes/body/md.css +0 -19
- package/build/styles/fonts/classes/body/sm.css +0 -19
- package/build/styles/fonts/classes/body/xl.css +0 -19
- package/build/styles/fonts/classes/body/xs.css +0 -19
- package/build/styles/fonts/classes/headline/2xl.css +0 -19
- package/build/styles/fonts/classes/headline/2xs.css +0 -19
- package/build/styles/fonts/classes/headline/3xl.css +0 -19
- package/build/styles/fonts/classes/headline/3xs.css +0 -19
- package/build/styles/fonts/classes/headline/all.css +0 -19
- package/build/styles/fonts/classes/headline/lg.css +0 -19
- package/build/styles/fonts/classes/headline/md.css +0 -19
- package/build/styles/fonts/classes/headline/sm.css +0 -19
- package/build/styles/fonts/classes/headline/xl.css +0 -19
- package/build/styles/fonts/classes/headline/xs.css +0 -19
- package/build/styles/helpers/_a11y.scss +1 -1
- package/build/styles/helpers/_functions.scss +12 -2
- package/build/styles/helpers/classes/all.css +0 -10
- package/build/styles/helpers/classes/divider.css +0 -10
- package/build/styles/helpers/classes/focus.css +0 -10
- package/build/styles/icons/_icon-helpers.scss +1 -0
- package/build/styles/index.css +113 -45
- package/build/styles/relative.css +113 -45
- package/build/styles/rollup.css +113 -45
- package/build/styles/webpack.css +113 -45
- package/package.json +3 -3
|
@@ -1,13 +1,3 @@
|
|
|
1
|
-
/* Use sizing's for fixed heights/widths e.g. the db-button has always a fixed height */
|
|
2
|
-
/* Use fixed spacings for all kind of distances (margin, padding, ...) */
|
|
3
|
-
/* The primary use-case for responsive spacings are
|
|
4
|
-
paddings/gaps in an application e.g. the <main> should have a responsive padding. */
|
|
5
|
-
/* Elevation */
|
|
6
|
-
/* Border */
|
|
7
|
-
/* Opacity */
|
|
8
|
-
/* Transitions */
|
|
9
|
-
/* Screen sizes */
|
|
10
|
-
/* Container sizes */
|
|
11
1
|
/* Variants for adaptive components like input, select, notification, ... */
|
|
12
2
|
@layer variables {}
|
|
13
3
|
|
|
@@ -43,12 +33,6 @@ paddings/gaps in an application e.g. the <main> should have a responsive padding
|
|
|
43
33
|
|
|
44
34
|
@layer variables {}
|
|
45
35
|
|
|
46
|
-
/**
|
|
47
|
-
Generates 3 types of placeholders, e.g:
|
|
48
|
-
- %db-component-variables-md
|
|
49
|
-
- %db-font-size-md
|
|
50
|
-
- %db-overwrite-font-size-md
|
|
51
|
-
*/
|
|
52
36
|
@layer variables {}
|
|
53
37
|
|
|
54
38
|
@layer variables {}
|
|
@@ -114,6 +98,3 @@ paddings/gaps in an application e.g. the <main> should have a responsive padding
|
|
|
114
98
|
@layer variables {}
|
|
115
99
|
|
|
116
100
|
@layer variables {}
|
|
117
|
-
|
|
118
|
-
/* Use for body tags like <p> */
|
|
119
|
-
/* Use for headline tags like <h1> */
|
|
@@ -1,13 +1,3 @@
|
|
|
1
|
-
/* Use sizing's for fixed heights/widths e.g. the db-button has always a fixed height */
|
|
2
|
-
/* Use fixed spacings for all kind of distances (margin, padding, ...) */
|
|
3
|
-
/* The primary use-case for responsive spacings are
|
|
4
|
-
paddings/gaps in an application e.g. the <main> should have a responsive padding. */
|
|
5
|
-
/* Elevation */
|
|
6
|
-
/* Border */
|
|
7
|
-
/* Opacity */
|
|
8
|
-
/* Transitions */
|
|
9
|
-
/* Screen sizes */
|
|
10
|
-
/* Container sizes */
|
|
11
1
|
/* Variants for adaptive components like input, select, notification, ... */
|
|
12
2
|
@layer variables {}
|
|
13
3
|
|
|
@@ -43,12 +33,6 @@ paddings/gaps in an application e.g. the <main> should have a responsive padding
|
|
|
43
33
|
|
|
44
34
|
@layer variables {}
|
|
45
35
|
|
|
46
|
-
/**
|
|
47
|
-
Generates 3 types of placeholders, e.g:
|
|
48
|
-
- %db-component-variables-md
|
|
49
|
-
- %db-font-size-md
|
|
50
|
-
- %db-overwrite-font-size-md
|
|
51
|
-
*/
|
|
52
36
|
@layer variables {}
|
|
53
37
|
|
|
54
38
|
.db-font-size-3xl,
|
|
@@ -114,6 +98,3 @@ paddings/gaps in an application e.g. the <main> should have a responsive padding
|
|
|
114
98
|
@layer variables {}
|
|
115
99
|
|
|
116
100
|
@layer variables {}
|
|
117
|
-
|
|
118
|
-
/* Use for body tags like <p> */
|
|
119
|
-
/* Use for headline tags like <h1> */
|
|
@@ -1,13 +1,3 @@
|
|
|
1
|
-
/* Use sizing's for fixed heights/widths e.g. the db-button has always a fixed height */
|
|
2
|
-
/* Use fixed spacings for all kind of distances (margin, padding, ...) */
|
|
3
|
-
/* The primary use-case for responsive spacings are
|
|
4
|
-
paddings/gaps in an application e.g. the <main> should have a responsive padding. */
|
|
5
|
-
/* Elevation */
|
|
6
|
-
/* Border */
|
|
7
|
-
/* Opacity */
|
|
8
|
-
/* Transitions */
|
|
9
|
-
/* Screen sizes */
|
|
10
|
-
/* Container sizes */
|
|
11
1
|
/* Variants for adaptive components like input, select, notification, ... */
|
|
12
2
|
@layer variables {}
|
|
13
3
|
|
|
@@ -43,12 +33,6 @@ paddings/gaps in an application e.g. the <main> should have a responsive padding
|
|
|
43
33
|
|
|
44
34
|
@layer variables {}
|
|
45
35
|
|
|
46
|
-
/**
|
|
47
|
-
Generates 3 types of placeholders, e.g:
|
|
48
|
-
- %db-component-variables-md
|
|
49
|
-
- %db-font-size-md
|
|
50
|
-
- %db-overwrite-font-size-md
|
|
51
|
-
*/
|
|
52
36
|
@layer variables {}
|
|
53
37
|
|
|
54
38
|
@layer variables {}
|
|
@@ -114,6 +98,3 @@ paddings/gaps in an application e.g. the <main> should have a responsive padding
|
|
|
114
98
|
}
|
|
115
99
|
|
|
116
100
|
@layer variables {}
|
|
117
|
-
|
|
118
|
-
/* Use for body tags like <p> */
|
|
119
|
-
/* Use for headline tags like <h1> */
|
|
@@ -1,13 +1,3 @@
|
|
|
1
|
-
/* Use sizing's for fixed heights/widths e.g. the db-button has always a fixed height */
|
|
2
|
-
/* Use fixed spacings for all kind of distances (margin, padding, ...) */
|
|
3
|
-
/* The primary use-case for responsive spacings are
|
|
4
|
-
paddings/gaps in an application e.g. the <main> should have a responsive padding. */
|
|
5
|
-
/* Elevation */
|
|
6
|
-
/* Border */
|
|
7
|
-
/* Opacity */
|
|
8
|
-
/* Transitions */
|
|
9
|
-
/* Screen sizes */
|
|
10
|
-
/* Container sizes */
|
|
11
1
|
/* Variants for adaptive components like input, select, notification, ... */
|
|
12
2
|
@layer variables {}
|
|
13
3
|
|
|
@@ -43,12 +33,6 @@ paddings/gaps in an application e.g. the <main> should have a responsive padding
|
|
|
43
33
|
|
|
44
34
|
@layer variables {}
|
|
45
35
|
|
|
46
|
-
/**
|
|
47
|
-
Generates 3 types of placeholders, e.g:
|
|
48
|
-
- %db-component-variables-md
|
|
49
|
-
- %db-font-size-md
|
|
50
|
-
- %db-overwrite-font-size-md
|
|
51
|
-
*/
|
|
52
36
|
@layer variables {}
|
|
53
37
|
|
|
54
38
|
.db-font-size-3xl,
|
|
@@ -210,6 +194,3 @@ paddings/gaps in an application e.g. the <main> should have a responsive padding
|
|
|
210
194
|
}
|
|
211
195
|
|
|
212
196
|
@layer variables {}
|
|
213
|
-
|
|
214
|
-
/* Use for body tags like <p> */
|
|
215
|
-
/* Use for headline tags like <h1> */
|
|
@@ -1,13 +1,3 @@
|
|
|
1
|
-
/* Use sizing's for fixed heights/widths e.g. the db-button has always a fixed height */
|
|
2
|
-
/* Use fixed spacings for all kind of distances (margin, padding, ...) */
|
|
3
|
-
/* The primary use-case for responsive spacings are
|
|
4
|
-
paddings/gaps in an application e.g. the <main> should have a responsive padding. */
|
|
5
|
-
/* Elevation */
|
|
6
|
-
/* Border */
|
|
7
|
-
/* Opacity */
|
|
8
|
-
/* Transitions */
|
|
9
|
-
/* Screen sizes */
|
|
10
|
-
/* Container sizes */
|
|
11
1
|
/* Variants for adaptive components like input, select, notification, ... */
|
|
12
2
|
@layer variables {}
|
|
13
3
|
|
|
@@ -43,12 +33,6 @@ paddings/gaps in an application e.g. the <main> should have a responsive padding
|
|
|
43
33
|
|
|
44
34
|
@layer variables {}
|
|
45
35
|
|
|
46
|
-
/**
|
|
47
|
-
Generates 3 types of placeholders, e.g:
|
|
48
|
-
- %db-component-variables-md
|
|
49
|
-
- %db-font-size-md
|
|
50
|
-
- %db-overwrite-font-size-md
|
|
51
|
-
*/
|
|
52
36
|
@layer variables {}
|
|
53
37
|
|
|
54
38
|
@layer variables {}
|
|
@@ -114,6 +98,3 @@ paddings/gaps in an application e.g. the <main> should have a responsive padding
|
|
|
114
98
|
@layer variables {}
|
|
115
99
|
|
|
116
100
|
@layer variables {}
|
|
117
|
-
|
|
118
|
-
/* Use for body tags like <p> */
|
|
119
|
-
/* Use for headline tags like <h1> */
|
|
@@ -1,13 +1,3 @@
|
|
|
1
|
-
/* Use sizing's for fixed heights/widths e.g. the db-button has always a fixed height */
|
|
2
|
-
/* Use fixed spacings for all kind of distances (margin, padding, ...) */
|
|
3
|
-
/* The primary use-case for responsive spacings are
|
|
4
|
-
paddings/gaps in an application e.g. the <main> should have a responsive padding. */
|
|
5
|
-
/* Elevation */
|
|
6
|
-
/* Border */
|
|
7
|
-
/* Opacity */
|
|
8
|
-
/* Transitions */
|
|
9
|
-
/* Screen sizes */
|
|
10
|
-
/* Container sizes */
|
|
11
1
|
/* Variants for adaptive components like input, select, notification, ... */
|
|
12
2
|
@layer variables {}
|
|
13
3
|
|
|
@@ -43,12 +33,6 @@ paddings/gaps in an application e.g. the <main> should have a responsive padding
|
|
|
43
33
|
|
|
44
34
|
@layer variables {}
|
|
45
35
|
|
|
46
|
-
/**
|
|
47
|
-
Generates 3 types of placeholders, e.g:
|
|
48
|
-
- %db-component-variables-md
|
|
49
|
-
- %db-font-size-md
|
|
50
|
-
- %db-overwrite-font-size-md
|
|
51
|
-
*/
|
|
52
36
|
@layer variables {}
|
|
53
37
|
|
|
54
38
|
@layer variables {}
|
|
@@ -114,6 +98,3 @@ paddings/gaps in an application e.g. the <main> should have a responsive padding
|
|
|
114
98
|
@layer variables {}
|
|
115
99
|
|
|
116
100
|
@layer variables {}
|
|
117
|
-
|
|
118
|
-
/* Use for body tags like <p> */
|
|
119
|
-
/* Use for headline tags like <h1> */
|
|
@@ -1,13 +1,3 @@
|
|
|
1
|
-
/* Use sizing's for fixed heights/widths e.g. the db-button has always a fixed height */
|
|
2
|
-
/* Use fixed spacings for all kind of distances (margin, padding, ...) */
|
|
3
|
-
/* The primary use-case for responsive spacings are
|
|
4
|
-
paddings/gaps in an application e.g. the <main> should have a responsive padding. */
|
|
5
|
-
/* Elevation */
|
|
6
|
-
/* Border */
|
|
7
|
-
/* Opacity */
|
|
8
|
-
/* Transitions */
|
|
9
|
-
/* Screen sizes */
|
|
10
|
-
/* Container sizes */
|
|
11
1
|
/* Variants for adaptive components like input, select, notification, ... */
|
|
12
2
|
@layer variables {}
|
|
13
3
|
|
|
@@ -43,12 +33,6 @@ paddings/gaps in an application e.g. the <main> should have a responsive padding
|
|
|
43
33
|
|
|
44
34
|
@layer variables {}
|
|
45
35
|
|
|
46
|
-
/**
|
|
47
|
-
Generates 3 types of placeholders, e.g:
|
|
48
|
-
- %db-component-variables-md
|
|
49
|
-
- %db-font-size-md
|
|
50
|
-
- %db-overwrite-font-size-md
|
|
51
|
-
*/
|
|
52
36
|
@layer variables {}
|
|
53
37
|
|
|
54
38
|
@layer variables {}
|
|
@@ -114,6 +98,3 @@ paddings/gaps in an application e.g. the <main> should have a responsive padding
|
|
|
114
98
|
@layer variables {}
|
|
115
99
|
|
|
116
100
|
@layer variables {}
|
|
117
|
-
|
|
118
|
-
/* Use for body tags like <p> */
|
|
119
|
-
/* Use for headline tags like <h1> */
|
|
@@ -1,13 +1,3 @@
|
|
|
1
|
-
/* Use sizing's for fixed heights/widths e.g. the db-button has always a fixed height */
|
|
2
|
-
/* Use fixed spacings for all kind of distances (margin, padding, ...) */
|
|
3
|
-
/* The primary use-case for responsive spacings are
|
|
4
|
-
paddings/gaps in an application e.g. the <main> should have a responsive padding. */
|
|
5
|
-
/* Elevation */
|
|
6
|
-
/* Border */
|
|
7
|
-
/* Opacity */
|
|
8
|
-
/* Transitions */
|
|
9
|
-
/* Screen sizes */
|
|
10
|
-
/* Container sizes */
|
|
11
1
|
/* Variants for adaptive components like input, select, notification, ... */
|
|
12
2
|
@layer variables {}
|
|
13
3
|
|
|
@@ -43,12 +33,6 @@ paddings/gaps in an application e.g. the <main> should have a responsive padding
|
|
|
43
33
|
|
|
44
34
|
@layer variables {}
|
|
45
35
|
|
|
46
|
-
/**
|
|
47
|
-
Generates 3 types of placeholders, e.g:
|
|
48
|
-
- %db-component-variables-md
|
|
49
|
-
- %db-font-size-md
|
|
50
|
-
- %db-overwrite-font-size-md
|
|
51
|
-
*/
|
|
52
36
|
@layer variables {}
|
|
53
37
|
|
|
54
38
|
@layer variables {}
|
|
@@ -114,6 +98,3 @@ paddings/gaps in an application e.g. the <main> should have a responsive padding
|
|
|
114
98
|
@layer variables {}
|
|
115
99
|
|
|
116
100
|
@layer variables {}
|
|
117
|
-
|
|
118
|
-
/* Use for body tags like <p> */
|
|
119
|
-
/* Use for headline tags like <h1> */
|
|
@@ -1,13 +1,3 @@
|
|
|
1
|
-
/* Use sizing's for fixed heights/widths e.g. the db-button has always a fixed height */
|
|
2
|
-
/* Use fixed spacings for all kind of distances (margin, padding, ...) */
|
|
3
|
-
/* The primary use-case for responsive spacings are
|
|
4
|
-
paddings/gaps in an application e.g. the <main> should have a responsive padding. */
|
|
5
|
-
/* Elevation */
|
|
6
|
-
/* Border */
|
|
7
|
-
/* Opacity */
|
|
8
|
-
/* Transitions */
|
|
9
|
-
/* Screen sizes */
|
|
10
|
-
/* Container sizes */
|
|
11
1
|
/* Variants for adaptive components like input, select, notification, ... */
|
|
12
2
|
@layer variables {}
|
|
13
3
|
|
|
@@ -43,12 +33,6 @@ paddings/gaps in an application e.g. the <main> should have a responsive padding
|
|
|
43
33
|
|
|
44
34
|
@layer variables {}
|
|
45
35
|
|
|
46
|
-
/**
|
|
47
|
-
Generates 3 types of placeholders, e.g:
|
|
48
|
-
- %db-component-variables-md
|
|
49
|
-
- %db-font-size-md
|
|
50
|
-
- %db-overwrite-font-size-md
|
|
51
|
-
*/
|
|
52
36
|
@layer variables {}
|
|
53
37
|
|
|
54
38
|
@layer variables {}
|
|
@@ -114,6 +98,3 @@ paddings/gaps in an application e.g. the <main> should have a responsive padding
|
|
|
114
98
|
@layer variables {}
|
|
115
99
|
|
|
116
100
|
@layer variables {}
|
|
117
|
-
|
|
118
|
-
/* Use for body tags like <p> */
|
|
119
|
-
/* Use for headline tags like <h1> */
|
|
@@ -1,13 +1,3 @@
|
|
|
1
|
-
/* Use sizing's for fixed heights/widths e.g. the db-button has always a fixed height */
|
|
2
|
-
/* Use fixed spacings for all kind of distances (margin, padding, ...) */
|
|
3
|
-
/* The primary use-case for responsive spacings are
|
|
4
|
-
paddings/gaps in an application e.g. the <main> should have a responsive padding. */
|
|
5
|
-
/* Elevation */
|
|
6
|
-
/* Border */
|
|
7
|
-
/* Opacity */
|
|
8
|
-
/* Transitions */
|
|
9
|
-
/* Screen sizes */
|
|
10
|
-
/* Container sizes */
|
|
11
1
|
/* Variants for adaptive components like input, select, notification, ... */
|
|
12
2
|
@layer variables {}
|
|
13
3
|
|
|
@@ -43,12 +33,6 @@ paddings/gaps in an application e.g. the <main> should have a responsive padding
|
|
|
43
33
|
|
|
44
34
|
@layer variables {}
|
|
45
35
|
|
|
46
|
-
/**
|
|
47
|
-
Generates 3 types of placeholders, e.g:
|
|
48
|
-
- %db-component-variables-md
|
|
49
|
-
- %db-font-size-md
|
|
50
|
-
- %db-overwrite-font-size-md
|
|
51
|
-
*/
|
|
52
36
|
@layer variables {}
|
|
53
37
|
|
|
54
38
|
@layer variables {}
|
|
@@ -114,6 +98,3 @@ paddings/gaps in an application e.g. the <main> should have a responsive padding
|
|
|
114
98
|
@layer variables {}
|
|
115
99
|
|
|
116
100
|
@layer variables {}
|
|
117
|
-
|
|
118
|
-
/* Use for body tags like <p> */
|
|
119
|
-
/* Use for headline tags like <h1> */
|
|
@@ -1,13 +1,3 @@
|
|
|
1
|
-
/* Use sizing's for fixed heights/widths e.g. the db-button has always a fixed height */
|
|
2
|
-
/* Use fixed spacings for all kind of distances (margin, padding, ...) */
|
|
3
|
-
/* The primary use-case for responsive spacings are
|
|
4
|
-
paddings/gaps in an application e.g. the <main> should have a responsive padding. */
|
|
5
|
-
/* Elevation */
|
|
6
|
-
/* Border */
|
|
7
|
-
/* Opacity */
|
|
8
|
-
/* Transitions */
|
|
9
|
-
/* Screen sizes */
|
|
10
|
-
/* Container sizes */
|
|
11
1
|
/* Variants for adaptive components like input, select, notification, ... */
|
|
12
2
|
@layer variables {}
|
|
13
3
|
|
|
@@ -43,12 +33,6 @@ paddings/gaps in an application e.g. the <main> should have a responsive padding
|
|
|
43
33
|
|
|
44
34
|
@layer variables {}
|
|
45
35
|
|
|
46
|
-
/**
|
|
47
|
-
Generates 3 types of placeholders, e.g:
|
|
48
|
-
- %db-component-variables-md
|
|
49
|
-
- %db-font-size-md
|
|
50
|
-
- %db-overwrite-font-size-md
|
|
51
|
-
*/
|
|
52
36
|
@layer variables {}
|
|
53
37
|
|
|
54
38
|
@layer variables {}
|
|
@@ -114,6 +98,3 @@ paddings/gaps in an application e.g. the <main> should have a responsive padding
|
|
|
114
98
|
@layer variables {}
|
|
115
99
|
|
|
116
100
|
@layer variables {}
|
|
117
|
-
|
|
118
|
-
/* Use for body tags like <p> */
|
|
119
|
-
/* Use for headline tags like <h1> */
|
|
@@ -1,13 +1,3 @@
|
|
|
1
|
-
/* Use sizing's for fixed heights/widths e.g. the db-button has always a fixed height */
|
|
2
|
-
/* Use fixed spacings for all kind of distances (margin, padding, ...) */
|
|
3
|
-
/* The primary use-case for responsive spacings are
|
|
4
|
-
paddings/gaps in an application e.g. the <main> should have a responsive padding. */
|
|
5
|
-
/* Elevation */
|
|
6
|
-
/* Border */
|
|
7
|
-
/* Opacity */
|
|
8
|
-
/* Transitions */
|
|
9
|
-
/* Screen sizes */
|
|
10
|
-
/* Container sizes */
|
|
11
1
|
/* Variants for adaptive components like input, select, notification, ... */
|
|
12
2
|
@layer variables {}
|
|
13
3
|
|
|
@@ -43,12 +33,6 @@ paddings/gaps in an application e.g. the <main> should have a responsive padding
|
|
|
43
33
|
|
|
44
34
|
@layer variables {}
|
|
45
35
|
|
|
46
|
-
/**
|
|
47
|
-
Generates 3 types of placeholders, e.g:
|
|
48
|
-
- %db-component-variables-md
|
|
49
|
-
- %db-font-size-md
|
|
50
|
-
- %db-overwrite-font-size-md
|
|
51
|
-
*/
|
|
52
36
|
@layer variables {}
|
|
53
37
|
|
|
54
38
|
@layer variables {}
|
|
@@ -114,6 +98,3 @@ paddings/gaps in an application e.g. the <main> should have a responsive padding
|
|
|
114
98
|
@layer variables {}
|
|
115
99
|
|
|
116
100
|
@layer variables {}
|
|
117
|
-
|
|
118
|
-
/* Use for body tags like <p> */
|
|
119
|
-
/* Use for headline tags like <h1> */
|
|
@@ -1,13 +1,3 @@
|
|
|
1
|
-
/* Use sizing's for fixed heights/widths e.g. the db-button has always a fixed height */
|
|
2
|
-
/* Use fixed spacings for all kind of distances (margin, padding, ...) */
|
|
3
|
-
/* The primary use-case for responsive spacings are
|
|
4
|
-
paddings/gaps in an application e.g. the <main> should have a responsive padding. */
|
|
5
|
-
/* Elevation */
|
|
6
|
-
/* Border */
|
|
7
|
-
/* Opacity */
|
|
8
|
-
/* Transitions */
|
|
9
|
-
/* Screen sizes */
|
|
10
|
-
/* Container sizes */
|
|
11
1
|
/* Variants for adaptive components like input, select, notification, ... */
|
|
12
2
|
@layer variables {}
|
|
13
3
|
|
|
@@ -43,12 +33,6 @@ paddings/gaps in an application e.g. the <main> should have a responsive padding
|
|
|
43
33
|
|
|
44
34
|
@layer variables {}
|
|
45
35
|
|
|
46
|
-
/**
|
|
47
|
-
Generates 3 types of placeholders, e.g:
|
|
48
|
-
- %db-component-variables-md
|
|
49
|
-
- %db-font-size-md
|
|
50
|
-
- %db-overwrite-font-size-md
|
|
51
|
-
*/
|
|
52
36
|
@layer variables {}
|
|
53
37
|
|
|
54
38
|
@layer variables {}
|
|
@@ -114,6 +98,3 @@ paddings/gaps in an application e.g. the <main> should have a responsive padding
|
|
|
114
98
|
--db-icon-font-size: var(--db-base-headline-icon-font-size-3xs);
|
|
115
99
|
}
|
|
116
100
|
}
|
|
117
|
-
|
|
118
|
-
/* Use for body tags like <p> */
|
|
119
|
-
/* Use for headline tags like <h1> */
|
|
@@ -1,13 +1,3 @@
|
|
|
1
|
-
/* Use sizing's for fixed heights/widths e.g. the db-button has always a fixed height */
|
|
2
|
-
/* Use fixed spacings for all kind of distances (margin, padding, ...) */
|
|
3
|
-
/* The primary use-case for responsive spacings are
|
|
4
|
-
paddings/gaps in an application e.g. the <main> should have a responsive padding. */
|
|
5
|
-
/* Elevation */
|
|
6
|
-
/* Border */
|
|
7
|
-
/* Opacity */
|
|
8
|
-
/* Transitions */
|
|
9
|
-
/* Screen sizes */
|
|
10
|
-
/* Container sizes */
|
|
11
1
|
/* Variants for adaptive components like input, select, notification, ... */
|
|
12
2
|
@layer variables {}
|
|
13
3
|
|
|
@@ -43,12 +33,6 @@ paddings/gaps in an application e.g. the <main> should have a responsive padding
|
|
|
43
33
|
|
|
44
34
|
@layer variables {}
|
|
45
35
|
|
|
46
|
-
/**
|
|
47
|
-
Generates 3 types of placeholders, e.g:
|
|
48
|
-
- %db-component-variables-md
|
|
49
|
-
- %db-font-size-md
|
|
50
|
-
- %db-overwrite-font-size-md
|
|
51
|
-
*/
|
|
52
36
|
@layer variables {}
|
|
53
37
|
|
|
54
38
|
@layer variables {}
|
|
@@ -210,6 +194,3 @@ paddings/gaps in an application e.g. the <main> should have a responsive padding
|
|
|
210
194
|
--db-icon-font-size: var(--db-base-headline-icon-font-size-3xs);
|
|
211
195
|
}
|
|
212
196
|
}
|
|
213
|
-
|
|
214
|
-
/* Use for body tags like <p> */
|
|
215
|
-
/* Use for headline tags like <h1> */
|
|
@@ -1,13 +1,3 @@
|
|
|
1
|
-
/* Use sizing's for fixed heights/widths e.g. the db-button has always a fixed height */
|
|
2
|
-
/* Use fixed spacings for all kind of distances (margin, padding, ...) */
|
|
3
|
-
/* The primary use-case for responsive spacings are
|
|
4
|
-
paddings/gaps in an application e.g. the <main> should have a responsive padding. */
|
|
5
|
-
/* Elevation */
|
|
6
|
-
/* Border */
|
|
7
|
-
/* Opacity */
|
|
8
|
-
/* Transitions */
|
|
9
|
-
/* Screen sizes */
|
|
10
|
-
/* Container sizes */
|
|
11
1
|
/* Variants for adaptive components like input, select, notification, ... */
|
|
12
2
|
@layer variables {}
|
|
13
3
|
|
|
@@ -43,12 +33,6 @@ paddings/gaps in an application e.g. the <main> should have a responsive padding
|
|
|
43
33
|
|
|
44
34
|
@layer variables {}
|
|
45
35
|
|
|
46
|
-
/**
|
|
47
|
-
Generates 3 types of placeholders, e.g:
|
|
48
|
-
- %db-component-variables-md
|
|
49
|
-
- %db-font-size-md
|
|
50
|
-
- %db-overwrite-font-size-md
|
|
51
|
-
*/
|
|
52
36
|
@layer variables {}
|
|
53
37
|
|
|
54
38
|
@layer variables {}
|
|
@@ -114,6 +98,3 @@ paddings/gaps in an application e.g. the <main> should have a responsive padding
|
|
|
114
98
|
@layer variables {}
|
|
115
99
|
|
|
116
100
|
@layer variables {}
|
|
117
|
-
|
|
118
|
-
/* Use for body tags like <p> */
|
|
119
|
-
/* Use for headline tags like <h1> */
|
|
@@ -1,13 +1,3 @@
|
|
|
1
|
-
/* Use sizing's for fixed heights/widths e.g. the db-button has always a fixed height */
|
|
2
|
-
/* Use fixed spacings for all kind of distances (margin, padding, ...) */
|
|
3
|
-
/* The primary use-case for responsive spacings are
|
|
4
|
-
paddings/gaps in an application e.g. the <main> should have a responsive padding. */
|
|
5
|
-
/* Elevation */
|
|
6
|
-
/* Border */
|
|
7
|
-
/* Opacity */
|
|
8
|
-
/* Transitions */
|
|
9
|
-
/* Screen sizes */
|
|
10
|
-
/* Container sizes */
|
|
11
1
|
/* Variants for adaptive components like input, select, notification, ... */
|
|
12
2
|
@layer variables {}
|
|
13
3
|
|
|
@@ -43,12 +33,6 @@ paddings/gaps in an application e.g. the <main> should have a responsive padding
|
|
|
43
33
|
|
|
44
34
|
@layer variables {}
|
|
45
35
|
|
|
46
|
-
/**
|
|
47
|
-
Generates 3 types of placeholders, e.g:
|
|
48
|
-
- %db-component-variables-md
|
|
49
|
-
- %db-font-size-md
|
|
50
|
-
- %db-overwrite-font-size-md
|
|
51
|
-
*/
|
|
52
36
|
@layer variables {}
|
|
53
37
|
|
|
54
38
|
@layer variables {}
|
|
@@ -114,6 +98,3 @@ paddings/gaps in an application e.g. the <main> should have a responsive padding
|
|
|
114
98
|
@layer variables {}
|
|
115
99
|
|
|
116
100
|
@layer variables {}
|
|
117
|
-
|
|
118
|
-
/* Use for body tags like <p> */
|
|
119
|
-
/* Use for headline tags like <h1> */
|
|
@@ -1,13 +1,3 @@
|
|
|
1
|
-
/* Use sizing's for fixed heights/widths e.g. the db-button has always a fixed height */
|
|
2
|
-
/* Use fixed spacings for all kind of distances (margin, padding, ...) */
|
|
3
|
-
/* The primary use-case for responsive spacings are
|
|
4
|
-
paddings/gaps in an application e.g. the <main> should have a responsive padding. */
|
|
5
|
-
/* Elevation */
|
|
6
|
-
/* Border */
|
|
7
|
-
/* Opacity */
|
|
8
|
-
/* Transitions */
|
|
9
|
-
/* Screen sizes */
|
|
10
|
-
/* Container sizes */
|
|
11
1
|
/* Variants for adaptive components like input, select, notification, ... */
|
|
12
2
|
@layer variables {}
|
|
13
3
|
|
|
@@ -43,12 +33,6 @@ paddings/gaps in an application e.g. the <main> should have a responsive padding
|
|
|
43
33
|
|
|
44
34
|
@layer variables {}
|
|
45
35
|
|
|
46
|
-
/**
|
|
47
|
-
Generates 3 types of placeholders, e.g:
|
|
48
|
-
- %db-component-variables-md
|
|
49
|
-
- %db-font-size-md
|
|
50
|
-
- %db-overwrite-font-size-md
|
|
51
|
-
*/
|
|
52
36
|
@layer variables {}
|
|
53
37
|
|
|
54
38
|
@layer variables {}
|
|
@@ -114,6 +98,3 @@ paddings/gaps in an application e.g. the <main> should have a responsive padding
|
|
|
114
98
|
@layer variables {}
|
|
115
99
|
|
|
116
100
|
@layer variables {}
|
|
117
|
-
|
|
118
|
-
/* Use for body tags like <p> */
|
|
119
|
-
/* Use for headline tags like <h1> */
|
|
@@ -1,13 +1,3 @@
|
|
|
1
|
-
/* Use sizing's for fixed heights/widths e.g. the db-button has always a fixed height */
|
|
2
|
-
/* Use fixed spacings for all kind of distances (margin, padding, ...) */
|
|
3
|
-
/* The primary use-case for responsive spacings are
|
|
4
|
-
paddings/gaps in an application e.g. the <main> should have a responsive padding. */
|
|
5
|
-
/* Elevation */
|
|
6
|
-
/* Border */
|
|
7
|
-
/* Opacity */
|
|
8
|
-
/* Transitions */
|
|
9
|
-
/* Screen sizes */
|
|
10
|
-
/* Container sizes */
|
|
11
1
|
/* Variants for adaptive components like input, select, notification, ... */
|
|
12
2
|
@layer variables {}
|
|
13
3
|
|
|
@@ -43,12 +33,6 @@ paddings/gaps in an application e.g. the <main> should have a responsive padding
|
|
|
43
33
|
|
|
44
34
|
@layer variables {}
|
|
45
35
|
|
|
46
|
-
/**
|
|
47
|
-
Generates 3 types of placeholders, e.g:
|
|
48
|
-
- %db-component-variables-md
|
|
49
|
-
- %db-font-size-md
|
|
50
|
-
- %db-overwrite-font-size-md
|
|
51
|
-
*/
|
|
52
36
|
@layer variables {}
|
|
53
37
|
|
|
54
38
|
@layer variables {}
|
|
@@ -114,6 +98,3 @@ paddings/gaps in an application e.g. the <main> should have a responsive padding
|
|
|
114
98
|
@layer variables {}
|
|
115
99
|
|
|
116
100
|
@layer variables {}
|
|
117
|
-
|
|
118
|
-
/* Use for body tags like <p> */
|
|
119
|
-
/* Use for headline tags like <h1> */
|
|
@@ -1,13 +1,3 @@
|
|
|
1
|
-
/* Use sizing's for fixed heights/widths e.g. the db-button has always a fixed height */
|
|
2
|
-
/* Use fixed spacings for all kind of distances (margin, padding, ...) */
|
|
3
|
-
/* The primary use-case for responsive spacings are
|
|
4
|
-
paddings/gaps in an application e.g. the <main> should have a responsive padding. */
|
|
5
|
-
/* Elevation */
|
|
6
|
-
/* Border */
|
|
7
|
-
/* Opacity */
|
|
8
|
-
/* Transitions */
|
|
9
|
-
/* Screen sizes */
|
|
10
|
-
/* Container sizes */
|
|
11
1
|
/* Variants for adaptive components like input, select, notification, ... */
|
|
12
2
|
@layer variables {}
|
|
13
3
|
|
|
@@ -43,12 +33,6 @@ paddings/gaps in an application e.g. the <main> should have a responsive padding
|
|
|
43
33
|
|
|
44
34
|
@layer variables {}
|
|
45
35
|
|
|
46
|
-
/**
|
|
47
|
-
Generates 3 types of placeholders, e.g:
|
|
48
|
-
- %db-component-variables-md
|
|
49
|
-
- %db-font-size-md
|
|
50
|
-
- %db-overwrite-font-size-md
|
|
51
|
-
*/
|
|
52
36
|
@layer variables {}
|
|
53
37
|
|
|
54
38
|
@layer variables {}
|
|
@@ -114,6 +98,3 @@ paddings/gaps in an application e.g. the <main> should have a responsive padding
|
|
|
114
98
|
@layer variables {}
|
|
115
99
|
|
|
116
100
|
@layer variables {}
|
|
117
|
-
|
|
118
|
-
/* Use for body tags like <p> */
|
|
119
|
-
/* Use for headline tags like <h1> */
|
|
@@ -29,7 +29,12 @@ $cursor-pointer: var(--db-overwrite-cursor, pointer);
|
|
|
29
29
|
|
|
30
30
|
@mixin hover() {
|
|
31
31
|
/* stylelint-disable-next-line a11y/selector-pseudo-class-focus */
|
|
32
|
-
&:hover:not(
|
|
32
|
+
&:hover:not(
|
|
33
|
+
:disabled,
|
|
34
|
+
[aria-disabled="true"],
|
|
35
|
+
[tabindex="-1"],
|
|
36
|
+
:has(:disabled)
|
|
37
|
+
) {
|
|
33
38
|
@include cursor-pointer {
|
|
34
39
|
@content;
|
|
35
40
|
}
|
|
@@ -37,7 +42,12 @@ $cursor-pointer: var(--db-overwrite-cursor, pointer);
|
|
|
37
42
|
}
|
|
38
43
|
|
|
39
44
|
@mixin active() {
|
|
40
|
-
&:active:not(
|
|
45
|
+
&:active:not(
|
|
46
|
+
:disabled,
|
|
47
|
+
[aria-disabled="true"],
|
|
48
|
+
[tabindex="-1"],
|
|
49
|
+
:has(:disabled)
|
|
50
|
+
) {
|
|
41
51
|
@include cursor-pointer {
|
|
42
52
|
@content;
|
|
43
53
|
}
|