diff --git a/web/assets/colors_and_type.css b/web/assets/colors_and_type.css deleted file mode 100644 index 9574df8..0000000 --- a/web/assets/colors_and_type.css +++ /dev/null @@ -1,261 +0,0 @@ -/* ========================================================================= - 岩美 Design System — Foundations - Tokens for color, type, spacing, radius, shadow. - Import once at root: - ========================================================================= */ - -:root { - color-scheme: light; - - /* ---------- Brand: Primary (Slate Blue) ---------- */ - /* Trustworthy enterprise blue with a slight slate cast. */ - --brand-50: #EEF4FB; - --brand-100: #D6E5F5; - --brand-200: #ADC9EA; - --brand-300: #7FA8DA; - --brand-400: #4F86C6; - --brand-500: #2563AC; /* Primary action */ - --brand-600: #1B4F8E; /* Hover */ - --brand-700: #154072; /* Pressed */ - --brand-800: #0F3057; - --brand-900: #0A1F3B; /* Brand ink — headers, logo on light bg */ - - /* ---------- Neutrals (cool slate gray) ---------- */ - --gray-0: #FFFFFF; - --gray-25: #FBFCFD; - --gray-50: #F5F7FA; - --gray-100: #ECEFF4; - --gray-200: #DCE2EB; - --gray-300: #C2CAD6; - --gray-400: #99A3B3; - --gray-500: #6E7888; - --gray-600: #4F5867; - --gray-700: #353C48; - --gray-800: #232934; - --gray-900: #141821; - - /* ---------- Accent (bordeaux / 酒红) ---------- */ - /* Used sparingly: brand context cue (wine), key highlights, marketing only. */ - --accent-50: #FAEEF0; - --accent-100: #F1D2D7; - --accent-300: #C97B86; - --accent-500: #8B2331; - --accent-700: #5F1621; - - /* ---------- Semantic ---------- */ - --success-50: #E8F5EE; - --success-500: #2E8B57; - --success-700: #1F6B41; - - --warning-50: #FFF4DB; - --warning-500: #E08E00; - --warning-700: #A66700; - - --danger-50: #FDECEC; - --danger-500: #D14343; - --danger-700: #9E2A2A; - - --info-50: #E5F1FB; - --info-500: #2F7BD0; - --info-700: #1F5C9F; - - /* ---------- Semantic foreground / background ---------- */ - --bg-app: var(--gray-50); - --bg-surface: var(--gray-0); - --bg-raised: var(--gray-0); - --bg-sunken: var(--gray-100); - --bg-overlay: rgba(20, 24, 33, 0.45); - - --fg-default: var(--gray-800); - --fg-muted: var(--gray-600); - --fg-subtle: var(--gray-500); - --fg-disabled: var(--gray-400); - --fg-on-brand: #FFFFFF; - --fg-link: var(--brand-500); - - --border-subtle: var(--gray-100); - --border-default: var(--gray-200); - --border-strong: var(--gray-300); - --border-focus: var(--brand-500); - - /* ---------- Typography ---------- */ - /* Chinese-primary stack with PingFang on macOS/iOS, Microsoft YaHei on Windows, - Noto Sans SC as web fallback (loaded via Google Fonts in index files). */ - --font-sans: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", - "Source Han Sans CN", "Noto Sans SC", -apple-system, - BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; - --font-display: var(--font-sans); - --font-mono: "JetBrains Mono", "SF Mono", "Roboto Mono", Menlo, Consolas, - "Microsoft YaHei", monospace; - - /* Type scale — mobile-first, scales up for desktop dashboards */ - --text-2xs: 11px; - --text-xs: 12px; - --text-sm: 13px; - --text-md: 14px; /* dashboard body default */ - --text-lg: 16px; - --text-xl: 18px; - --text-2xl: 22px; - --text-3xl: 28px; - --text-4xl: 36px; - --text-5xl: 48px; - - --leading-tight: 1.25; - --leading-snug: 1.4; - --leading-normal: 1.55; - --leading-loose: 1.75; - - --weight-regular: 400; - --weight-medium: 500; - --weight-semibold: 600; - --weight-bold: 700; - - /* Tracking — Chinese reads better with subtle positive tracking */ - --tracking-tight: -0.01em; - --tracking-normal: 0; - --tracking-wide: 0.02em; - --tracking-cn-display: 0.04em; /* Chinese display headers */ - - /* ---------- Spacing (4px base) ---------- */ - --space-0: 0; - --space-1: 4px; - --space-2: 8px; - --space-3: 12px; - --space-4: 16px; - --space-5: 20px; - --space-6: 24px; - --space-8: 32px; - --space-10: 40px; - --space-12: 48px; - --space-16: 64px; - --space-20: 80px; - --space-24: 96px; - - /* ---------- Radius — restrained, enterprise-grade ---------- */ - --radius-xs: 2px; - --radius-sm: 4px; - --radius-md: 6px; /* default for inputs, buttons, badges */ - --radius-lg: 10px; /* cards */ - --radius-xl: 14px; - --radius-pill: 999px; - - /* ---------- Elevation — soft, neutral, no colored shadows ---------- */ - --shadow-xs: 0 1px 2px rgba(20, 24, 33, 0.04); - --shadow-sm: 0 1px 2px rgba(20, 24, 33, 0.06), 0 1px 3px rgba(20, 24, 33, 0.04); - --shadow-md: 0 2px 4px rgba(20, 24, 33, 0.06), 0 4px 8px rgba(20, 24, 33, 0.05); - --shadow-lg: 0 4px 12px rgba(20, 24, 33, 0.08), 0 12px 24px rgba(20, 24, 33, 0.06); - --shadow-xl: 0 8px 20px rgba(20, 24, 33, 0.10), 0 20px 40px rgba(20, 24, 33, 0.08); - --shadow-inset: inset 0 1px 0 rgba(255,255,255,0.6), inset 0 -1px 0 rgba(20,24,33,0.04); - --ring-focus: 0 0 0 3px rgba(37, 99, 172, 0.22); - - /* ---------- Motion ---------- */ - --ease-standard: cubic-bezier(0.2, 0, 0, 1); - --ease-emphasized: cubic-bezier(0.2, 0, 0, 1.2); - --ease-decelerate: cubic-bezier(0, 0, 0.2, 1); - --duration-fast: 120ms; - --duration-base: 180ms; - --duration-slow: 240ms; - - /* ---------- Layout ---------- */ - --layout-sidebar: 240px; - --layout-sidebar-collapsed: 64px; - --layout-topbar: 56px; - --layout-content-max: 1440px; -} - -/* ========================================================================= - Semantic element styles — apply to base elements within design system docs. - These do NOT bleed into ui_kits / pages with their own styles. - ========================================================================= */ -.ds-typography { - font-family: var(--font-sans); - color: var(--fg-default); - font-feature-settings: "tnum" 1, "ss01" 1; - -webkit-font-smoothing: antialiased; - text-rendering: optimizeLegibility; -} - -.ds-typography h1, -.ds-h1 { - font-size: var(--text-4xl); - font-weight: var(--weight-semibold); - line-height: var(--leading-tight); - letter-spacing: var(--tracking-cn-display); - color: var(--brand-900); - margin: 0 0 var(--space-4); -} -.ds-typography h2, -.ds-h2 { - font-size: var(--text-3xl); - font-weight: var(--weight-semibold); - line-height: var(--leading-tight); - letter-spacing: var(--tracking-cn-display); - color: var(--brand-900); - margin: 0 0 var(--space-3); -} -.ds-typography h3, -.ds-h3 { - font-size: var(--text-2xl); - font-weight: var(--weight-semibold); - line-height: var(--leading-snug); - color: var(--gray-900); - margin: 0 0 var(--space-3); -} -.ds-typography h4, -.ds-h4 { - font-size: var(--text-xl); - font-weight: var(--weight-semibold); - line-height: var(--leading-snug); - color: var(--gray-900); - margin: 0 0 var(--space-2); -} -.ds-typography h5, -.ds-h5 { - font-size: var(--text-lg); - font-weight: var(--weight-semibold); - line-height: var(--leading-snug); - color: var(--gray-800); - margin: 0 0 var(--space-2); -} -.ds-typography p, -.ds-body { - font-size: var(--text-md); - font-weight: var(--weight-regular); - line-height: var(--leading-normal); - color: var(--fg-default); - margin: 0 0 var(--space-3); -} -.ds-typography small, -.ds-caption { - font-size: var(--text-xs); - color: var(--fg-muted); - line-height: var(--leading-snug); -} -.ds-typography code, -.ds-mono { - font-family: var(--font-mono); - font-size: 0.93em; - background: var(--gray-100); - padding: 1px 6px; - border-radius: var(--radius-sm); - color: var(--gray-800); -} -.ds-num { - font-variant-numeric: tabular-nums; - font-feature-settings: "tnum" 1; -} -.ds-label { - font-size: var(--text-xs); - font-weight: var(--weight-medium); - letter-spacing: var(--tracking-wide); - text-transform: none; /* Chinese never uppercases */ - color: var(--fg-muted); -} - -/* Focus ring shared across the system */ -.ds-focusable:focus-visible, -:focus-visible { - outline: none; - box-shadow: var(--ring-focus); - border-color: var(--border-focus); -} diff --git a/web/assets/features-approval.css b/web/assets/features-approval.css index b37da45..c30d490 100644 --- a/web/assets/features-approval.css +++ b/web/assets/features-approval.css @@ -1,108 +1,3 @@ -* { box-sizing: border-box; } -html, body { - margin: 0; padding: 0; - font-family: var(--font-sans); color: var(--fg-default); - background: var(--bg-surface); - -webkit-font-smoothing: antialiased; - text-rendering: optimizeLegibility; - font-feature-settings: "tnum" 1; -} -img, svg { display: block; max-width: 100%; } -a { color: inherit; text-decoration: none; } -button { font-family: inherit; cursor: pointer; } - -.btn { - display: inline-flex; align-items: center; gap: 8px; - height: 40px; padding: 0 18px; - border-radius: var(--radius-md); - font-size: var(--text-md); font-weight: 500; - border: 1px solid transparent; - transition: background var(--duration-fast) var(--ease-standard); - white-space: nowrap; -} -.btn-primary { background: var(--brand-500); color: #fff; } -.btn-primary:hover { background: var(--brand-600); } -.btn-secondary { background: var(--gray-0); color: var(--brand-900); border-color: var(--border-default); } -.btn-secondary:hover { background: var(--gray-50); border-color: var(--border-strong); } -.btn-ghost { background: transparent; color: var(--fg-default); } -.btn-ghost:hover { background: var(--gray-100); } -.btn-lg { height: 48px; padding: 0 24px; font-size: var(--text-lg); } -.btn .icon { width: 18px; height: 18px; } - -.container { max-width: 1280px; margin: 0 auto; padding: 0 32px; } -.section { padding: 96px 0; } -.eyebrow { - font-size: var(--text-xs); font-weight: 600; - letter-spacing: 0.12em; text-transform: uppercase; - color: var(--brand-500); margin: 0 0 12px; -} - -/* Top Nav */ -.topnav { position: sticky; top: 0; z-index: 50; background: rgba(255,255,255,0.85); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); border-bottom: 1px solid var(--border-subtle); } -.topnav-inner { height: 64px; display: flex; align-items: center; justify-content: space-between; max-width: 1440px; margin: 0 auto; padding: 0 32px; } -.topnav-brand { display: flex; align-items: center; gap: 10px; } -.topnav-brand img { height: 32px; } -.topnav-links { display: flex; align-items: center; gap: 4px; font-size: var(--text-md); color: var(--gray-700); } -.topnav-links a { padding: 8px 14px; border-radius: var(--radius-md); transition: background var(--duration-fast) var(--ease-standard); } -.topnav-links a:hover { background: var(--gray-100); color: var(--brand-900); } -.topnav-links a.active { color: var(--brand-500); background: var(--brand-50); } -.topnav-cta { display: flex; gap: 10px; align-items: center; } - -/* Nav user dropdown */ -.nav-user { position: relative; } -.nav-user-btn { - display: flex; align-items: center; gap: 8px; - height: 36px; padding: 0 12px 0 8px; - border-radius: var(--radius-md); - border: 1px solid var(--border-default); - background: var(--gray-0); - font-size: var(--text-sm); color: var(--gray-800); - cursor: pointer; - transition: background var(--duration-fast) var(--ease-standard); -} -.nav-user-btn:hover { background: var(--gray-50); } -.nav-avatar { - width: 22px; height: 22px; border-radius: 50%; - background: var(--brand-500); color: #fff; - font-size: 11px; font-weight: 700; - display: flex; align-items: center; justify-content: center; - flex-shrink: 0; -} -.nav-user-btn .icon { width: 14px; height: 14px; color: var(--fg-muted); } -.nav-dropdown { - display: none; position: absolute; top: calc(100% + 8px); right: 0; - min-width: 200px; - background: var(--gray-0); - border: 1px solid var(--border-default); - border-radius: var(--radius-lg); - box-shadow: var(--shadow-lg); - padding: 6px; - z-index: 100; -} -.nav-dropdown.open { display: block; } -.nav-dropdown-info { - padding: 8px 10px 10px; - border-bottom: 1px solid var(--border-subtle); - margin-bottom: 6px; -} -.nav-dropdown-name { font-size: var(--text-sm); font-weight: 600; color: var(--brand-900); } -.nav-dropdown-role { font-size: 11px; color: var(--fg-muted); margin-top: 2px; } -.nav-dropdown a, .nav-dropdown button { - display: flex; align-items: center; gap: 8px; - width: 100%; padding: 8px 10px; - border-radius: var(--radius-md); - font-size: var(--text-sm); color: var(--gray-700); - background: none; border: none; text-align: left; cursor: pointer; - transition: background var(--duration-fast) var(--ease-standard); -} -.nav-dropdown a:hover, .nav-dropdown button:hover { background: var(--gray-50); color: var(--brand-900); } -.nav-dropdown .icon { width: 15px; height: 15px; color: var(--fg-muted); } -.nav-dropdown .logout { color: var(--danger-600); } -.nav-dropdown .logout .icon { color: var(--danger-400); } - -/* ==================================================================== - HERO - ==================================================================== */ .feat-hero { position: relative; overflow: hidden; padding: 80px 0 72px; diff --git a/web/assets/features-inventory.css b/web/assets/features-inventory.css index eb15564..c13a80e 100644 --- a/web/assets/features-inventory.css +++ b/web/assets/features-inventory.css @@ -1,108 +1,3 @@ -* { box-sizing: border-box; } -html, body { - margin: 0; padding: 0; - font-family: var(--font-sans); color: var(--fg-default); - background: var(--bg-surface); - -webkit-font-smoothing: antialiased; - text-rendering: optimizeLegibility; - font-feature-settings: "tnum" 1; -} -img, svg { display: block; max-width: 100%; } -a { color: inherit; text-decoration: none; } -button { font-family: inherit; cursor: pointer; } - -.btn { - display: inline-flex; align-items: center; gap: 8px; - height: 40px; padding: 0 18px; - border-radius: var(--radius-md); - font-size: var(--text-md); font-weight: 500; - border: 1px solid transparent; - transition: background var(--duration-fast) var(--ease-standard); - white-space: nowrap; -} -.btn-primary { background: var(--brand-500); color: #fff; } -.btn-primary:hover { background: var(--brand-600); } -.btn-secondary { background: var(--gray-0); color: var(--brand-900); border-color: var(--border-default); } -.btn-secondary:hover { background: var(--gray-50); border-color: var(--border-strong); } -.btn-ghost { background: transparent; color: var(--fg-default); } -.btn-ghost:hover { background: var(--gray-100); } -.btn-lg { height: 48px; padding: 0 24px; font-size: var(--text-lg); } -.btn .icon { width: 18px; height: 18px; } - -.container { max-width: 1280px; margin: 0 auto; padding: 0 32px; } -.section { padding: 96px 0; } -.eyebrow { - font-size: var(--text-xs); font-weight: 600; - letter-spacing: 0.12em; text-transform: uppercase; - color: var(--brand-500); margin: 0 0 12px; -} - -/* Top Nav */ -.topnav { position: sticky; top: 0; z-index: 50; background: rgba(255,255,255,0.85); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); border-bottom: 1px solid var(--border-subtle); } -.topnav-inner { height: 64px; display: flex; align-items: center; justify-content: space-between; max-width: 1440px; margin: 0 auto; padding: 0 32px; } -.topnav-brand { display: flex; align-items: center; gap: 10px; } -.topnav-brand img { height: 32px; } -.topnav-links { display: flex; align-items: center; gap: 4px; font-size: var(--text-md); color: var(--gray-700); } -.topnav-links a { padding: 8px 14px; border-radius: var(--radius-md); transition: background var(--duration-fast) var(--ease-standard); } -.topnav-links a:hover { background: var(--gray-100); color: var(--brand-900); } -.topnav-links a.active { color: var(--brand-500); background: var(--brand-50); } -.topnav-cta { display: flex; gap: 10px; align-items: center; } - -/* Nav user dropdown */ -.nav-user { position: relative; } -.nav-user-btn { - display: flex; align-items: center; gap: 8px; - height: 36px; padding: 0 12px 0 8px; - border-radius: var(--radius-md); - border: 1px solid var(--border-default); - background: var(--gray-0); - font-size: var(--text-sm); color: var(--gray-800); - cursor: pointer; - transition: background var(--duration-fast) var(--ease-standard); -} -.nav-user-btn:hover { background: var(--gray-50); } -.nav-avatar { - width: 22px; height: 22px; border-radius: 50%; - background: var(--brand-500); color: #fff; - font-size: 11px; font-weight: 700; - display: flex; align-items: center; justify-content: center; - flex-shrink: 0; -} -.nav-user-btn .icon { width: 14px; height: 14px; color: var(--fg-muted); } -.nav-dropdown { - display: none; position: absolute; top: calc(100% + 8px); right: 0; - min-width: 200px; - background: var(--gray-0); - border: 1px solid var(--border-default); - border-radius: var(--radius-lg); - box-shadow: var(--shadow-lg); - padding: 6px; - z-index: 100; -} -.nav-dropdown.open { display: block; } -.nav-dropdown-info { - padding: 8px 10px 10px; - border-bottom: 1px solid var(--border-subtle); - margin-bottom: 6px; -} -.nav-dropdown-name { font-size: var(--text-sm); font-weight: 600; color: var(--brand-900); } -.nav-dropdown-role { font-size: 11px; color: var(--fg-muted); margin-top: 2px; } -.nav-dropdown a, .nav-dropdown button { - display: flex; align-items: center; gap: 8px; - width: 100%; padding: 8px 10px; - border-radius: var(--radius-md); - font-size: var(--text-sm); color: var(--gray-700); - background: none; border: none; text-align: left; cursor: pointer; - transition: background var(--duration-fast) var(--ease-standard); -} -.nav-dropdown a:hover, .nav-dropdown button:hover { background: var(--gray-50); color: var(--brand-900); } -.nav-dropdown .icon { width: 15px; height: 15px; color: var(--fg-muted); } -.nav-dropdown .logout { color: var(--danger-600); } -.nav-dropdown .logout .icon { color: var(--danger-400); } - -/* ==================================================================== - HERO - ==================================================================== */ .feat-hero { position: relative; overflow: hidden; padding: 80px 0 72px; diff --git a/web/assets/shared.css b/web/assets/shared.css deleted file mode 100644 index 20e8f9f..0000000 --- a/web/assets/shared.css +++ /dev/null @@ -1,183 +0,0 @@ -/* ================================================================ - shared.css — 跨页面公用样式 - 设计 token 由 colors_and_type.css 提供 - ================================================================ */ - -* { box-sizing: border-box; } -html, body { - margin: 0; padding: 0; - font-family: var(--font-sans); - color: var(--fg-default); - background: var(--gray-25); - -webkit-font-smoothing: antialiased; - text-rendering: optimizeLegibility; - font-feature-settings: "tnum" 1; -} -img, svg { display: block; max-width: 100%; } -a { color: inherit; text-decoration: none; } -button { font-family: inherit; cursor: pointer; } - -/* ---------------------------------------------------------------- - Buttons - ---------------------------------------------------------------- */ -.btn { - display: inline-flex; align-items: center; gap: 8px; - height: 40px; padding: 0 18px; - border-radius: var(--radius-md); - font-size: var(--text-md); font-weight: 500; - border: 1px solid transparent; - transition: background var(--duration-fast) var(--ease-standard), - border-color var(--duration-fast) var(--ease-standard), - color var(--duration-fast) var(--ease-standard); - white-space: nowrap; -} -.btn-primary { background: var(--brand-500); color: #fff; } -.btn-primary:hover { background: var(--brand-600); } -.btn-primary:active { background: var(--brand-700); } -.btn-secondary { background: var(--gray-0); color: var(--brand-900); border-color: var(--border-default); } -.btn-secondary:hover { background: var(--gray-50); border-color: var(--border-strong); } -.btn-ghost { background: transparent; color: var(--fg-default); } -.btn-ghost:hover { background: var(--gray-100); } -.btn-lg { height: 48px; padding: 0 24px; font-size: var(--text-lg); } -.btn .icon { width: 18px; height: 18px; } - -/* ---------------------------------------------------------------- - Layout helpers - ---------------------------------------------------------------- */ -.container { - max-width: 1280px; - margin: 0 auto; - padding: 0 32px; -} -.section { padding: 96px 0; } -.section-tight { padding: 64px 0; } -.eyebrow { - font-size: var(--text-xs); - font-weight: 600; - letter-spacing: 0.12em; - color: var(--brand-500); - text-transform: uppercase; - margin: 0 0 12px; -} -.section-title { - font-size: var(--text-4xl); - font-weight: 600; - line-height: 1.18; - letter-spacing: var(--tracking-cn-display); - color: var(--brand-900); - margin: 0 0 16px; - max-width: 720px; -} -.section-sub { - font-size: var(--text-lg); - line-height: 1.6; - color: var(--fg-muted); - margin: 0; - max-width: 640px; -} - -/* ---------------------------------------------------------------- - Top Nav - ---------------------------------------------------------------- */ -.topnav { - position: sticky; top: 0; z-index: 50; - background: rgba(255,255,255,0.85); - backdrop-filter: blur(12px); - -webkit-backdrop-filter: blur(12px); - border-bottom: 1px solid var(--border-subtle); -} -.topnav-inner { - height: 64px; - display: flex; align-items: center; justify-content: space-between; - max-width: 1440px; margin: 0 auto; padding: 0 32px; -} -.topnav-brand { display: flex; align-items: center; gap: 10px; } -.topnav-brand img { height: 32px; } -.topnav-links { - display: flex; align-items: center; gap: 4px; - font-size: var(--text-md); color: var(--gray-700); -} -.topnav-links a { - padding: 8px 14px; - border-radius: var(--radius-md); - transition: background var(--duration-fast) var(--ease-standard); -} -.topnav-links a:hover { background: var(--gray-100); color: var(--brand-900); } -.topnav-cta { display: flex; gap: 10px; align-items: center; } - -/* Nav user dropdown */ -.nav-user { position: relative; } -.nav-user-btn { - display: flex; align-items: center; gap: 8px; - height: 36px; padding: 0 12px; - background: var(--gray-0); border: 1px solid var(--border-default); - border-radius: var(--radius-pill); cursor: pointer; - font-size: var(--text-md); color: var(--gray-800); font-weight: 500; - transition: border-color var(--duration-fast) var(--ease-standard); -} -.nav-user-btn:hover { border-color: var(--border-strong); } -.nav-avatar { - width: 22px; height: 22px; border-radius: 50%; - background: var(--brand-500); color: #fff; - display: grid; place-items: center; - font-size: 10px; font-weight: 700; flex-shrink: 0; -} -.nav-user-btn .icon { width: 14px; height: 14px; color: var(--fg-muted); } -.nav-dropdown { - display: none; position: absolute; top: calc(100% + 8px); right: 0; - min-width: 160px; background: var(--gray-0); - border: 1px solid var(--border-default); border-radius: var(--radius-lg); - box-shadow: var(--shadow-lg); overflow: hidden; z-index: 100; -} -.nav-dropdown.open { display: block; } -.nav-dropdown a, .nav-dropdown button { - display: flex; align-items: center; gap: 8px; - width: 100%; padding: 10px 14px; - font-size: var(--text-sm); color: var(--gray-800); - background: none; border: none; cursor: pointer; - text-decoration: none; font-family: inherit; - transition: background var(--duration-fast) var(--ease-standard); -} -.nav-dropdown a:hover, .nav-dropdown button:hover { background: var(--gray-50); } -.nav-dropdown .icon { width: 14px; height: 14px; color: var(--fg-muted); } -.nav-dropdown-divider { height: 1px; background: var(--border-subtle); margin: 4px 0; } -.nav-dropdown .logout { color: var(--danger-600); } - -/* ---------------------------------------------------------------- - Footer - ---------------------------------------------------------------- */ -footer { - background: var(--gray-25); - border-top: 1px solid var(--border-subtle); - padding: 64px 0 40px; -} -.footer-grid { - display: grid; - grid-template-columns: 1.5fr repeat(4, 1fr); - gap: 48px; - margin-bottom: 48px; -} -.footer-brand img { height: 32px; margin-bottom: 16px; } -.footer-brand p { margin: 0 0 16px; max-width: 320px; line-height: 1.6; color: var(--fg-muted); } -.footer-contact { font-size: var(--text-sm); color: var(--gray-700); line-height: 1.8; } -.footer-col h5 { - font-size: var(--text-xs); font-weight: 600; - color: var(--brand-900); letter-spacing: 0.06em; - margin: 0 0 16px; text-transform: uppercase; -} -.footer-col ul { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 10px; } -.footer-col li a { color: var(--gray-600); } -.footer-col li a:hover { color: var(--brand-500); } -.footer-bottom { - border-top: 1px solid var(--border-subtle); padding-top: 24px; - display: flex; justify-content: space-between; - font-size: var(--text-xs); color: var(--fg-subtle); -} - -/* ---------------------------------------------------------------- - Responsive - ---------------------------------------------------------------- */ -@media (max-width: 1024px) { - .footer-grid { grid-template-columns: 1fr 1fr; } - .container { padding: 0 20px; } -} diff --git a/web/scan.html b/web/scan.html index 4bfc65b..a128cbf 100644 --- a/web/scan.html +++ b/web/scan.html @@ -5,7 +5,7 @@ 商品验真 — 岩美 - +