anentrypoint-design 1.0.25 → 1.0.27
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/colors_and_type.css +3 -3
- package/dist/247420.css +33 -47
- package/dist/247420.js +24 -24
- package/package.json +1 -1
- package/src/css/app-shell/chat-polish.css +4 -4
- package/src/css/app-shell/data-density.css +1 -1
- package/src/css/app-shell/files.css +2 -2
- package/src/css/app-shell/hero-content.css +15 -28
- package/src/css/app-shell/otp-input.css +1 -1
- package/src/css/app-shell/plugins-config.css +1 -1
- package/src/css/app-shell/primitives.css +1 -1
- package/src/css/app-shell/slider.css +1 -1
- package/src/css/app-shell/topbar.css +4 -5
- package/src/kits/os/theme.css +51 -0
package/colors_and_type.css
CHANGED
|
@@ -293,8 +293,8 @@
|
|
|
293
293
|
--space-10: 192px;
|
|
294
294
|
|
|
295
295
|
--density: 1;
|
|
296
|
-
--pad-y: calc(var(--space-
|
|
297
|
-
--pad-x: calc(var(--space-
|
|
296
|
+
--pad-y: calc(var(--space-6) * var(--density));
|
|
297
|
+
--pad-x: calc(var(--space-6) * var(--density));
|
|
298
298
|
--gutter: calc(var(--space-4) * var(--density));
|
|
299
299
|
|
|
300
300
|
/* Borders — chunky or none */
|
|
@@ -433,7 +433,7 @@
|
|
|
433
433
|
column growing without bound. */
|
|
434
434
|
--stage-ultra: min(96%, 2100px);
|
|
435
435
|
|
|
436
|
-
--sidebar-width:
|
|
436
|
+
--sidebar-width: 256px;
|
|
437
437
|
--sidebar-width-collapsed: 64px;
|
|
438
438
|
|
|
439
439
|
/* Canonical breakpoint values — @media can't reference custom properties,
|
package/dist/247420.css
CHANGED
|
@@ -295,8 +295,8 @@
|
|
|
295
295
|
--space-10: 192px;
|
|
296
296
|
|
|
297
297
|
--density: 1;
|
|
298
|
-
--pad-y: calc(var(--space-
|
|
299
|
-
--pad-x: calc(var(--space-
|
|
298
|
+
--pad-y: calc(var(--space-6) * var(--density));
|
|
299
|
+
--pad-x: calc(var(--space-6) * var(--density));
|
|
300
300
|
--gutter: calc(var(--space-4) * var(--density));
|
|
301
301
|
|
|
302
302
|
/* Borders — chunky or none */
|
|
@@ -435,7 +435,7 @@
|
|
|
435
435
|
column growing without bound. */
|
|
436
436
|
--stage-ultra: min(96%, 2100px);
|
|
437
437
|
|
|
438
|
-
--sidebar-width:
|
|
438
|
+
--sidebar-width: 256px;
|
|
439
439
|
--sidebar-width-collapsed: 64px;
|
|
440
440
|
|
|
441
441
|
/* Canonical breakpoint values — @media can't reference custom properties,
|
|
@@ -1195,8 +1195,8 @@
|
|
|
1195
1195
|
|
|
1196
1196
|
.ds-247420 {
|
|
1197
1197
|
--app-status-h: 26px;
|
|
1198
|
-
--app-topbar-h:
|
|
1199
|
-
--app-crumb-h:
|
|
1198
|
+
--app-topbar-h: 64px;
|
|
1199
|
+
--app-crumb-h: 56px;
|
|
1200
1200
|
}
|
|
1201
1201
|
|
|
1202
1202
|
.ds-247420 .app-topbar {
|
|
@@ -1205,7 +1205,7 @@
|
|
|
1205
1205
|
align-items: center; gap: var(--space-4);
|
|
1206
1206
|
min-height: var(--app-topbar-h);
|
|
1207
1207
|
padding: var(--space-2-5) var(--pad-x);
|
|
1208
|
-
|
|
1208
|
+
border-bottom: var(--bw-hair, 1px) solid var(--rule);
|
|
1209
1209
|
}
|
|
1210
1210
|
|
|
1211
1211
|
/* Merged chrome: when AppShell gets both a topbar and a crumb it wraps them
|
|
@@ -1218,7 +1218,7 @@
|
|
|
1218
1218
|
display: flex; flex-wrap: wrap; align-items: center;
|
|
1219
1219
|
gap: var(--space-2) var(--space-4);
|
|
1220
1220
|
padding: var(--space-2) var(--pad-x);
|
|
1221
|
-
|
|
1221
|
+
border-bottom: var(--bw-hair, 1px) solid var(--rule);
|
|
1222
1222
|
}
|
|
1223
1223
|
.ds-247420 .app-chrome > .app-topbar,
|
|
1224
1224
|
.ds-247420 .app-chrome > .app-crumb {
|
|
@@ -1288,7 +1288,6 @@
|
|
|
1288
1288
|
change. */
|
|
1289
1289
|
.ds-247420 .app-topbar nav a.active {
|
|
1290
1290
|
color: var(--accent-ink);
|
|
1291
|
-
background: color-mix(in oklab, var(--accent) 16%, transparent);
|
|
1292
1291
|
box-shadow: inset 0 -2px 0 0 var(--accent);
|
|
1293
1292
|
font-weight: 600;
|
|
1294
1293
|
}
|
|
@@ -1696,7 +1695,7 @@
|
|
|
1696
1695
|
.ds-247420 .btn:hover { background: var(--bg-3); color: var(--fg); transform: translateY(-1px); box-shadow: var(--shadow-1); }
|
|
1697
1696
|
.ds-247420 .btn-primary {
|
|
1698
1697
|
background: var(--accent); color: var(--accent-fg);
|
|
1699
|
-
font-weight:
|
|
1698
|
+
font-weight: 600;
|
|
1700
1699
|
}
|
|
1701
1700
|
.ds-247420 .btn-primary:hover { background: var(--fg); color: var(--bg); transform: translateY(-1px); box-shadow: var(--shadow-2); }
|
|
1702
1701
|
.ds-247420 .btn-ghost { background: transparent; color: var(--fg); box-shadow: inset 0 0 0 var(--bw-hair) var(--fg); }
|
|
@@ -2348,30 +2347,21 @@
|
|
|
2348
2347
|
and each part's own layout (aside becomes a full-width card below the body
|
|
2349
2348
|
instead of a right-column card) changed. Centered text, capped measure.
|
|
2350
2349
|
|
|
2351
|
-
|
|
2352
|
-
|
|
2353
|
-
|
|
2354
|
-
|
|
2355
|
-
|
|
2356
|
-
hero the moment the oversized display type is involved, regardless of
|
|
2357
|
-
architecture. Swapping to flex-start + left text-align, plus a
|
|
2358
|
-
--space-6 left inset inside the unchanged --stage-wide container, pushes
|
|
2359
|
-
the whole block toward the left edge so the oversized title crops against
|
|
2360
|
-
real whitespace on the right instead of sitting symmetric in the middle --
|
|
2361
|
-
editorial tension from a one-axis asymmetry, no grid architecture
|
|
2362
|
-
reintroduced. */
|
|
2350
|
+
RE-CENTERED 2026-08-09: reverted the 2026-07-31 de-centering (flex-start +
|
|
2351
|
+
left text-align + left inset) back to a centered stack -- the airy,
|
|
2352
|
+
dead-centered arrangement is the intended house look after all, matching
|
|
2353
|
+
the plain centered-lead reference this hero is now aligned to. Aside card
|
|
2354
|
+
dropped its filled background/accent bar for a plain top-rule divider. */
|
|
2363
2355
|
.ds-247420 .ds-hero {
|
|
2364
2356
|
padding: var(--space-9) 0 var(--space-8);
|
|
2365
|
-
display: flex; flex-direction: column; align-items:
|
|
2357
|
+
display: flex; flex-direction: column; align-items: center;
|
|
2366
2358
|
gap: var(--space-5);
|
|
2367
2359
|
max-width: var(--stage-wide);
|
|
2368
|
-
|
|
2369
|
-
padding-inline-start: var(--space-6);
|
|
2370
|
-
text-align: left;
|
|
2360
|
+
text-align: center;
|
|
2371
2361
|
position: relative; isolation: isolate;
|
|
2372
2362
|
}
|
|
2373
|
-
.ds-247420 .ds-hero-head { display: grid; gap: var(--space-3); justify-items:
|
|
2374
|
-
.ds-247420 .ds-hero-body { margin-inline:
|
|
2363
|
+
.ds-247420 .ds-hero-head { display: grid; gap: var(--space-3); justify-items: center; margin-inline: auto; }
|
|
2364
|
+
.ds-247420 .ds-hero-body { margin-inline: auto; }
|
|
2375
2365
|
/* The stat/badge/CTA cluster now sits as a full-width card BELOW the body
|
|
2376
2366
|
copy, left-aligned with the rest of the stack, rather than a right-offset
|
|
2377
2367
|
column -- still carries its own visual weight via the top accent bar
|
|
@@ -2380,18 +2370,14 @@
|
|
|
2380
2370
|
.ds-247420 .ds-hero-aside {
|
|
2381
2371
|
position: relative; isolation: isolate;
|
|
2382
2372
|
width: 100%; max-width: 46ch;
|
|
2373
|
+
margin-inline: auto;
|
|
2383
2374
|
display: flex; flex-direction: column;
|
|
2384
2375
|
justify-content: space-between; gap: var(--space-5);
|
|
2385
|
-
background:
|
|
2386
|
-
border-
|
|
2387
|
-
padding:
|
|
2376
|
+
background: transparent;
|
|
2377
|
+
border-top: var(--bw-hair, 1px) solid var(--rule);
|
|
2378
|
+
padding: var(--space-4) var(--space-5) var(--space-5);
|
|
2388
2379
|
text-align: left;
|
|
2389
2380
|
}
|
|
2390
|
-
.ds-247420 .ds-hero-aside::before {
|
|
2391
|
-
content: ''; position: absolute; left: 0; right: 0; top: 0;
|
|
2392
|
-
height: var(--bw-chunk); background: var(--accent);
|
|
2393
|
-
border-radius: var(--bw-chunk) var(--bw-chunk) 0 0;
|
|
2394
|
-
}
|
|
2395
2381
|
.ds-247420 .ds-hero-stats { display: flex; flex-direction: column; gap: var(--space-2); }
|
|
2396
2382
|
.ds-247420 .ds-hero-stat {
|
|
2397
2383
|
font-family: var(--ff-mono); font-size: var(--fs-sm);
|
|
@@ -2419,7 +2405,7 @@
|
|
|
2419
2405
|
feel this title wants while clearing enough vertical room that letters
|
|
2420
2406
|
stop colliding. */
|
|
2421
2407
|
line-height: 1.02; letter-spacing: var(--tr-tighter);
|
|
2422
|
-
margin: 0; max-width:
|
|
2408
|
+
margin: 0; max-width: 16ch; margin-inline: auto; text-wrap: balance;
|
|
2423
2409
|
}
|
|
2424
2410
|
.ds-247420 .ds-hero-body {
|
|
2425
2411
|
font-family: var(--ff-body); font-size: var(--fs-xl);
|
|
@@ -2513,7 +2499,7 @@
|
|
|
2513
2499
|
============================================================ */
|
|
2514
2500
|
.ds-247420 .ds-marquee {
|
|
2515
2501
|
overflow: hidden; width: 100%;
|
|
2516
|
-
border-block: var(--bw-
|
|
2502
|
+
border-block: var(--bw-hair) solid var(--rule-strong);
|
|
2517
2503
|
padding: var(--space-2) 0;
|
|
2518
2504
|
font-family: var(--ff-display); font-weight: 600;
|
|
2519
2505
|
text-transform: uppercase; letter-spacing: var(--tr-caps);
|
|
@@ -3502,7 +3488,7 @@
|
|
|
3502
3488
|
padding: var(--space-1) var(--space-2);
|
|
3503
3489
|
background: var(--bg-2); border: var(--bw-hair) solid var(--rule); border-radius: var(--r-2);
|
|
3504
3490
|
}
|
|
3505
|
-
.ds-247420 .ds-bulkbar-count { font-size: var(--fs-sm); font-weight:
|
|
3491
|
+
.ds-247420 .ds-bulkbar-count { font-size: var(--fs-sm); font-weight: var(--fw-medium, 500); color: var(--fg-2); }
|
|
3506
3492
|
/* BulkBar is a toolbar (it even declares role=toolbar): compact rect buttons,
|
|
3507
3493
|
quiet destructive outline - the app arm-confirms destructive bulk actions
|
|
3508
3494
|
via ConfirmDialog, so the strip never needs a loud CTA. */
|
|
@@ -3727,7 +3713,7 @@
|
|
|
3727
3713
|
design; dashed was this system's OTHER "drop target" vocabulary
|
|
3728
3714
|
(.panel-docs, kits-appended.css) leaking in here by copy-paste. */
|
|
3729
3715
|
.ds-247420 .ds-dropzone {
|
|
3730
|
-
border: var(--bw-
|
|
3716
|
+
border: var(--bw-hair) solid var(--rule);
|
|
3731
3717
|
border-radius: var(--r-3); background: var(--bg);
|
|
3732
3718
|
transition: border-color var(--dur-base) var(--ease), background var(--dur-base) var(--ease);
|
|
3733
3719
|
}
|
|
@@ -4304,7 +4290,7 @@
|
|
|
4304
4290
|
width: 36px; height: 36px; flex-shrink: 0;
|
|
4305
4291
|
border-radius: 50%; background: var(--bg-3); color: var(--fg);
|
|
4306
4292
|
display: inline-flex; align-items: center; justify-content: center;
|
|
4307
|
-
font-family: var(--ff-body); font-size: var(--fs-micro); font-weight:
|
|
4293
|
+
font-family: var(--ff-body); font-size: var(--fs-micro); font-weight: var(--fw-medium, 500);
|
|
4308
4294
|
text-transform: lowercase; letter-spacing: 0.02em; user-select: none;
|
|
4309
4295
|
transition: transform 0.12s ease, box-shadow 0.12s ease;
|
|
4310
4296
|
position: relative;
|
|
@@ -4612,7 +4598,7 @@
|
|
|
4612
4598
|
font-family: var(--ff-mono); font-size: var(--fs-xs); color: var(--fg-3);
|
|
4613
4599
|
padding: 0 var(--space-1-75); letter-spacing: 0.02em;
|
|
4614
4600
|
}
|
|
4615
|
-
.ds-247420 .chat-meta .who { font-weight:
|
|
4601
|
+
.ds-247420 .chat-meta .who { font-weight: var(--fw-medium, 500); color: var(--fg-2); }
|
|
4616
4602
|
.ds-247420 .chat-meta .who::after { content: ' ·'; color: var(--fg-3); font-weight: 400; }
|
|
4617
4603
|
.ds-247420 .chat-meta .t { color: var(--fg-3); }
|
|
4618
4604
|
.ds-247420 .chat-meta .tick { color: var(--fg-3); margin-left: var(--space-hair); letter-spacing: -2px; font-family: var(--ff-body); }
|
|
@@ -4638,7 +4624,7 @@
|
|
|
4638
4624
|
color: var(--accent-ink);
|
|
4639
4625
|
}
|
|
4640
4626
|
.ds-247420 .chat-reactions .rxn .e { font-size: var(--fs-xs); line-height: 1; }
|
|
4641
|
-
.ds-247420 .chat-reactions .rxn .n { font-family: var(--ff-mono); font-weight:
|
|
4627
|
+
.ds-247420 .chat-reactions .rxn .n { font-family: var(--ff-mono); font-weight: var(--fw-medium, 500); font-size: var(--fs-nano); color: var(--fg-2); }
|
|
4642
4628
|
.ds-247420 .chat-reactions .rxn.you .n { color: var(--accent-ink); }
|
|
4643
4629
|
|
|
4644
4630
|
/* Typing indicator renders through the same .chat-bubble container as a real
|
|
@@ -4810,7 +4796,7 @@
|
|
|
4810
4796
|
[data-theme="dark"],[data-theme="ink"] override missed data-theme="auto"
|
|
4811
4797
|
under OS-dark, which is how the kits actually render — the author name
|
|
4812
4798
|
fell back to the paper tone at 3.13:1 on ink. */
|
|
4813
|
-
.ds-247420 .aicat-meta .name { color: var(--mascot-deep, var(--mascot)); font-weight:
|
|
4799
|
+
.ds-247420 .aicat-meta .name { color: var(--mascot-deep, var(--mascot)); font-weight: var(--fw-medium, 500); }
|
|
4814
4800
|
|
|
4815
4801
|
/* ============================================================
|
|
4816
4802
|
Composer attachment-detected badge, context line, hint, toolbar,
|
|
@@ -6880,7 +6866,7 @@
|
|
|
6880
6866
|
@media (max-width: 640px) {
|
|
6881
6867
|
.ds-247420 .ds-session-row-span { flex-basis: 100%; }
|
|
6882
6868
|
}
|
|
6883
|
-
.ds-247420 .ds-session-row-devcnt { color: var(--warn); font-weight:
|
|
6869
|
+
.ds-247420 .ds-session-row-devcnt { color: var(--warn); font-weight: var(--fw-medium, 500); }
|
|
6884
6870
|
.ds-247420 .ds-session-row-span { font-size: var(--fs-micro); color: var(--fg-3); }
|
|
6885
6871
|
|
|
6886
6872
|
/* DevRow */
|
|
@@ -8176,7 +8162,7 @@
|
|
|
8176
8162
|
padding: var(--space-3) var(--space-4);
|
|
8177
8163
|
border-bottom: var(--bw-hair) solid var(--rule); flex: 0 0 auto;
|
|
8178
8164
|
}
|
|
8179
|
-
.ds-247420 .ds-plugins-title { font-size: var(--fs-md); font-weight:
|
|
8165
|
+
.ds-247420 .ds-plugins-title { font-size: var(--fs-md); font-weight: 600; color: var(--fg); }
|
|
8180
8166
|
.ds-247420 .ds-plugins-close {
|
|
8181
8167
|
background: none; border: none; color: var(--fg-3); cursor: pointer;
|
|
8182
8168
|
font-size: 20px; line-height: 1; padding: 2px 6px; border-radius: var(--r-1);
|
|
@@ -8447,7 +8433,7 @@
|
|
|
8447
8433
|
width: 18px; height: 18px;
|
|
8448
8434
|
border-radius: var(--r-pill);
|
|
8449
8435
|
background: var(--bg-1);
|
|
8450
|
-
border: var(--bw-
|
|
8436
|
+
border: var(--bw-hair) solid var(--accent);
|
|
8451
8437
|
box-shadow: var(--shadow-1);
|
|
8452
8438
|
transform: translate(-50%, -50%);
|
|
8453
8439
|
pointer-events: none;
|
|
@@ -8483,7 +8469,7 @@
|
|
|
8483
8469
|
font-weight: 600;
|
|
8484
8470
|
color: var(--fg);
|
|
8485
8471
|
background: var(--bg-2);
|
|
8486
|
-
border: var(--bw-
|
|
8472
|
+
border: var(--bw-hair) solid var(--rule);
|
|
8487
8473
|
border-radius: var(--r-1);
|
|
8488
8474
|
transition: border-color var(--dur-snap) var(--ease), background var(--dur-snap) var(--ease), box-shadow var(--dur-snap) var(--ease);
|
|
8489
8475
|
}
|