fix: restore web3-tokens.css, fix import to ../tokens/index.css
This commit is contained in:
1
.npmrc
Normal file
1
.npmrc
Normal file
@ -0,0 +1 @@
|
|||||||
|
//registry.npmjs.org/:_authToken=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
|
||||||
@ -2,7 +2,7 @@
|
|||||||
Web3 Style Guide — Base Reset & Global Styles
|
Web3 Style Guide — Base Reset & Global Styles
|
||||||
========================================================================== */
|
========================================================================== */
|
||||||
|
|
||||||
@import "./web3-tokens.css";
|
@import "../tokens/index.css";
|
||||||
|
|
||||||
:root { color: var(--color-text-primary); background: var(--color-bg-primary); font-family: var(--font-family-base); }
|
:root { color: var(--color-text-primary); background: var(--color-bg-primary); font-family: var(--font-family-base); }
|
||||||
* { box-sizing: border-box; }
|
* { box-sizing: border-box; }
|
||||||
|
|||||||
89
src/css/web3-tokens.css
Normal file
89
src/css/web3-tokens.css
Normal file
@ -0,0 +1,89 @@
|
|||||||
|
/* Web3 Design Tokens — copied from web3-style-guide for local use */
|
||||||
|
:root {
|
||||||
|
--color-bg-primary: #0c1020;
|
||||||
|
--color-bg-secondary: rgba(21, 27, 48, 0.82);
|
||||||
|
--color-bg-elevated: rgba(6, 10, 22, 0.28);
|
||||||
|
--color-bg-input: rgba(8, 12, 25, 0.62);
|
||||||
|
|
||||||
|
--color-accent-green: #59d8ae;
|
||||||
|
--color-accent-green-muted: rgba(89, 216, 174, 0.13);
|
||||||
|
--color-accent-green-bg: rgba(89, 216, 174, 0.12);
|
||||||
|
|
||||||
|
--color-accent-blue: #6f8bff;
|
||||||
|
--color-accent-blue-hover: #819aff;
|
||||||
|
--color-accent-blue-muted: rgba(119, 148, 255, 0.17);
|
||||||
|
--color-accent-blue-border: rgba(119, 148, 255, 0.55);
|
||||||
|
|
||||||
|
--color-text-primary: #e7eaf1;
|
||||||
|
--color-text-heading: #f6f7fb;
|
||||||
|
--color-text-subheading: #f3f5f9;
|
||||||
|
--color-text-strong: #eff2f8;
|
||||||
|
--color-text-body: #b9c1d1;
|
||||||
|
--color-text-muted: #8e98aa;
|
||||||
|
--color-text-input: #f4f6fb;
|
||||||
|
--color-text-placeholder: #738097;
|
||||||
|
--color-text-code: #cbd5ff;
|
||||||
|
|
||||||
|
--color-error: #ffb4bb;
|
||||||
|
--color-error-bg: rgba(244, 99, 112, 0.12);
|
||||||
|
--color-success: #9ee8ce;
|
||||||
|
--color-success-bg: rgba(89, 216, 174, 0.12);
|
||||||
|
|
||||||
|
--color-border-subtle: rgba(255, 255, 255, 0.09);
|
||||||
|
--color-border-input: rgba(255, 255, 255, 0.13);
|
||||||
|
|
||||||
|
--font-family-base: Inter, ui-sans-serif, system-ui, -apple-system,
|
||||||
|
BlinkMacSystemFont, 'Segoe UI', sans-serif;
|
||||||
|
--font-family-mono: 'SFMono-Regular', Consolas, monospace;
|
||||||
|
|
||||||
|
--font-size-xs: 0.78rem;
|
||||||
|
--font-size-sm: 0.82rem;
|
||||||
|
--font-size-base: 0.88rem;
|
||||||
|
--font-size-lg: 1.05rem;
|
||||||
|
--font-size-xl: clamp(1.45rem, 3vw, 2rem);
|
||||||
|
|
||||||
|
--font-weight-regular: 400;
|
||||||
|
--font-weight-medium: 570;
|
||||||
|
--font-weight-semibold: 620;
|
||||||
|
--font-weight-bold: 680;
|
||||||
|
--font-weight-heading: 760;
|
||||||
|
|
||||||
|
--line-height-body: 1.55;
|
||||||
|
--line-height-tight: 1.2;
|
||||||
|
--line-height-code: 1.45;
|
||||||
|
|
||||||
|
--letter-spacing-tight: -0.045em;
|
||||||
|
--letter-spacing-normal: -0.015em;
|
||||||
|
--letter-spacing-logo: -0.03em;
|
||||||
|
--letter-spacing-micro: -0.01em;
|
||||||
|
|
||||||
|
--container-max-width: 1120px;
|
||||||
|
--container-padding-x: 28px;
|
||||||
|
--container-padding-y: 48px;
|
||||||
|
--container-padding-bottom: 72px;
|
||||||
|
|
||||||
|
--header-height: 72px;
|
||||||
|
--header-padding-x: 5vw;
|
||||||
|
--header-gap: 32px;
|
||||||
|
|
||||||
|
--card-padding: clamp(22px, 4vw, 32px);
|
||||||
|
--card-gap: 20px;
|
||||||
|
--card-radius: 16px;
|
||||||
|
--card-border-radius-mobile: 12px;
|
||||||
|
|
||||||
|
--btn-min-height: 42px;
|
||||||
|
--btn-padding-x: 15px;
|
||||||
|
--btn-padding-y: 10px;
|
||||||
|
--btn-radius: 8px;
|
||||||
|
|
||||||
|
--input-min-height: 44px;
|
||||||
|
--input-padding: 11px 12px;
|
||||||
|
--input-radius: 8px;
|
||||||
|
--input-textarea-height: 112px;
|
||||||
|
|
||||||
|
--footer-padding: 12px 5vw;
|
||||||
|
--footer-height: 100px;
|
||||||
|
|
||||||
|
--focus-ring-color: rgba(119, 148, 255, 0.17);
|
||||||
|
--focus-ring-width: 3px;
|
||||||
|
}
|
||||||
Reference in New Issue
Block a user