@vaadin/vaadin-lumo-styles 25.0.0-alpha17 → 25.0.0-alpha19
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/all-imports.d.ts +0 -8
- package/all-imports.js +0 -18
- package/components/upload.css +6 -3
- package/mixins/field-button.js +3 -4
- package/mixins/helper.js +3 -4
- package/mixins/input-field-shared.js +3 -6
- package/mixins/loader.js +3 -2
- package/mixins/menu-overlay.js +3 -2
- package/mixins/overlay.js +3 -4
- package/mixins/required-field.js +3 -4
- package/package.json +7 -8
- package/presets/compact.css +31 -0
- package/src/components/context-menu-overlay.css +21 -0
- package/src/components/upload-file.css +4 -3
- package/src/mixins/overlay.css +9 -0
- package/utility.css +0 -1
- package/auto-complete.css +0 -2512
- package/badge-global.js +0 -9
- package/badge.d.ts +0 -3
- package/badge.js +0 -178
- package/color-global.js +0 -9
- package/color.d.ts +0 -5
- package/color.js +0 -221
- package/font-icons.js +0 -71
- package/global.js +0 -5
- package/presets/compact.js +0 -40
- package/sizing.d.ts +0 -3
- package/sizing.js +0 -29
- package/spacing.d.ts +0 -3
- package/spacing.js +0 -37
- package/src/components/upload-file-list.css +0 -24
- package/style.d.ts +0 -3
- package/style.js +0 -31
- package/typography-global.js +0 -13
- package/typography.d.ts +0 -7
- package/typography.js +0 -129
- package/user-colors.d.ts +0 -8
- package/user-colors.js +0 -33
- package/utilities/accessibility.js +0 -21
- package/utilities/background.js +0 -156
- package/utilities/border.js +0 -147
- package/utilities/filter.js +0 -34
- package/utilities/flexbox-grid.js +0 -619
- package/utilities/layout.js +0 -504
- package/utilities/shadows.js +0 -28
- package/utilities/sizing.js +0 -121
- package/utilities/spacing.js +0 -542
- package/utilities/transition.js +0 -50
- package/utilities/typography.js +0 -344
- package/utility-global.js +0 -9
- package/utility.d.ts +0 -3
- package/utility.js +0 -34
package/badge-global.js
DELETED
|
@@ -1,9 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* @license
|
|
3
|
-
* Copyright (c) 2017 - 2025 Vaadin Ltd.
|
|
4
|
-
* This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
|
|
5
|
-
*/
|
|
6
|
-
import { badge } from './badge.js';
|
|
7
|
-
import { addLumoGlobalStyles } from './global.js';
|
|
8
|
-
|
|
9
|
-
addLumoGlobalStyles('badge', badge);
|
package/badge.d.ts
DELETED
package/badge.js
DELETED
|
@@ -1,178 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* @license
|
|
3
|
-
* Copyright (c) 2017 - 2025 Vaadin Ltd.
|
|
4
|
-
* This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
|
|
5
|
-
*/
|
|
6
|
-
import './style.js';
|
|
7
|
-
import './color.js';
|
|
8
|
-
import './typography.js';
|
|
9
|
-
import { css, registerStyles } from '@vaadin/vaadin-themable-mixin/vaadin-themable-mixin.js';
|
|
10
|
-
|
|
11
|
-
const badge = css`
|
|
12
|
-
[theme~='badge'] {
|
|
13
|
-
display: inline-flex;
|
|
14
|
-
align-items: center;
|
|
15
|
-
justify-content: center;
|
|
16
|
-
box-sizing: border-box;
|
|
17
|
-
padding: 0.4em calc(0.5em + var(--lumo-border-radius-s) / 4);
|
|
18
|
-
color: var(--lumo-primary-text-color);
|
|
19
|
-
background-color: var(--lumo-primary-color-10pct);
|
|
20
|
-
border-radius: var(--lumo-border-radius-s);
|
|
21
|
-
font-family: var(--lumo-font-family);
|
|
22
|
-
font-size: var(--lumo-font-size-s);
|
|
23
|
-
line-height: 1;
|
|
24
|
-
font-weight: 500;
|
|
25
|
-
text-transform: initial;
|
|
26
|
-
letter-spacing: initial;
|
|
27
|
-
min-width: calc(var(--lumo-line-height-xs) * 1em + 0.45em);
|
|
28
|
-
flex-shrink: 0;
|
|
29
|
-
}
|
|
30
|
-
|
|
31
|
-
/* Ensure proper vertical alignment */
|
|
32
|
-
[theme~='badge']::before {
|
|
33
|
-
display: inline-block;
|
|
34
|
-
content: '\\2003';
|
|
35
|
-
width: 0;
|
|
36
|
-
}
|
|
37
|
-
|
|
38
|
-
[theme~='badge'][theme~='small'] {
|
|
39
|
-
font-size: var(--lumo-font-size-xxs);
|
|
40
|
-
line-height: 1;
|
|
41
|
-
}
|
|
42
|
-
|
|
43
|
-
/* Colors */
|
|
44
|
-
|
|
45
|
-
[theme~='badge'][theme~='success'] {
|
|
46
|
-
color: var(--lumo-success-text-color);
|
|
47
|
-
background-color: var(--lumo-success-color-10pct);
|
|
48
|
-
}
|
|
49
|
-
|
|
50
|
-
[theme~='badge'][theme~='error'] {
|
|
51
|
-
color: var(--lumo-error-text-color);
|
|
52
|
-
background-color: var(--lumo-error-color-10pct);
|
|
53
|
-
}
|
|
54
|
-
|
|
55
|
-
[theme~='badge'][theme~='warning'] {
|
|
56
|
-
color: var(--lumo-warning-text-color);
|
|
57
|
-
background-color: var(--lumo-warning-color-10pct);
|
|
58
|
-
}
|
|
59
|
-
|
|
60
|
-
[theme~='badge'][theme~='contrast'] {
|
|
61
|
-
color: var(--lumo-contrast-80pct);
|
|
62
|
-
background-color: var(--lumo-contrast-5pct);
|
|
63
|
-
}
|
|
64
|
-
|
|
65
|
-
/* Primary */
|
|
66
|
-
|
|
67
|
-
[theme~='badge'][theme~='primary'] {
|
|
68
|
-
color: var(--lumo-primary-contrast-color);
|
|
69
|
-
background-color: var(--lumo-primary-color);
|
|
70
|
-
}
|
|
71
|
-
|
|
72
|
-
[theme~='badge'][theme~='success'][theme~='primary'] {
|
|
73
|
-
color: var(--lumo-success-contrast-color);
|
|
74
|
-
background-color: var(--lumo-success-color);
|
|
75
|
-
}
|
|
76
|
-
|
|
77
|
-
[theme~='badge'][theme~='error'][theme~='primary'] {
|
|
78
|
-
color: var(--lumo-error-contrast-color);
|
|
79
|
-
background-color: var(--lumo-error-color);
|
|
80
|
-
}
|
|
81
|
-
|
|
82
|
-
[theme~='badge'][theme~='warning'][theme~='primary'] {
|
|
83
|
-
color: var(--lumo-warning-contrast-color);
|
|
84
|
-
background-color: var(--lumo-warning-color);
|
|
85
|
-
}
|
|
86
|
-
|
|
87
|
-
[theme~='badge'][theme~='contrast'][theme~='primary'] {
|
|
88
|
-
color: var(--lumo-base-color);
|
|
89
|
-
background-color: var(--lumo-contrast);
|
|
90
|
-
}
|
|
91
|
-
|
|
92
|
-
/* Links */
|
|
93
|
-
|
|
94
|
-
[theme~='badge'][href]:hover {
|
|
95
|
-
text-decoration: none;
|
|
96
|
-
}
|
|
97
|
-
|
|
98
|
-
/* Icon */
|
|
99
|
-
|
|
100
|
-
[theme~='badge'] > vaadin-icon {
|
|
101
|
-
margin: -0.25em 0;
|
|
102
|
-
}
|
|
103
|
-
|
|
104
|
-
[theme~='badge'] > vaadin-icon:first-child {
|
|
105
|
-
margin-left: -0.375em;
|
|
106
|
-
}
|
|
107
|
-
|
|
108
|
-
[theme~='badge'] > vaadin-icon:last-child {
|
|
109
|
-
margin-right: -0.375em;
|
|
110
|
-
}
|
|
111
|
-
|
|
112
|
-
vaadin-icon[theme~='badge'][icon] {
|
|
113
|
-
min-width: 0;
|
|
114
|
-
padding: 0;
|
|
115
|
-
font-size: 1rem;
|
|
116
|
-
width: var(--lumo-icon-size-m);
|
|
117
|
-
height: var(--lumo-icon-size-m);
|
|
118
|
-
}
|
|
119
|
-
|
|
120
|
-
vaadin-icon[theme~='badge'][icon][theme~='small'] {
|
|
121
|
-
width: var(--lumo-icon-size-s);
|
|
122
|
-
height: var(--lumo-icon-size-s);
|
|
123
|
-
}
|
|
124
|
-
|
|
125
|
-
/* Empty */
|
|
126
|
-
|
|
127
|
-
[theme~='badge']:not([icon]):empty {
|
|
128
|
-
min-width: 0;
|
|
129
|
-
width: 1em;
|
|
130
|
-
height: 1em;
|
|
131
|
-
padding: 0;
|
|
132
|
-
border-radius: 50%;
|
|
133
|
-
background-color: var(--lumo-primary-color);
|
|
134
|
-
}
|
|
135
|
-
|
|
136
|
-
[theme~='badge'][theme~='small']:not([icon]):empty {
|
|
137
|
-
width: 0.75em;
|
|
138
|
-
height: 0.75em;
|
|
139
|
-
}
|
|
140
|
-
|
|
141
|
-
[theme~='badge'][theme~='contrast']:not([icon]):empty {
|
|
142
|
-
background-color: var(--lumo-contrast);
|
|
143
|
-
}
|
|
144
|
-
|
|
145
|
-
[theme~='badge'][theme~='success']:not([icon]):empty {
|
|
146
|
-
background-color: var(--lumo-success-color);
|
|
147
|
-
}
|
|
148
|
-
|
|
149
|
-
[theme~='badge'][theme~='error']:not([icon]):empty {
|
|
150
|
-
background-color: var(--lumo-error-color);
|
|
151
|
-
}
|
|
152
|
-
|
|
153
|
-
[theme~='badge'][theme~='warning']:not([icon]):empty {
|
|
154
|
-
background-color: var(--lumo-warning-color);
|
|
155
|
-
}
|
|
156
|
-
|
|
157
|
-
/* Pill */
|
|
158
|
-
|
|
159
|
-
[theme~='badge'][theme~='pill'] {
|
|
160
|
-
--lumo-border-radius-s: 1em;
|
|
161
|
-
}
|
|
162
|
-
|
|
163
|
-
/* RTL specific styles */
|
|
164
|
-
|
|
165
|
-
[dir='rtl'][theme~='badge'] vaadin-icon:first-child {
|
|
166
|
-
margin-right: -0.375em;
|
|
167
|
-
margin-left: 0;
|
|
168
|
-
}
|
|
169
|
-
|
|
170
|
-
[dir='rtl'][theme~='badge'] vaadin-icon:last-child {
|
|
171
|
-
margin-left: -0.375em;
|
|
172
|
-
margin-right: 0;
|
|
173
|
-
}
|
|
174
|
-
`;
|
|
175
|
-
|
|
176
|
-
registerStyles('', badge, { moduleId: 'lumo-badge' });
|
|
177
|
-
|
|
178
|
-
export { badge };
|
package/color-global.js
DELETED
|
@@ -1,9 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* @license
|
|
3
|
-
* Copyright (c) 2017 - 2025 Vaadin Ltd.
|
|
4
|
-
* This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
|
|
5
|
-
*/
|
|
6
|
-
import { color } from './color.js';
|
|
7
|
-
import { addLumoGlobalStyles } from './global.js';
|
|
8
|
-
|
|
9
|
-
addLumoGlobalStyles('color', color);
|
package/color.d.ts
DELETED
package/color.js
DELETED
|
@@ -1,221 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* @license
|
|
3
|
-
* Copyright (c) 2017 - 2025 Vaadin Ltd.
|
|
4
|
-
* This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
|
|
5
|
-
*/
|
|
6
|
-
import './version.js';
|
|
7
|
-
import { css, registerStyles } from '@vaadin/vaadin-themable-mixin/vaadin-themable-mixin.js';
|
|
8
|
-
import { addLumoGlobalStyles } from './global.js';
|
|
9
|
-
|
|
10
|
-
const colorBase = css`
|
|
11
|
-
:host {
|
|
12
|
-
/* Base (background) */
|
|
13
|
-
--lumo-base-color: #fff;
|
|
14
|
-
|
|
15
|
-
/* Tint */
|
|
16
|
-
--lumo-tint-5pct: hsla(0, 0%, 100%, 0.3);
|
|
17
|
-
--lumo-tint-10pct: hsla(0, 0%, 100%, 0.37);
|
|
18
|
-
--lumo-tint-20pct: hsla(0, 0%, 100%, 0.44);
|
|
19
|
-
--lumo-tint-30pct: hsla(0, 0%, 100%, 0.5);
|
|
20
|
-
--lumo-tint-40pct: hsla(0, 0%, 100%, 0.57);
|
|
21
|
-
--lumo-tint-50pct: hsla(0, 0%, 100%, 0.64);
|
|
22
|
-
--lumo-tint-60pct: hsla(0, 0%, 100%, 0.7);
|
|
23
|
-
--lumo-tint-70pct: hsla(0, 0%, 100%, 0.77);
|
|
24
|
-
--lumo-tint-80pct: hsla(0, 0%, 100%, 0.84);
|
|
25
|
-
--lumo-tint-90pct: hsla(0, 0%, 100%, 0.9);
|
|
26
|
-
--lumo-tint: #fff;
|
|
27
|
-
|
|
28
|
-
/* Shade */
|
|
29
|
-
--lumo-shade-5pct: hsla(214, 61%, 25%, 0.05);
|
|
30
|
-
--lumo-shade-10pct: hsla(214, 57%, 24%, 0.1);
|
|
31
|
-
--lumo-shade-20pct: hsla(214, 53%, 23%, 0.16);
|
|
32
|
-
--lumo-shade-30pct: hsla(214, 50%, 22%, 0.26);
|
|
33
|
-
--lumo-shade-40pct: hsla(214, 47%, 21%, 0.38);
|
|
34
|
-
--lumo-shade-50pct: hsla(214, 45%, 20%, 0.52);
|
|
35
|
-
--lumo-shade-60pct: hsla(214, 43%, 19%, 0.6);
|
|
36
|
-
--lumo-shade-70pct: hsla(214, 42%, 18%, 0.69);
|
|
37
|
-
--lumo-shade-80pct: hsla(214, 41%, 17%, 0.83);
|
|
38
|
-
--lumo-shade-90pct: hsla(214, 40%, 16%, 0.94);
|
|
39
|
-
--lumo-shade: hsl(214, 35%, 15%);
|
|
40
|
-
|
|
41
|
-
/* Contrast */
|
|
42
|
-
--lumo-contrast-5pct: var(--lumo-shade-5pct);
|
|
43
|
-
--lumo-contrast-10pct: var(--lumo-shade-10pct);
|
|
44
|
-
--lumo-contrast-20pct: var(--lumo-shade-20pct);
|
|
45
|
-
--lumo-contrast-30pct: var(--lumo-shade-30pct);
|
|
46
|
-
--lumo-contrast-40pct: var(--lumo-shade-40pct);
|
|
47
|
-
--lumo-contrast-50pct: var(--lumo-shade-50pct);
|
|
48
|
-
--lumo-contrast-60pct: var(--lumo-shade-60pct);
|
|
49
|
-
--lumo-contrast-70pct: var(--lumo-shade-70pct);
|
|
50
|
-
--lumo-contrast-80pct: var(--lumo-shade-80pct);
|
|
51
|
-
--lumo-contrast-90pct: var(--lumo-shade-90pct);
|
|
52
|
-
--lumo-contrast: var(--lumo-shade);
|
|
53
|
-
|
|
54
|
-
/* Text */
|
|
55
|
-
--lumo-header-text-color: var(--lumo-contrast);
|
|
56
|
-
--lumo-body-text-color: var(--lumo-contrast-90pct);
|
|
57
|
-
--lumo-secondary-text-color: var(--lumo-contrast-70pct);
|
|
58
|
-
--lumo-tertiary-text-color: var(--lumo-contrast-50pct);
|
|
59
|
-
--lumo-disabled-text-color: var(--lumo-contrast-30pct);
|
|
60
|
-
|
|
61
|
-
/* Primary */
|
|
62
|
-
--lumo-primary-color: hsl(214, 100%, 48%);
|
|
63
|
-
--lumo-primary-color-50pct: hsla(214, 100%, 49%, 0.76);
|
|
64
|
-
--lumo-primary-color-10pct: hsla(214, 100%, 60%, 0.13);
|
|
65
|
-
--lumo-primary-text-color: hsl(214, 100%, 43%);
|
|
66
|
-
--lumo-primary-contrast-color: #fff;
|
|
67
|
-
|
|
68
|
-
/* Error */
|
|
69
|
-
--lumo-error-color: hsl(3, 85%, 48%);
|
|
70
|
-
--lumo-error-color-50pct: hsla(3, 85%, 49%, 0.5);
|
|
71
|
-
--lumo-error-color-10pct: hsla(3, 85%, 49%, 0.1);
|
|
72
|
-
--lumo-error-text-color: hsl(3, 89%, 42%);
|
|
73
|
-
--lumo-error-contrast-color: #fff;
|
|
74
|
-
|
|
75
|
-
/* Success */
|
|
76
|
-
--lumo-success-color: hsl(145, 72%, 30%);
|
|
77
|
-
--lumo-success-color-50pct: hsla(145, 72%, 31%, 0.5);
|
|
78
|
-
--lumo-success-color-10pct: hsla(145, 72%, 31%, 0.1);
|
|
79
|
-
--lumo-success-text-color: hsl(145, 85%, 25%);
|
|
80
|
-
--lumo-success-contrast-color: #fff;
|
|
81
|
-
|
|
82
|
-
/* Warning */
|
|
83
|
-
--lumo-warning-color: hsl(48, 100%, 50%);
|
|
84
|
-
--lumo-warning-color-10pct: hsla(48, 100%, 50%, 0.25);
|
|
85
|
-
--lumo-warning-text-color: hsl(32, 100%, 30%);
|
|
86
|
-
--lumo-warning-contrast-color: var(--lumo-shade-90pct);
|
|
87
|
-
}
|
|
88
|
-
|
|
89
|
-
/* forced-colors mode adjustments */
|
|
90
|
-
@media (forced-colors: active) {
|
|
91
|
-
html {
|
|
92
|
-
--lumo-disabled-text-color: GrayText;
|
|
93
|
-
}
|
|
94
|
-
}
|
|
95
|
-
`;
|
|
96
|
-
|
|
97
|
-
addLumoGlobalStyles('color-props', colorBase);
|
|
98
|
-
|
|
99
|
-
const color = css`
|
|
100
|
-
[theme~='dark'] {
|
|
101
|
-
/* Base (background) */
|
|
102
|
-
--lumo-base-color: hsl(214, 35%, 21%);
|
|
103
|
-
|
|
104
|
-
/* Tint */
|
|
105
|
-
--lumo-tint-5pct: hsla(214, 65%, 85%, 0.06);
|
|
106
|
-
--lumo-tint-10pct: hsla(214, 60%, 80%, 0.14);
|
|
107
|
-
--lumo-tint-20pct: hsla(214, 64%, 82%, 0.23);
|
|
108
|
-
--lumo-tint-30pct: hsla(214, 69%, 84%, 0.32);
|
|
109
|
-
--lumo-tint-40pct: hsla(214, 73%, 86%, 0.41);
|
|
110
|
-
--lumo-tint-50pct: hsla(214, 78%, 88%, 0.5);
|
|
111
|
-
--lumo-tint-60pct: hsla(214, 82%, 90%, 0.58);
|
|
112
|
-
--lumo-tint-70pct: hsla(214, 87%, 92%, 0.69);
|
|
113
|
-
--lumo-tint-80pct: hsla(214, 91%, 94%, 0.8);
|
|
114
|
-
--lumo-tint-90pct: hsla(214, 96%, 96%, 0.9);
|
|
115
|
-
--lumo-tint: hsl(214, 100%, 98%);
|
|
116
|
-
|
|
117
|
-
/* Shade */
|
|
118
|
-
--lumo-shade-5pct: hsla(214, 0%, 0%, 0.07);
|
|
119
|
-
--lumo-shade-10pct: hsla(214, 4%, 2%, 0.15);
|
|
120
|
-
--lumo-shade-20pct: hsla(214, 8%, 4%, 0.23);
|
|
121
|
-
--lumo-shade-30pct: hsla(214, 12%, 6%, 0.32);
|
|
122
|
-
--lumo-shade-40pct: hsla(214, 16%, 8%, 0.41);
|
|
123
|
-
--lumo-shade-50pct: hsla(214, 20%, 10%, 0.5);
|
|
124
|
-
--lumo-shade-60pct: hsla(214, 24%, 12%, 0.6);
|
|
125
|
-
--lumo-shade-70pct: hsla(214, 28%, 13%, 0.7);
|
|
126
|
-
--lumo-shade-80pct: hsla(214, 32%, 13%, 0.8);
|
|
127
|
-
--lumo-shade-90pct: hsla(214, 33%, 13%, 0.9);
|
|
128
|
-
--lumo-shade: hsl(214, 33%, 13%);
|
|
129
|
-
|
|
130
|
-
/* Contrast */
|
|
131
|
-
--lumo-contrast-5pct: var(--lumo-tint-5pct);
|
|
132
|
-
--lumo-contrast-10pct: var(--lumo-tint-10pct);
|
|
133
|
-
--lumo-contrast-20pct: var(--lumo-tint-20pct);
|
|
134
|
-
--lumo-contrast-30pct: var(--lumo-tint-30pct);
|
|
135
|
-
--lumo-contrast-40pct: var(--lumo-tint-40pct);
|
|
136
|
-
--lumo-contrast-50pct: var(--lumo-tint-50pct);
|
|
137
|
-
--lumo-contrast-60pct: var(--lumo-tint-60pct);
|
|
138
|
-
--lumo-contrast-70pct: var(--lumo-tint-70pct);
|
|
139
|
-
--lumo-contrast-80pct: var(--lumo-tint-80pct);
|
|
140
|
-
--lumo-contrast-90pct: var(--lumo-tint-90pct);
|
|
141
|
-
--lumo-contrast: var(--lumo-tint);
|
|
142
|
-
|
|
143
|
-
/* Text */
|
|
144
|
-
--lumo-header-text-color: var(--lumo-contrast);
|
|
145
|
-
--lumo-body-text-color: var(--lumo-contrast-90pct);
|
|
146
|
-
--lumo-secondary-text-color: var(--lumo-contrast-70pct);
|
|
147
|
-
--lumo-tertiary-text-color: var(--lumo-contrast-50pct);
|
|
148
|
-
--lumo-disabled-text-color: var(--lumo-contrast-30pct);
|
|
149
|
-
|
|
150
|
-
/* Primary */
|
|
151
|
-
--lumo-primary-color: hsl(214, 90%, 48%);
|
|
152
|
-
--lumo-primary-color-50pct: hsla(214, 90%, 70%, 0.69);
|
|
153
|
-
--lumo-primary-color-10pct: hsla(214, 90%, 55%, 0.13);
|
|
154
|
-
--lumo-primary-text-color: hsl(214, 90%, 77%);
|
|
155
|
-
--lumo-primary-contrast-color: #fff;
|
|
156
|
-
|
|
157
|
-
/* Error */
|
|
158
|
-
--lumo-error-color: hsl(3, 79%, 49%);
|
|
159
|
-
--lumo-error-color-50pct: hsla(3, 75%, 62%, 0.5);
|
|
160
|
-
--lumo-error-color-10pct: hsla(3, 75%, 62%, 0.14);
|
|
161
|
-
--lumo-error-text-color: hsl(3, 100%, 80%);
|
|
162
|
-
|
|
163
|
-
/* Success */
|
|
164
|
-
--lumo-success-color: hsl(145, 72%, 30%);
|
|
165
|
-
--lumo-success-color-50pct: hsla(145, 92%, 51%, 0.5);
|
|
166
|
-
--lumo-success-color-10pct: hsla(145, 92%, 51%, 0.1);
|
|
167
|
-
--lumo-success-text-color: hsl(145, 85%, 46%);
|
|
168
|
-
|
|
169
|
-
/* Warning */
|
|
170
|
-
--lumo-warning-color: hsl(43, 100%, 48%);
|
|
171
|
-
--lumo-warning-color-10pct: hsla(40, 100%, 50%, 0.2);
|
|
172
|
-
--lumo-warning-text-color: hsl(45, 100%, 60%);
|
|
173
|
-
--lumo-warning-contrast-color: var(--lumo-shade-90pct);
|
|
174
|
-
}
|
|
175
|
-
|
|
176
|
-
html {
|
|
177
|
-
color: var(--lumo-body-text-color);
|
|
178
|
-
background-color: var(--lumo-base-color);
|
|
179
|
-
color-scheme: light;
|
|
180
|
-
}
|
|
181
|
-
|
|
182
|
-
[theme~='dark'] {
|
|
183
|
-
color: var(--lumo-body-text-color);
|
|
184
|
-
background-color: var(--lumo-base-color);
|
|
185
|
-
color-scheme: dark;
|
|
186
|
-
}
|
|
187
|
-
|
|
188
|
-
h1,
|
|
189
|
-
h2,
|
|
190
|
-
h3,
|
|
191
|
-
h4,
|
|
192
|
-
h5,
|
|
193
|
-
h6 {
|
|
194
|
-
color: var(--lumo-header-text-color);
|
|
195
|
-
}
|
|
196
|
-
|
|
197
|
-
a:where(:any-link) {
|
|
198
|
-
color: var(--lumo-primary-text-color);
|
|
199
|
-
}
|
|
200
|
-
|
|
201
|
-
a:not(:any-link) {
|
|
202
|
-
color: var(--lumo-disabled-text-color);
|
|
203
|
-
}
|
|
204
|
-
|
|
205
|
-
blockquote {
|
|
206
|
-
color: var(--lumo-secondary-text-color);
|
|
207
|
-
}
|
|
208
|
-
|
|
209
|
-
code,
|
|
210
|
-
pre {
|
|
211
|
-
background-color: var(--lumo-contrast-10pct);
|
|
212
|
-
border-radius: var(--lumo-border-radius-m);
|
|
213
|
-
}
|
|
214
|
-
pre code {
|
|
215
|
-
background: transparent;
|
|
216
|
-
}
|
|
217
|
-
`;
|
|
218
|
-
|
|
219
|
-
registerStyles('', color, { moduleId: 'lumo-color' });
|
|
220
|
-
|
|
221
|
-
export { colorBase, color };
|
package/font-icons.js
DELETED
|
@@ -1,71 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* @license
|
|
3
|
-
* Copyright (c) 2017 - 2025 Vaadin Ltd.
|
|
4
|
-
* This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
|
|
5
|
-
*/
|
|
6
|
-
import './version.js';
|
|
7
|
-
import { css } from '@vaadin/vaadin-themable-mixin/vaadin-themable-mixin.js';
|
|
8
|
-
import { addLumoGlobalStyles } from './global.js';
|
|
9
|
-
|
|
10
|
-
const fontIcons = css`
|
|
11
|
-
@font-face {
|
|
12
|
-
font-family: 'lumo-icons';
|
|
13
|
-
src: url(data:application/font-woff;charset=utf-8;base64,d09GRgABAAAAABNYAAsAAAAAJpgAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAABHU1VCAAABCAAAADsAAABUIIslek9TLzIAAAFEAAAARAAAAGBAJEuVY21hcAAAAYgAAAESAAAEAryc8p5nbHlmAAACnAAADUAAABskk6jwI2hlYWQAAA/cAAAAMQAAADZa/6SoaGhlYQAAEBAAAAAdAAAAJAbpA4RobXR4AAAQMAAAABAAAADEu4AAAGxvY2EAABBAAAAAZAAAAGSgPKfAbWF4cAAAEKQAAAAfAAAAIAFQAXBuYW1lAAAQxAAAATEAAAIuUUJZCHBvc3QAABH4AAABXQAAAimEGAW4eJxjYGRgYOBiMGCwY2BycfMJYeDLSSzJY5BiYGGAAJA8MpsxJzM9kYEDxgPKsYBpDiBmg4gCACY7BUgAeJxjYGG+wjiBgZWBgamKaQ8DA0MPhGZ8wGDIyAQUZWBlZsAKAtJcUxgcXjG+MmAO+p/FEMUcxDANKMyIoogJAIMlDDt4nO3T13GDQBhF4YOEcs4550wpKskF+cll0YS8l+syzMy3Z9gBoZkfgAKQD+5BDNEPETq+w26U7eepZvsxX9k1sfbT5PMJa6Q1nMfZmgvXxuEXi5QoUwn31ajToEmLNh269OgzYMiIMROmzJizYMmKNRu27Nhz4MiJMxeu3MLzHzx5kYQHFPk/6lpy77+zRDOwbCo5Q82bppvGpjmlBdPk06Khlgy1bKgVQ62a3oi0Zqh1079LG4baNNSWobYNtWOoXUPtGWrfUAeGOjTUkaGODXViqFNDnRnq3FAXhro01JWhrg11Y6hbQ90Z6t5QD4Z6NNSToZ4N9WKoV0O9Gerd9BWnD0N9GurLUBMj+QW9hHPRAAB4nLVYCYwb5RWe96/t8Xhm7B17ZnxsbK+PtffIeonP7G7iza5Dsjl2kyhLSIDmgBTKpVBSGqXVoippUqAhRVS0QiAOVUrakjZpolZAmlJEuKFqqQSkSitEmyIgQhypWkXs0Pf/M/baZnMgRLJ6fv/15v3v/9/73vs5G4f/WkbIA5zEBbkUl+M4X76Yi2V11ZGIxVP++oZS30jXN/brrWS8Vddbpw636qsVCZ6UFEUyFlE6za+un0W2u1W1TVUPy+zH2Gs2X3X7fLN8PqrWhXTTzqlb4Zy6tUpwlKlzqdRaz38Rzb4Km+1TqDKoEiqj1PP7vpjNgOkWhJNcKzZSbtCjoGeHoAwZ8AC0uTuCxH1Gjstn3STY4T4JL0tkVlJ+SxRPyclZRHq5KoPcSH5IZXTobkj1QSpPZURQBlknkbYO6S1JOiV1tOGKPe6kKVNCmQGUWdODHDNlQKrM9FA94EY9hgB+1CSDDLk7AjUhwSQTYu2F2JkejgwUh6CYjaIWbuibYS9v1AmdReSXpvV4nSzg/CijVIyAwwOOeB+qUYYo4OlkdY2EJsWoRqSjYth1VCJaVJzU2/VXbnERf1Tc53LtE6N+4roFxj267qnKfM+UCf5mA5kHDNu2iPXLxS0wRo8R5jZ/63atXW+SibeD3pR0o91K5JvGESZjrEk2zNXbtdtNua6waMqt7f16JlNxAzqGwjfaMU1CgN+fbFoLH1a/1GQEKtLBzuUmcoDzcFGujxviVnAb0AdyWT0MqqMHvzMf8kV/3IFNfRCyRWymEnRcU8zxgsLG/YqDjWMzlfB/fhyb0+MHb9LCYY2SIi8IfDfvcvHH6/pcAK4ZemkfTof1Ye1d2o2kIvD76cB+XoB7wtrUS7SfFLXwiIs3JDoCZ3jX5ohq3EJH4B41UsGRI2xkjKdGaGE2CKANwlw3V8C7lVDyZcglCvRGhSGRjYCmYF8Kt+PQWhriQ06rWgm2LOtdnoFgPAiZ5b3LCqmJVOFhNPun1PiGrVX/96RPLsu+g0BwvFsJBJTu3rFewwCSKhZTxgm8kVFdL7VLPq/cjippTK8S6pXAuFThVnPXcFu5ndyPuZ9xR7hnuL9y/+Q+gRbwQQJyUIHVcA3ejRxqjXZGva0zpGrSMxwEa0Tjm07XnH7u9lc9v9R82y7Qbl5v/4Lf+6L6NLdh21lJ6BKkpfQMp16hdCnruLdbkGQnJbtm4D7+EqPT3ExketRQL1LM+QWSHaogSYIaVMx7qgRZ+yjb5TnJ5JcaPjvjzBkXXUDSxUu3cEklPSa2xR0qxdgSFPOpOA9QFqO6eIeIQbQi6u2icQK+LupR7BFhhA4Zb9Zw6QM4zMkMlzC+xSxBRHuNd7uMeS43/5rcefx53ivLXv552VozStbRNYg7ZlyMI56pcEVtGsyny+G4uXwaAx8ga9k63mGG1ywFFrL3gus+QPw1v2eGhTwFj0Yd4X/TStIlHPfZO5gf7eCc1EI+zZ/j/aVcIcYDnyv5S2e/vTlyeeWjqcUFSFw3OXy6QHY4b1u09qHJgvH3D+8/XeBq8XWEYUySm2N9H3E7lWYRVmuJp1PpVL5ULBWzfh0HeQfvSGfLkM9A3A1qBEjoMmr3DRIgmKeuHFs+u7d39vKx31WZK0e3j45uv4cSuP4yejIbROU4hfipTxomMmahNRWJtUdLvzSXR+1QmVKaxzwggXqkeT9mGRqqhftGAM+hlv5SGmHXHs8AwgSCg+qGluFVrfLswdGuuG/Cl9VGh/rk1omJVrlvcHlX3INdwdHB2QH7KuNI36q+vlXrKYE7vNngksE5QftlKxS5Z+hSLatPBLPBETZzlSLNHhzpigd3WdORVM/xWdLHtTFN2dmj2WheYVmVXop8CY7tFf3t0t13S+1+cW8dD+s/12XyNTscwxyjF6WfI8Pymag4DSy0FZs57zpJEc0zdYhBG7HBkhnzsNapT+lRXVUjRTMvwXt+M947hQshAs6myIxfpekUamEyCMzVHl/dUAbq5mR1eCmZ7+jIJ+vpX5raSEkmxBrvhbCjA5LsN5mE3bVuqA0nk9WzeB/enDk/ny9Re/wJ87DXqD2kJ+BFF/jbXccE4WmW6T1W840K+RUncj4uS32DXv4MFOYUS76SmYWm+YSZP2HegflXScELh8bHSSxPIY+WX3UvJo4Wzf1RXoyHQMzdW3mbZTvjWnhZvD9uHEaCf6R/7rueAODUxR7wDkrEn5AHLl8W1ozDdPoTE8Yn5kQYR1Jftx3gVC6GvjuMEe6C3sqyQ97K/rBOMrNJ3cLPVBHOnNeDc92CKDrtcbtTlKS4UwLZyahyXk+GE5LzhN3ptJ9wSsZx2RmjIT7mlKt7uA9jbYArYh613NoDvSXVXaATO+g+OnS6pWyJDZRSafY/zrMxXm9w+XSWgoRD1eFMZWzRgvLYWHnBorHd06xxc3tm/nBlR2V4fqbd5XC4GptwRWclna6spKQz3N090N29uS3Q1blmwZrOrkBbHftOMtbjDwT8PbGkSxBcDa07LQlIllERA92c3drvz7lZXD83wi3jLqe4pOcat1Wq7jkRr5kil/XzqURtv9QWGF7Qk/DCockK9Lpl/QLQgMMDdS/YM0/Xh+u2KInZwSVs/5U5p2tcadDfOEs6+TDgvvm7GOWNJ8lKIeQVpg4h3TqvpW6zTj6XnhhihthYZTyNM5xdD/M8WvP7jIKxEYV5QyjM5QtN1zg/xRo/gnFkgFvMjTbX+SaGYrTLkCEaV+3To+hnDc8ABXtDa9Irk0Oy1ytPrZS9na6ga1IQJl0BLzivu06AkFeGbXTUuFP2QX3DeKF+Idkm+3whr3c7LhZCwqQTlKCAAkKzcUaIrvy9OUE+Sjvw14od9F5rWLdkMHYktBzeTV51kx5AlrmkHc8MU/+E6ZqMw/IzVoiRByYnM+N9ELqkHJ+cXHjrwoW3Th3PjGcsfiEdzfwSxo3DZO2KzIpMfOiS0IrK1ju2Vs5iy+Tw1zZRj/HrrHeU87zuNDT2BxQyytLoxymdmScZbyCQCASeUoJYXQWfUljLyt1E2I2xkwPqiTQ+YvYF9la/vxX+weguf7sf/2q17n3ktxzPtXMLuVXceu5G1LSQ4AulnMZbmIFon9MSBYy91L2x/PMVcqara4kysCm8ZgFPOqfq7JMXud27SE9v7w2peUlfILx0V0mVZb+7K6NJshxwd0FyXofP7dU6F6SgxxP0eORjeJI2t6q6pz6ldGae2H8wKxU99L1QLBxwh7U2kojkvYpXcotgvBGVfKIkhqJtukcnLURXApFoyCXJqgj/MR+eTjf81L8JUH+hFXEJbXVp04naixHiYe8lNI/LlzrMQYpLGdCmG037b3QWcr/lJvSyU7eZ+hdzEHrb0UO8TY0ZnKXqJUGvk3rNqOUrB83hX1c9hWH1Z++Tj8lhrotlNiyw6Q76GBOluB0BTIVZF09THvoI1EeRqrNbjostZMDp9PCyaFfDC7pcYYn3xJ0DguCx2fKZ9fHsd/MBdxvZ0SESucW22RMTbHybe2Tdwl6Xnbc7Bc81OJ0QpdWfzO84MN73NdSnGqMPIOonuLlo33G0cIy9NDSguz02Df20RIASzcQY0dI8fTzjE0UfLqlBE2+iUrb4ZzJqovnU4+yX3DD1uBqJqGQU6dQz+4WguOSAEJY2bPmF0CYu33J1y9uRQrkQjSKJlKM9kUhPlDwWG4gbG+MDMfyFR/CXZgsbWXLxiBY23PuFFkfPi6LNWblq/HnRxvdsEWFB1BSCJKpFqaC6vJXWH/Zq3eK3Y93yG+N11yxVneWCbh+MHLSLTviOU7QflNqr74YiuY3luwm6sUF0PZ3mQcwre6DAXBNefYG6+wvo6jWG+X5j9/S7qg9OouW5jjLB7ASTLjQxWrVQKqbwAmSAxku8CDQVgLg4MHFJ19LwWrvgeFry2UGQ7SNd3xgYuW2VArZQh9txundxZ6RtrU0W7Hhd/8gLYKukekpXl51qWHHWvqmSv7HMupCvwQ3NiMzQjOHaLIcY+E4nWXBGkGy7BGGXTRIGNvX3b/rWpn5MrRGkhisPVoZTnZ3IkOs38oJtj9Am7LEJ/I4BOql/0wB9ehrHOena5FqsdpNkNVZDFcyx7sVkyFSL1YYNjRabIBgbKErDo+hsgnCK8qcY201ZJKQNmzgJ0RcnPYuNU5Q/JRxHtpuy3cJ0zZXCupLmlVwHfojeZUeido01lW+oAH+yUwrE5Z3DKxk6URTKrcnl1ly7Jptd89+dUiIA8s4MghLDrpU3WSPXrslZtm+zzjtD8BbxrALGtKeQTlG3p2lNhEYCanfy3Jc/7yrW7LHqF1pZYu7sMwsSRJDPMReJIPdGk8lyMhlt+HnwonBCTsxN4N/Zhh9SmhEGiPVeUK0FFdUx04vzzLUgPIfV3qQUVYmI5aD5DC1ttErBVlYK2kml7v07EHXtcwn7XdEAEY0/NNeCxHqfpbmFSpG+LgmvXhY4w0LcQkqMJ1fsfmj3ClhvtZEYJ/s3zp27sf//62w7THicY2BkYGAA4ss7TZbF89t8ZeBmfgEUYahR3dCIoP8/Z57KdAvI5WBgAokCAFXbDAYAAAB4nGNgZGBgDvqfBSRfMAAB81QGRgZUYAgAVvwDdQAAAHicY2BgYGB+MbQxALRULBEAAAAAAE4AmgDoAQoBLAFOAXABmgHEAe4CGgKcAugEmgS8BNYE8gUOBSoFTAWcBfIGIAZmBrgG2gcqB4wIBAiMCPgJPgl4CZAKJAqOCtYLTgtqC5QLzgwUDFYMjAzGDSYNbA2SeJxjYGRgYDBkTGEQZQABJiDmAkIGhv9gPgMAGTYBwgB4nG2RPU7DMBiG3/QP0UoIBGJh8QILavozdmRo9w7d09RpUzlx5LgVvQMn4BAcgoEzcAgOwVvzSZVQbcnf48fvFysJgGt8IcJxROiG9TgauODuj5ukG+EW+UG4jR4ehTv0Q+EunjER7uEWmk+IWpc0d3gVbuAKb8JN+nfhFvlDuI17fAp36L+Fu1jgR7iHp+jF7Arbz1Nb1nO93pnEncSJFtrVuS3VKB6e5EyX2iVer9TyoOr9eux9pjJnCzW1pdfGWFU5u9WpjzfeV5PBIBMfp7aAwQ4FLPrIkbKWqDHn+67pDRK4s4lzbsEux5qHvcIIMb/nueSMyTKkE3jWFdNLHLjW2PPmMa1Hxn3GjGW/wjT0HtOG09JU4WxLk9LH2ISuiv9twJn9y8fh9uIXI+BknAAAAHicbZBrU9QwFIb7smnpdrtcRMQLCqKoKEXwH2WTY5vZbNI5aWTw19PLwvjBM5Mzzzt55uRMkp1kqiL5f91hBzMIpMiwixxzFFigxBJ72McBDvECR3iJY7zCCV7jDd7iHU7xHh9whnN8xAU+4TMu8QVf8Q1X+I4fuEaFG/zELe7wKymlNbWrFLmOuJiCpd/dYkI2ddMV0tWWKu3v3RYnY8TRyCeObSGZ/f1WHXFSR9yqI8d2vpJcqUZyJ1Zkba6kJaclz1VDar2RvC57+sPejeOewzBw+RSm/Z5SbFNlSbq+e7WeKV+nin0I+TDAeqkXmmVdNdJpS7lm3w4XgrTpUurX4hk9UNmfSpsgV5Z0Zpzuv0ZY49ZiQy6mG+NiKD1rYtKVNaHb9bEbpLRtvKOhd160Vj70LQbRaz5jGp5fMgXzl7YLZIEkq0ZEp/1edP+OzGI7+CIG4iR5BKASnOMAAAA=)
|
|
14
|
-
format('woff');
|
|
15
|
-
font-weight: normal;
|
|
16
|
-
font-style: normal;
|
|
17
|
-
}
|
|
18
|
-
|
|
19
|
-
html {
|
|
20
|
-
--lumo-icons-align-center: '\\ea01';
|
|
21
|
-
--lumo-icons-align-left: '\\ea02';
|
|
22
|
-
--lumo-icons-align-right: '\\ea03';
|
|
23
|
-
--lumo-icons-angle-down: '\\ea04';
|
|
24
|
-
--lumo-icons-angle-left: '\\ea05';
|
|
25
|
-
--lumo-icons-angle-right: '\\ea06';
|
|
26
|
-
--lumo-icons-angle-up: '\\ea07';
|
|
27
|
-
--lumo-icons-arrow-down: '\\ea08';
|
|
28
|
-
--lumo-icons-arrow-left: '\\ea09';
|
|
29
|
-
--lumo-icons-arrow-right: '\\ea0a';
|
|
30
|
-
--lumo-icons-arrow-up: '\\ea0b';
|
|
31
|
-
--lumo-icons-bar-chart: '\\ea0c';
|
|
32
|
-
--lumo-icons-bell: '\\ea0d';
|
|
33
|
-
--lumo-icons-calendar: '\\ea0e';
|
|
34
|
-
--lumo-icons-checkmark: '\\ea0f';
|
|
35
|
-
--lumo-icons-chevron-down: '\\ea10';
|
|
36
|
-
--lumo-icons-chevron-left: '\\ea11';
|
|
37
|
-
--lumo-icons-chevron-right: '\\ea12';
|
|
38
|
-
--lumo-icons-chevron-up: '\\ea13';
|
|
39
|
-
--lumo-icons-clean: '\\ea14';
|
|
40
|
-
--lumo-icons-clock: '\\ea15';
|
|
41
|
-
--lumo-icons-cog: '\\ea16';
|
|
42
|
-
--lumo-icons-cross: '\\ea17';
|
|
43
|
-
--lumo-icons-download: '\\ea18';
|
|
44
|
-
--lumo-icons-drag-handle: '\\ea19';
|
|
45
|
-
--lumo-icons-dropdown: '\\ea1a';
|
|
46
|
-
--lumo-icons-edit: '\\ea1b';
|
|
47
|
-
--lumo-icons-error: '\\ea1c';
|
|
48
|
-
--lumo-icons-eye: '\\ea1d';
|
|
49
|
-
--lumo-icons-eye-disabled: '\\ea1e';
|
|
50
|
-
--lumo-icons-indent: '\\ea1f';
|
|
51
|
-
--lumo-icons-link: '\\ea20';
|
|
52
|
-
--lumo-icons-menu: '\\ea21';
|
|
53
|
-
--lumo-icons-minus: '\\ea22';
|
|
54
|
-
--lumo-icons-ordered-list: '\\ea23';
|
|
55
|
-
--lumo-icons-outdent: '\\ea24';
|
|
56
|
-
--lumo-icons-phone: '\\ea25';
|
|
57
|
-
--lumo-icons-photo: '\\ea26';
|
|
58
|
-
--lumo-icons-play: '\\ea27';
|
|
59
|
-
--lumo-icons-plus: '\\ea28';
|
|
60
|
-
--lumo-icons-redo: '\\ea29';
|
|
61
|
-
--lumo-icons-reload: '\\ea2a';
|
|
62
|
-
--lumo-icons-resize-handle: '\\ea2b';
|
|
63
|
-
--lumo-icons-search: '\\ea2c';
|
|
64
|
-
--lumo-icons-undo: '\\ea2d';
|
|
65
|
-
--lumo-icons-unordered-list: '\\ea2e';
|
|
66
|
-
--lumo-icons-upload: '\\ea2f';
|
|
67
|
-
--lumo-icons-user: '\\ea30';
|
|
68
|
-
}
|
|
69
|
-
`;
|
|
70
|
-
|
|
71
|
-
addLumoGlobalStyles('font-icons', fontIcons);
|
package/global.js
DELETED
package/presets/compact.js
DELETED
|
@@ -1,40 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* @license
|
|
3
|
-
* Copyright (c) 2017 - 2025 Vaadin Ltd.
|
|
4
|
-
* This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
|
|
5
|
-
*/
|
|
6
|
-
import '../sizing.js';
|
|
7
|
-
import '../spacing.js';
|
|
8
|
-
const template = document.createElement('template');
|
|
9
|
-
|
|
10
|
-
template.innerHTML = `
|
|
11
|
-
<style>
|
|
12
|
-
/* Use a stronger selector so that imports added later do not override the property values */
|
|
13
|
-
html:not(div) {
|
|
14
|
-
--lumo-size-xl: 3rem;
|
|
15
|
-
--lumo-size-l: 2.5rem;
|
|
16
|
-
--lumo-size-m: 2rem;
|
|
17
|
-
--lumo-size-s: 1.75rem;
|
|
18
|
-
--lumo-size-xs: 1.5rem;
|
|
19
|
-
--lumo-font-size: 1rem;
|
|
20
|
-
--lumo-font-size-xxxl: 1.75rem;
|
|
21
|
-
--lumo-font-size-xxl: 1.375rem;
|
|
22
|
-
--lumo-font-size-xl: 1.125rem;
|
|
23
|
-
--lumo-font-size-l: 1rem;
|
|
24
|
-
--lumo-font-size-m: 0.875rem;
|
|
25
|
-
--lumo-font-size-s: 0.8125rem;
|
|
26
|
-
--lumo-font-size-xs: 0.75rem;
|
|
27
|
-
--lumo-font-size-xxs: 0.6875rem;
|
|
28
|
-
--lumo-line-height-m: 1.4;
|
|
29
|
-
--lumo-line-height-s: 1.2;
|
|
30
|
-
--lumo-line-height-xs: 1.1;
|
|
31
|
-
--lumo-space-xl: 1.875rem;
|
|
32
|
-
--lumo-space-l: 1.25rem;
|
|
33
|
-
--lumo-space-m: 0.625rem;
|
|
34
|
-
--lumo-space-s: 0.3125rem;
|
|
35
|
-
--lumo-space-xs: 0.1875rem;
|
|
36
|
-
}
|
|
37
|
-
</style>
|
|
38
|
-
`;
|
|
39
|
-
|
|
40
|
-
document.head.appendChild(template.content);
|
package/sizing.d.ts
DELETED
package/sizing.js
DELETED
|
@@ -1,29 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* @license
|
|
3
|
-
* Copyright (c) 2017 - 2025 Vaadin Ltd.
|
|
4
|
-
* This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
|
|
5
|
-
*/
|
|
6
|
-
import './version.js';
|
|
7
|
-
import { css } from '@vaadin/vaadin-themable-mixin/vaadin-themable-mixin.js';
|
|
8
|
-
import { addLumoGlobalStyles } from './global.js';
|
|
9
|
-
|
|
10
|
-
const sizing = css`
|
|
11
|
-
:host {
|
|
12
|
-
--lumo-size-xs: 1.625rem;
|
|
13
|
-
--lumo-size-s: 1.875rem;
|
|
14
|
-
--lumo-size-m: 2.25rem;
|
|
15
|
-
--lumo-size-l: 2.75rem;
|
|
16
|
-
--lumo-size-xl: 3.5rem;
|
|
17
|
-
|
|
18
|
-
/* Icons */
|
|
19
|
-
--lumo-icon-size-s: 1.25em;
|
|
20
|
-
--lumo-icon-size-m: 1.5em;
|
|
21
|
-
--lumo-icon-size-l: 2.25em;
|
|
22
|
-
/* For backwards compatibility */
|
|
23
|
-
--lumo-icon-size: var(--lumo-icon-size-m);
|
|
24
|
-
}
|
|
25
|
-
`;
|
|
26
|
-
|
|
27
|
-
addLumoGlobalStyles('sizing-props', sizing);
|
|
28
|
-
|
|
29
|
-
export { sizing };
|
package/spacing.d.ts
DELETED
package/spacing.js
DELETED
|
@@ -1,37 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* @license
|
|
3
|
-
* Copyright (c) 2017 - 2025 Vaadin Ltd.
|
|
4
|
-
* This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
|
|
5
|
-
*/
|
|
6
|
-
import './version.js';
|
|
7
|
-
import { css } from '@vaadin/vaadin-themable-mixin/vaadin-themable-mixin.js';
|
|
8
|
-
import { addLumoGlobalStyles } from './global.js';
|
|
9
|
-
|
|
10
|
-
const spacing = css`
|
|
11
|
-
:host {
|
|
12
|
-
/* Square */
|
|
13
|
-
--lumo-space-xs: 0.25rem;
|
|
14
|
-
--lumo-space-s: 0.5rem;
|
|
15
|
-
--lumo-space-m: 1rem;
|
|
16
|
-
--lumo-space-l: 1.5rem;
|
|
17
|
-
--lumo-space-xl: 2.5rem;
|
|
18
|
-
|
|
19
|
-
/* Wide */
|
|
20
|
-
--lumo-space-wide-xs: calc(var(--lumo-space-xs) / 2) var(--lumo-space-xs);
|
|
21
|
-
--lumo-space-wide-s: calc(var(--lumo-space-s) / 2) var(--lumo-space-s);
|
|
22
|
-
--lumo-space-wide-m: calc(var(--lumo-space-m) / 2) var(--lumo-space-m);
|
|
23
|
-
--lumo-space-wide-l: calc(var(--lumo-space-l) / 2) var(--lumo-space-l);
|
|
24
|
-
--lumo-space-wide-xl: calc(var(--lumo-space-xl) / 2) var(--lumo-space-xl);
|
|
25
|
-
|
|
26
|
-
/* Tall */
|
|
27
|
-
--lumo-space-tall-xs: var(--lumo-space-xs) calc(var(--lumo-space-xs) / 2);
|
|
28
|
-
--lumo-space-tall-s: var(--lumo-space-s) calc(var(--lumo-space-s) / 2);
|
|
29
|
-
--lumo-space-tall-m: var(--lumo-space-m) calc(var(--lumo-space-m) / 2);
|
|
30
|
-
--lumo-space-tall-l: var(--lumo-space-l) calc(var(--lumo-space-l) / 2);
|
|
31
|
-
--lumo-space-tall-xl: var(--lumo-space-xl) calc(var(--lumo-space-xl) / 2);
|
|
32
|
-
}
|
|
33
|
-
`;
|
|
34
|
-
|
|
35
|
-
addLumoGlobalStyles('spacing-props', spacing);
|
|
36
|
-
|
|
37
|
-
export { spacing };
|
|
@@ -1,24 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* @license
|
|
3
|
-
* Copyright (c) 2000 - 2025 Vaadin Ltd.
|
|
4
|
-
* This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
|
|
5
|
-
*/
|
|
6
|
-
@media lumo_components_upload-file-list {
|
|
7
|
-
:host {
|
|
8
|
-
display: block;
|
|
9
|
-
}
|
|
10
|
-
|
|
11
|
-
:host([hidden]) {
|
|
12
|
-
display: none !important;
|
|
13
|
-
}
|
|
14
|
-
|
|
15
|
-
[part='list'] {
|
|
16
|
-
padding: 0;
|
|
17
|
-
margin: 0;
|
|
18
|
-
list-style-type: none;
|
|
19
|
-
}
|
|
20
|
-
|
|
21
|
-
::slotted(li:not(:first-of-type)) {
|
|
22
|
-
border-top: 1px solid var(--lumo-contrast-10pct);
|
|
23
|
-
}
|
|
24
|
-
}
|
package/style.d.ts
DELETED