@vaadin/vaadin-lumo-styles
Version:
Lumo is a design system foundation for modern web applications, used by Vaadin components
47 lines (40 loc) • 1.02 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/
*/
@media lumo_mixins_field-button {
[part$='button'] {
flex: none;
width: 1em;
height: 1em;
line-height: 1;
font-size: var(--lumo-icon-size-m);
text-align: center;
color: var(--lumo-contrast-60pct);
transition: 0.2s color;
cursor: var(--lumo-clickable-cursor);
}
[part$='button']:hover {
color: var(--lumo-contrast-90pct);
}
:host([disabled]) [part$='button'],
:host([readonly]) [part$='button'] {
color: var(--lumo-contrast-20pct);
cursor: default;
}
[part$='button']::before {
font-family: 'lumo-icons';
display: block;
}
[part~='clear-button'] {
display: none;
cursor: default;
}
[part~='clear-button']::before {
content: '\2715';
}
:host([clear-button-visible][has-value]:not([disabled]):not([readonly])) [part~='clear-button'] {
display: block;
}
}