package.src.vaadin-radio-button-styles.js Maven / Gradle / Ivy
/**
* @license
* Copyright (c) 2017 - 2024 Vaadin Ltd.
* This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
*/
import { css } from '@vaadin/vaadin-themable-mixin/vaadin-themable-mixin.js';
export const radioButtonStyles = css`
:host {
display: inline-block;
}
:host([hidden]) {
display: none !important;
}
:host([disabled]) {
-webkit-tap-highlight-color: transparent;
}
.vaadin-radio-button-container {
display: grid;
grid-template-columns: auto 1fr;
align-items: baseline;
}
[part='radio'],
::slotted(input),
::slotted(label) {
grid-row: 1;
}
[part='radio'],
::slotted(input) {
grid-column: 1;
}
[part='radio'] {
width: var(--vaadin-radio-button-size, 1em);
height: var(--vaadin-radio-button-size, 1em);
--_input-border-width: var(--vaadin-input-field-border-width, 0);
--_input-border-color: var(--vaadin-input-field-border-color, transparent);
box-shadow: inset 0 0 0 var(--_input-border-width, 0) var(--_input-border-color);
}
[part='radio']::before {
display: block;
content: '\\202F';
line-height: var(--vaadin-radio-button-size, 1em);
contain: paint;
}
/* visually hidden */
::slotted(input) {
opacity: 0;
cursor: inherit;
margin: 0;
align-self: stretch;
-webkit-appearance: none;
width: initial;
height: initial;
}
@media (forced-colors: active) {
[part='radio'] {
outline: 1px solid;
outline-offset: -1px;
}
:host([focused]) [part='radio'] {
outline-width: 2px;
}
:host([disabled]) [part='radio'] {
outline-color: GrayText;
}
}
`;
© 2015 - 2024 Weber Informatics LLC | Privacy Policy