@vaadin/vaadin-lumo-styles
Version:
Lumo is a design system foundation for modern web applications, used by Vaadin components
23 lines (20 loc) • 1.05 kB
CSS
/**
* @license
* Copyright (c) 2017 - 2026 Vaadin Ltd.
* This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
*/
:where(:root),
:where(:host) {
/* Border radius */
--lumo-border-radius-s: 0.25em; /* Checkbox, badge, date-picker year indicator, etc */
--lumo-border-radius-m: var(--lumo-border-radius, 0.25em); /* Button, text field, menu overlay, etc */
--lumo-border-radius-l: 0.5em; /* Dialog, notification, etc */
/* Shadow */
--lumo-box-shadow-xs: 0 1px 4px -1px var(--lumo-shade-50pct);
--lumo-box-shadow-s: 0 2px 4px -1px var(--lumo-shade-20pct), 0 3px 12px -1px var(--lumo-shade-30pct);
--lumo-box-shadow-m: 0 2px 6px -1px var(--lumo-shade-20pct), 0 8px 24px -4px var(--lumo-shade-40pct);
--lumo-box-shadow-l: 0 3px 18px -2px var(--lumo-shade-20pct), 0 12px 48px -6px var(--lumo-shade-40pct);
--lumo-box-shadow-xl: 0 4px 24px -3px var(--lumo-shade-20pct), 0 18px 64px -8px var(--lumo-shade-40pct);
/* Clickable element cursor */
--lumo-clickable-cursor: default;
}