67 lines
2.0 KiB
CSS
67 lines
2.0 KiB
CSS
@import "tailwindcss";
|
|
|
|
@theme {
|
|
--font-mono:
|
|
ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas,
|
|
"Liberation Mono", monospace;
|
|
--color-bg: #ffffff;
|
|
--color-fg: #000000;
|
|
--color-muted: #666666;
|
|
--color-border: #000000;
|
|
--color-border-light: #cccccc;
|
|
--color-hover: #eeeeee;
|
|
--color-well: #e8e8e8;
|
|
--color-danger-well: #fef2f2;
|
|
--color-section: #dddddd;
|
|
}
|
|
|
|
html.dark {
|
|
--color-bg: #000000;
|
|
--color-fg: #ffffff;
|
|
--color-muted: #aaaaaa;
|
|
--color-border: #ffffff;
|
|
--color-border-light: #444444;
|
|
--color-hover: #222222;
|
|
--color-well: #1a1a1a;
|
|
--color-danger-well: #2a0a0a;
|
|
--color-section: #2a2a2a;
|
|
}
|
|
|
|
body {
|
|
width: 396px;
|
|
overflow-x: hidden;
|
|
}
|
|
|
|
/* Copy-flash feedback: inverts colors then fades back */
|
|
.copy-flash-active {
|
|
background-color: var(--color-fg) !important;
|
|
color: var(--color-bg) !important;
|
|
transition: none;
|
|
}
|
|
|
|
.copy-flash-fade {
|
|
transition:
|
|
background-color 225ms ease-out,
|
|
color 225ms ease-out;
|
|
}
|
|
|
|
/* An address is one atomic string, so it gets a row of its own and never
|
|
* breaks across lines. A wrapped address reads as two shorter strings, and
|
|
* two shorter strings are exactly what an address-poisoning attack needs
|
|
* the user to compare instead of the whole thing. Every view that shows an
|
|
* address puts it in one of these, alone: the colour dot, the wallet title,
|
|
* the ENS name and the explorer link all live on their own line above, so
|
|
* nothing competes with the 42 characters for width.
|
|
*
|
|
* overflow-x is the escape hatch, not the mechanism. The row is wide enough
|
|
* for a full address at every nesting depth the popup uses; if that ever
|
|
* stops being true — a font with wider glyphs, a browser zoom — the row
|
|
* scrolls and the user can still reach the last character, rather than the
|
|
* tail being clipped away by #app's overflow-x-hidden with nothing to say
|
|
* it happened. tests/e2e asserts the scroll is never actually needed. */
|
|
.am-address {
|
|
display: block;
|
|
white-space: nowrap;
|
|
overflow-x: auto;
|
|
}
|