@@ -26,94 +26,6 @@ const style = css`
2626 }
2727` ;
2828
29- /**
30- * Default values for component-specific custom properties.
31- */
32- const globals = css `
33- html {
34- /* Button */
35- --vaadin-button-background : var (--lumo-contrast-5pct );
36- --vaadin-button-border : none;
37- --vaadin-button-border-radius : var (--lumo-border-radius-m );
38- --vaadin-button-font-size : var (--lumo-font-size-m );
39- --vaadin-button-font-weight : 500 ;
40- --vaadin-button-height : var (--lumo-size-m );
41- --vaadin-button-margin : var (--lumo-space-xs ) 0 ;
42- --vaadin-button-min-width : calc (var (--vaadin-button-height ) * 2 );
43- --vaadin-button-padding : 0 calc (var (--vaadin-button-height ) / 3 + var (--lumo-border-radius-m ) / 2 );
44- --vaadin-button-text-color : var (--lumo-primary-text-color );
45- --vaadin-button-primary-background : var (--lumo-primary-color );
46- --vaadin-button-primary-border : none;
47- --vaadin-button-primary-font-weight : 600 ;
48- --vaadin-button-primary-text-color : var (--lumo-primary-contrast-color );
49- --vaadin-button-tertiary-background : transparent !important ;
50- --vaadin-button-tertiary-text-color : var (--lumo-primary-text-color );
51- --vaadin-button-tertiary-font-weight : 500 ;
52- --vaadin-button-tertiary-padding : 0 calc (var (--vaadin-button-height ) / 6 );
53- /* Checkbox */
54- --vaadin-checkbox-background : var (--lumo-contrast-20pct );
55- --vaadin-checkbox-background-hover : var (--lumo-contrast-30pct );
56- --vaadin-checkbox-border-radius : var (--lumo-border-radius-s );
57- --vaadin-checkbox-checkmark-char : var (--lumo-icons-checkmark );
58- --vaadin-checkbox-checkmark-char-indeterminate : '' ;
59- --vaadin-checkbox-checkmark-color : var (--lumo-primary-contrast-color );
60- --vaadin-checkbox-checkmark-size : calc (var (--vaadin-checkbox-size ) + 2px );
61- --vaadin-checkbox-label-color : var (--lumo-body-text-color );
62- --vaadin-checkbox-label-font-size : var (--lumo-font-size-m );
63- --vaadin-checkbox-label-padding : var (--lumo-space-xs ) var (--lumo-space-s ) var (--lumo-space-xs ) var (--lumo-space-xs );
64- --vaadin-checkbox-size : calc (var (--lumo-size-m ) / 2 );
65- --vaadin-checkbox-disabled-checkmark-color : var (--lumo-contrast-30pct );
66- --vaadin-checkbox-disabled-background : var (--lumo-contrast-10pct );
67- /* Radio button */
68- --vaadin-radio-button-background : var (--lumo-contrast-20pct );
69- --vaadin-radio-button-background-hover : var (--lumo-contrast-30pct );
70- --vaadin-radio-button-dot-color : var (--lumo-primary-contrast-color );
71- --vaadin-radio-button-dot-size : 3px ;
72- --vaadin-radio-button-label-color : var (--lumo-body-text-color );
73- --vaadin-radio-button-label-font-size : var (--lumo-font-size-m );
74- --vaadin-radio-button-label-padding : var (--lumo-space-xs ) var (--lumo-space-s ) var (--lumo-space-xs )
75- var (--lumo-space-xs );
76- --vaadin-radio-button-size : calc (var (--lumo-size-m ) / 2 );
77- --vaadin-radio-button-disabled-background : var (--lumo-contrast-10pct );
78- --vaadin-radio-button-disabled-dot-color : var (--lumo-contrast-30pct );
79- --vaadin-selection-color : var (--lumo-primary-color );
80- --vaadin-selection-color-text : var (--lumo-primary-text-color );
81- --vaadin-input-field-border-radius : var (--lumo-border-radius-m );
82- --vaadin-focus-ring-color : var (--lumo-primary-color-50pct );
83- --vaadin-focus-ring-width : 2px ;
84- /* Label */
85- --vaadin-input-field-label-color : var (--lumo-secondary-text-color );
86- --vaadin-input-field-focused-label-color : var (--lumo-primary-text-color );
87- --vaadin-input-field-hovered-label-color : var (--lumo-body-text-color );
88- --vaadin-input-field-label-font-size : var (--lumo-font-size-s );
89- --vaadin-input-field-label-font-weight : 500 ;
90- /* Helper */
91- --vaadin-input-field-helper-color : var (--lumo-secondary-text-color );
92- --vaadin-input-field-helper-font-size : var (--lumo-font-size-xs );
93- --vaadin-input-field-helper-font-weight : 400 ;
94- --vaadin-input-field-helper-spacing : 0.4em ;
95- /* Error message */
96- --vaadin-input-field-error-color : var (--lumo-error-text-color );
97- --vaadin-input-field-error-font-size : var (--lumo-font-size-xs );
98- --vaadin-input-field-error-font-weight : 400 ;
99- /* Input field */
100- --vaadin-input-field-background : var (--lumo-contrast-10pct );
101- --vaadin-input-field-icon-color : var (--lumo-contrast-60pct );
102- --vaadin-input-field-icon-size : var (--lumo-icon-size-m );
103- --vaadin-input-field-invalid-background : var (--lumo-error-color-10pct );
104- --vaadin-input-field-invalid-hover-highlight : var (--lumo-error-color-50pct );
105- --vaadin-input-field-disabled-background : var (--lumo-contrast-5pct );
106- --vaadin-input-field-disabled-value-color : var (--lumo-disabled-text-color );
107- --vaadin-input-field-height : var (--lumo-size-m );
108- --vaadin-input-field-hover-highlight : var (--lumo-contrast-50pct );
109- --vaadin-input-field-placeholder-color : var (--lumo-secondary-text-color );
110- --vaadin-input-field-readonly-border : 1px dashed var (--lumo-contrast-30pct );
111- --vaadin-input-field-value-color : var (--lumo-body-text-color );
112- --vaadin-input-field-value-font-size : var (--lumo-font-size-m );
113- --vaadin-input-field-value-font-weight : 500 ;
114- }
115- ` ;
116-
11729addLumoGlobalStyles ( 'style-props' , style ) ;
11830
119- export { globals , style } ;
31+ export { style } ;
0 commit comments