UNPKG

@reown/appkit-scaffold-ui

Version:

The full stack toolkit to build onchain app UX.

122 lines (104 loc) 2.7 kB
import { css } from 'lit'; export default css ` wui-flex { width: 100%; } :host > wui-flex:first-child { transform: translateY(calc(var(--wui-spacing-xxs) * -1)); } wui-icon-link { margin-right: calc(var(--wui-icon-box-size-md) * -1); } wui-notice-card { margin-bottom: var(--wui-spacing-3xs); } wui-list-item > wui-text { flex: 1; } w3m-transactions-view { max-height: 200px; } .tab-content-container { height: 300px; overflow-y: auto; overflow-x: hidden; scrollbar-width: none; } .tab-content-container::-webkit-scrollbar { display: none; } .account-button { width: auto; border: none; display: flex; align-items: center; justify-content: center; gap: var(--wui-spacing-s); height: 48px; padding: var(--wui-spacing-xs); padding-right: var(--wui-spacing-s); box-shadow: inset 0 0 0 1px var(--wui-color-gray-glass-002); background-color: var(--wui-color-gray-glass-002); border-radius: 24px; transition: background-color 0.2s linear; } .account-button:hover { background-color: var(--wui-color-gray-glass-005); } .avatar-container { position: relative; } wui-avatar.avatar { width: 32px; height: 32px; box-shadow: 0 0 0 2px var(--wui-color-gray-glass-005); } wui-wallet-switch { margin-top: var(--wui-spacing-xs); } wui-avatar.network-avatar { width: 16px; height: 16px; position: absolute; left: 100%; top: 100%; transform: translate(-75%, -75%); box-shadow: 0 0 0 2px var(--wui-color-gray-glass-005); } .account-links { display: flex; justify-content: space-between; align-items: center; } .account-links wui-flex { cursor: pointer; display: flex; align-items: center; justify-content: center; flex: 1; background: red; align-items: center; justify-content: center; height: 48px; padding: 10px; flex: 1 0 0; border-radius: var(--XS, 16px); border: 1px solid var(--dark-accent-glass-010, rgba(71, 161, 255, 0.1)); background: var(--dark-accent-glass-010, rgba(71, 161, 255, 0.1)); transition: background-color var(--wui-ease-out-power-1) var(--wui-duration-md), opacity var(--wui-ease-out-power-1) var(--wui-duration-md); will-change: background-color, opacity; } .account-links wui-flex:hover { background: var(--dark-accent-glass-015, rgba(71, 161, 255, 0.15)); } .account-links wui-flex wui-icon { width: var(--S, 20px); height: var(--S, 20px); } .account-links wui-flex wui-icon svg path { stroke: #667dff; } `; //# sourceMappingURL=styles.js.map