@reown/appkit-ui
Version:
#### 🔗 [Website](https://reown.com/appkit)
105 lines (90 loc) • 2.34 kB
JavaScript
import { css } from 'lit';
export default css `
:host {
display: block;
}
button {
border-radius: var(--wui-border-radius-3xl);
background: var(--wui-color-gray-glass-002);
display: flex;
gap: var(--wui-spacing-xs);
padding: var(--wui-spacing-3xs) var(--wui-spacing-xs) var(--wui-spacing-3xs)
var(--wui-spacing-xs);
border: 1px solid var(--wui-color-gray-glass-005);
}
button:disabled {
background: var(--wui-color-gray-glass-015);
}
button:disabled > wui-text {
color: var(--wui-color-gray-glass-015);
}
button:disabled > wui-flex > wui-text {
color: var(--wui-color-gray-glass-015);
}
button:disabled > wui-image,
button:disabled > wui-flex > wui-avatar {
filter: grayscale(1);
}
button:has(wui-image) {
padding: var(--wui-spacing-3xs) var(--wui-spacing-3xs) var(--wui-spacing-3xs)
var(--wui-spacing-xs);
}
wui-text {
color: var(--wui-color-fg-100);
}
wui-flex > wui-text {
color: var(--wui-color-fg-200);
}
wui-image,
wui-icon-box {
border-radius: var(--wui-border-radius-3xl);
width: 24px;
height: 24px;
box-shadow: 0 0 0 2px var(--wui-color-gray-glass-005);
}
wui-flex {
border-radius: var(--wui-border-radius-3xl);
border: 1px solid var(--wui-color-gray-glass-005);
background: var(--wui-color-gray-glass-005);
padding: 4px var(--wui-spacing-m) 4px var(--wui-spacing-xxs);
}
button.local-no-balance {
border-radius: 0px;
border: none;
background: transparent;
}
wui-avatar {
width: 20px;
height: 20px;
box-shadow: 0 0 0 2px var(--wui-color-accent-glass-010);
}
@media (max-width: 500px) {
button {
gap: 0px;
padding: var(--wui-spacing-3xs) var(--wui-spacing-xs) !important;
height: 32px;
}
wui-image,
wui-icon-box,
button > wui-text {
visibility: hidden;
width: 0px;
height: 0px;
}
button {
border-radius: 0px;
border: none;
background: transparent;
padding: 0px;
}
}
@media (hover: hover) and (pointer: fine) {
button:hover:enabled > wui-flex > wui-text {
color: var(--wui-color-fg-175);
}
button:active:enabled > wui-flex > wui-text {
color: var(--wui-color-fg-175);
}
}
`;
//# sourceMappingURL=styles.js.map