@reown/appkit-scaffold-ui
Version:
#### 🔗 [Website](https://reown.com/appkit)
89 lines (81 loc) • 2.08 kB
JavaScript
import { css } from 'lit';
export default css `
:host > wui-flex {
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
border-radius: var(--wui-border-radius-s);
background-color: var(--wui-color-gray-glass-002);
padding: var(--wui-spacing-xl);
padding-right: var(--wui-spacing-s);
width: 100%;
height: 100px;
box-sizing: border-box;
box-shadow: inset 0px 0px 0px 1px var(--wui-color-gray-glass-002);
position: relative;
transition: box-shadow var(--wui-ease-out-power-1) var(--wui-duration-lg);
will-change: background-color;
}
:host wui-flex.focus {
box-shadow: inset 0px 0px 0px 1px var(--wui-color-gray-glass-005);
}
:host > wui-flex .swap-input,
:host > wui-flex .swap-token-button {
z-index: 10;
}
:host > wui-flex .swap-input {
-webkit-mask-image: linear-gradient(
270deg,
transparent 0px,
transparent 8px,
black 24px,
black 25px,
black 32px,
black 100%
);
mask-image: linear-gradient(
270deg,
transparent 0px,
transparent 8px,
black 24px,
black 25px,
black 32px,
black 100%
);
}
:host > wui-flex .swap-input input {
background: none;
border: none;
height: 42px;
width: 100%;
font-size: 32px;
font-style: normal;
font-weight: 400;
line-height: 130%;
letter-spacing: -1.28px;
outline: none;
caret-color: var(--wui-color-accent-100);
color: var(--wui-color-fg-100);
padding: 0px;
}
:host > wui-flex .swap-input input:focus-visible {
outline: none;
}
:host > wui-flex .swap-input input::-webkit-outer-spin-button,
:host > wui-flex .swap-input input::-webkit-inner-spin-button {
-webkit-appearance: none;
margin: 0;
}
.max-value-button {
background-color: transparent;
border: none;
cursor: pointer;
color: var(--wui-color-gray-glass-020);
padding-left: 0px;
}
.market-value {
min-height: 18px;
}
`;
//# sourceMappingURL=styles.js.map