GenarrativeAI/Genarrative
5
0
Fork 0
Code Issues Pull Requests Actions 4 Packages Projects Releases Wiki Activity

1
Some checks failed
CI / verify (push) Has been cancelled
Details

Browse Source
This commit is contained in:
高物
2026-04-20 21:06:48 +08:00
parent 1c72066bab
commit 75944b1f1f
102 changed files with 9648 additions and 1540 deletions
Download Patch File Download Diff File Expand all files Collapse all files

105
src/index.css
View File

@@ -20,6 +20,18 @@
:root {
--ui-scale: clamp(0.78, 0.72 + 0.45vw, 1.06);
--platform-bottom-nav-height: 3.5rem;
--platform-bottom-nav-padding: 0.25rem;
--platform-bottom-nav-gap: 0.25rem;
--platform-bottom-nav-radius: 1.2rem;
--platform-bottom-nav-button-radius: 1rem;
--platform-bottom-nav-icon-size: 1.05rem;
--platform-bottom-nav-icon-shell-size: 1.55rem;
--platform-bottom-nav-label-size: 11px;
--platform-bottom-nav-label-tracking: 0.18em;
--platform-bottom-nav-content-gap: 0.22rem;
--platform-bottom-nav-active-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08),
0 8px 18px rgba(255, 91, 132, 0.1);
}
body {
@@ -138,20 +150,20 @@ body {
color-scheme: light;
--platform-body-fill: radial-gradient(
circle at top left,
rgba(255, 108, 155, 0.16),
transparent 20%
rgba(255, 196, 214, 0.14),
transparent 24%
),
radial-gradient(
circle at 88% 4%,
rgba(255, 195, 150, 0.14),
transparent 18%
rgba(255, 222, 196, 0.12),
transparent 20%
),
radial-gradient(
circle at bottom,
rgba(255, 118, 162, 0.08),
transparent 22%
rgba(255, 214, 225, 0.08),
transparent 26%
),
linear-gradient(180deg, #fffafc 0%, #fffefe 48%, #fff5f8 100%);
linear-gradient(180deg, #fffdfd 0%, #fffefe 50%, #fff8fa 100%);
--platform-panel-shadow: 0 22px 60px rgba(215, 87, 134, 0.12),
0 8px 20px rgba(255, 255, 255, 0.82);
--platform-panel-fill: linear-gradient(
@@ -166,18 +178,28 @@ body {
);
--platform-hero-fill: linear-gradient(
135deg,
rgba(255, 31, 111, 0.96),
rgba(255, 135, 103, 0.92)
rgba(255, 139, 162, 0.9),
rgba(255, 184, 153, 0.88)
);
--platform-hero-glow-a: rgba(255, 255, 255, 0.22);
--platform-hero-glow-b: rgba(255, 228, 211, 0.2);
--platform-hero-overlay-strong: linear-gradient(
135deg,
rgba(255, 146, 170, 0.78),
rgba(255, 201, 171, 0.72)
);
--platform-hero-overlay-soft: linear-gradient(
180deg,
rgba(255, 255, 255, 0.1),
rgba(255, 246, 249, 0.26)
);
--platform-hero-glow-a: rgba(255, 255, 255, 0.18);
--platform-hero-glow-b: rgba(255, 197, 219, 0.18);
--platform-surface-border: rgba(239, 221, 228, 0.9);
--platform-surface-hover-border: rgba(255, 154, 188, 0.58);
--platform-shell-glow-1: rgba(255, 255, 255, 0.22);
--platform-shell-glow-2: rgba(255, 186, 205, 0.22);
--platform-shell-glow-3: rgba(255, 197, 158, 0.16);
--platform-surface-glow-a: rgba(255, 165, 195, 0.16);
--platform-surface-glow-b: rgba(255, 196, 160, 0.14);
--platform-shell-glow-1: rgba(255, 255, 255, 0.2);
--platform-shell-glow-2: rgba(255, 220, 229, 0.18);
--platform-shell-glow-3: rgba(255, 221, 194, 0.14);
--platform-surface-glow-a: rgba(255, 213, 225, 0.14);
--platform-surface-glow-b: rgba(255, 224, 201, 0.12);
--platform-text-strong: #28151d;
--platform-text-base: #5c4650;
--platform-text-soft: #886f79;
@@ -609,6 +631,20 @@ body {
background: var(--platform-hero-fill);
}
.platform-surface--hero::before {
background: radial-gradient(
circle at top left,
var(--platform-hero-glow-a),
transparent 34%
),
radial-gradient(
circle at bottom right,
var(--platform-hero-glow-b),
transparent 32%
),
var(--platform-hero-overlay-soft);
}
.platform-surface--light {
border-color: var(--platform-line-soft);
background: var(--platform-subpanel-fill);
@@ -800,8 +836,13 @@ body {
}
.platform-bottom-nav {
box-sizing: border-box;
min-height: var(--platform-bottom-nav-height);
gap: var(--platform-bottom-nav-gap);
border: 1px solid var(--platform-desktop-panel-border);
border-radius: var(--platform-bottom-nav-radius);
background: var(--platform-nav-fill);
padding: var(--platform-bottom-nav-padding);
box-shadow:
inset 0 1px 0 rgba(255, 255, 255, 0.03),
0 16px 40px rgba(0, 0, 0, 0.1);
@@ -812,13 +853,15 @@ body {
display: flex;
box-sizing: border-box;
width: 100%;
height: 100%;
min-height: calc(
var(--platform-bottom-nav-height) - var(--platform-bottom-nav-padding) * 2
);
align-items: center;
justify-content: center;
border: 1px solid transparent;
border-radius: 1rem;
border-radius: var(--platform-bottom-nav-button-radius);
background: transparent;
padding: 0.35rem 0.5rem;
padding: 0;
color: var(--platform-nav-item-text);
transition:
background-color 180ms ease,
@@ -827,6 +870,16 @@ body {
transform 180ms ease;
}
.platform-bottom-nav__button-content {
display: flex;
min-height: 100%;
width: 100%;
flex-direction: column;
align-items: center;
justify-content: center;
gap: var(--platform-bottom-nav-content-gap);
}
.platform-bottom-nav__button:hover {
color: var(--platform-text-strong);
background: var(--platform-nav-item-hover-fill);
@@ -836,9 +889,7 @@ body {
border: 1px solid var(--platform-nav-active-border);
background: var(--platform-nav-active-fill);
color: var(--platform-text-strong);
box-shadow:
inset 0 1px 0 rgba(255, 255, 255, 0.08),
var(--platform-nav-active-shadow);
box-shadow: var(--platform-bottom-nav-active-shadow);
}
.platform-bottom-nav__icon-shell,
@@ -857,8 +908,8 @@ body {
}
.platform-bottom-nav__icon-shell {
width: 1.5rem;
height: 1.5rem;
width: var(--platform-bottom-nav-icon-shell-size);
height: var(--platform-bottom-nav-icon-shell-size);
}
.platform-desktop-rail__icon-shell {
@@ -869,12 +920,18 @@ body {
.platform-bottom-nav__icon,
.platform-desktop-rail__icon {
color: var(--platform-nav-item-icon-text);
width: var(--platform-bottom-nav-icon-size);
height: var(--platform-bottom-nav-icon-size);
transition: color 180ms ease;
}
.platform-bottom-nav__label,
.platform-desktop-rail__label {
color: var(--platform-nav-item-text);
font-size: var(--platform-bottom-nav-label-size);
font-weight: 600;
letter-spacing: var(--platform-bottom-nav-label-tracking);
line-height: 1;
transition: color 180ms ease;
}