@reown/appkit-ui
Version:
#### 🔗 [Website](https://reown.com/appkit)
62 lines (56 loc) • 1.86 kB
JavaScript
import { css } from 'lit';
export default css `
:host {
position: relative;
display: inline-block;
}
input {
width: 50px;
height: 50px;
background: var(--wui-color-gray-glass-010);
border-radius: var(--wui-border-radius-xs);
border: 1px solid var(--wui-color-gray-glass-005);
font-family: var(--wui-font-family);
font-size: var(--wui-font-size-large);
font-weight: var(--wui-font-weight-regular);
letter-spacing: var(--wui-letter-spacing-large);
text-align: center;
color: var(--wui-color-fg-100);
caret-color: var(--wui-color-accent-100);
transition:
background-color var(--wui-ease-inout-power-1) var(--wui-duration-md),
border-color var(--wui-ease-inout-power-1) var(--wui-duration-md),
box-shadow var(--wui-ease-inout-power-1) var(--wui-duration-md);
will-change: background-color, border-color, box-shadow;
box-sizing: border-box;
-webkit-appearance: none;
-moz-appearance: textfield;
padding: 0px;
}
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
-webkit-appearance: none;
margin: 0;
}
input[type='number'] {
-moz-appearance: textfield;
}
input:disabled {
cursor: not-allowed;
border: 1px solid var(--wui-color-gray-glass-010);
background: var(--wui-color-gray-glass-005);
}
input:focus:enabled {
background-color: var(--wui-color-gray-glass-015);
border: 1px solid var(--wui-color-accent-100);
-webkit-box-shadow: 0px 0px 0px 4px var(--wui-box-shadow-blue);
-moz-box-shadow: 0px 0px 0px 4px var(--wui-box-shadow-blue);
box-shadow: 0px 0px 0px 4px var(--wui-box-shadow-blue);
}
@media (hover: hover) and (pointer: fine) {
input:hover:enabled {
background-color: var(--wui-color-gray-glass-015);
}
}
`;
//# sourceMappingURL=styles.js.map