@alivecss/aliveui 1.0.5 → 1.1.0
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/dist/cli.js +246 -1
- package/dist/index.js +245 -0
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +245 -0
- package/dist/index.mjs.map +1 -1
- package/dist/vite.js +245 -0
- package/dist/vite.js.map +1 -1
- package/dist/vite.mjs +245 -0
- package/dist/vite.mjs.map +1 -1
- package/package.json +1 -1
package/dist/cli.js
CHANGED
|
@@ -2283,6 +2283,251 @@ video {
|
|
|
2283
2283
|
color: rgba(0,0,0,0.3);
|
|
2284
2284
|
user-select: none;
|
|
2285
2285
|
}
|
|
2286
|
+
|
|
2287
|
+
/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550
|
|
2288
|
+
AliveUI Build \u2014 Display & marketing components
|
|
2289
|
+
Browser frame \xB7 Phone frame \xB7 Stat card \xB7 Checklist \xB7 Dot grid
|
|
2290
|
+
\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */
|
|
2291
|
+
|
|
2292
|
+
/* \u2500\u2500 Browser Frame \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */
|
|
2293
|
+
.alive-browser {
|
|
2294
|
+
border-radius: 12px;
|
|
2295
|
+
overflow: hidden;
|
|
2296
|
+
border: 1px solid rgba(0,0,0,0.1);
|
|
2297
|
+
background: #fff;
|
|
2298
|
+
box-shadow: 0 24px 64px rgba(0,0,0,0.1), 0 4px 12px rgba(0,0,0,0.06);
|
|
2299
|
+
}
|
|
2300
|
+
.alive-browser-bar {
|
|
2301
|
+
display: flex;
|
|
2302
|
+
align-items: center;
|
|
2303
|
+
gap: 8px;
|
|
2304
|
+
padding: 10px 16px;
|
|
2305
|
+
background: #f3f3f3;
|
|
2306
|
+
border-bottom: 1px solid rgba(0,0,0,0.08);
|
|
2307
|
+
flex-shrink: 0;
|
|
2308
|
+
}
|
|
2309
|
+
.alive-browser-dots {
|
|
2310
|
+
display: flex;
|
|
2311
|
+
gap: 6px;
|
|
2312
|
+
flex-shrink: 0;
|
|
2313
|
+
}
|
|
2314
|
+
.alive-browser-dot {
|
|
2315
|
+
width: 10px;
|
|
2316
|
+
height: 10px;
|
|
2317
|
+
border-radius: 50%;
|
|
2318
|
+
opacity: 0.85;
|
|
2319
|
+
}
|
|
2320
|
+
.alive-browser-dot:nth-child(1) { background: #ff5f57; }
|
|
2321
|
+
.alive-browser-dot:nth-child(2) { background: #febc2e; }
|
|
2322
|
+
.alive-browser-dot:nth-child(3) { background: #28c840; }
|
|
2323
|
+
.alive-browser-url {
|
|
2324
|
+
flex: 1;
|
|
2325
|
+
max-width: 280px;
|
|
2326
|
+
margin: 0 auto;
|
|
2327
|
+
padding: 4px 12px;
|
|
2328
|
+
border-radius: 6px;
|
|
2329
|
+
background: rgba(0,0,0,0.06);
|
|
2330
|
+
border: 1px solid rgba(0,0,0,0.08);
|
|
2331
|
+
font-size: 0.7rem;
|
|
2332
|
+
color: rgba(0,0,0,0.35);
|
|
2333
|
+
text-align: center;
|
|
2334
|
+
font-family: ui-monospace, monospace;
|
|
2335
|
+
white-space: nowrap;
|
|
2336
|
+
overflow: hidden;
|
|
2337
|
+
text-overflow: ellipsis;
|
|
2338
|
+
user-select: none;
|
|
2339
|
+
}
|
|
2340
|
+
.alive-browser-body {
|
|
2341
|
+
overflow: hidden;
|
|
2342
|
+
}
|
|
2343
|
+
/* Dark variant */
|
|
2344
|
+
.alive-browser-dark {
|
|
2345
|
+
border-color: rgba(255,255,255,0.1);
|
|
2346
|
+
background: #0f0f0f;
|
|
2347
|
+
box-shadow: 0 32px 80px rgba(0,0,0,0.6), 0 8px 24px rgba(0,0,0,0.4);
|
|
2348
|
+
}
|
|
2349
|
+
.alive-browser-dark .alive-browser-bar {
|
|
2350
|
+
background: #161616;
|
|
2351
|
+
border-bottom-color: rgba(255,255,255,0.07);
|
|
2352
|
+
}
|
|
2353
|
+
.alive-browser-dark .alive-browser-url {
|
|
2354
|
+
background: rgba(255,255,255,0.05);
|
|
2355
|
+
border-color: rgba(255,255,255,0.07);
|
|
2356
|
+
color: rgba(255,255,255,0.2);
|
|
2357
|
+
}
|
|
2358
|
+
|
|
2359
|
+
/* \u2500\u2500 Phone Frame \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */
|
|
2360
|
+
.alive-phone {
|
|
2361
|
+
position: relative;
|
|
2362
|
+
display: inline-flex;
|
|
2363
|
+
flex-direction: column;
|
|
2364
|
+
border-radius: 40px;
|
|
2365
|
+
border: 8px solid #1c1c1e;
|
|
2366
|
+
background: #fff;
|
|
2367
|
+
overflow: hidden;
|
|
2368
|
+
box-shadow:
|
|
2369
|
+
0 32px 80px rgba(0,0,0,0.35),
|
|
2370
|
+
inset 0 0 0 1px rgba(255,255,255,0.1),
|
|
2371
|
+
0 0 0 1px rgba(0,0,0,0.5);
|
|
2372
|
+
}
|
|
2373
|
+
.alive-phone::before {
|
|
2374
|
+
content: '';
|
|
2375
|
+
position: absolute;
|
|
2376
|
+
top: 10px;
|
|
2377
|
+
left: 50%;
|
|
2378
|
+
transform: translateX(-50%);
|
|
2379
|
+
width: 90px;
|
|
2380
|
+
height: 22px;
|
|
2381
|
+
background: #1c1c1e;
|
|
2382
|
+
border-radius: 11px;
|
|
2383
|
+
z-index: 10;
|
|
2384
|
+
}
|
|
2385
|
+
.alive-phone-screen {
|
|
2386
|
+
width: 100%;
|
|
2387
|
+
overflow: hidden;
|
|
2388
|
+
flex: 1;
|
|
2389
|
+
}
|
|
2390
|
+
.alive-phone-dark {
|
|
2391
|
+
background: #0f0f0f;
|
|
2392
|
+
}
|
|
2393
|
+
.alive-phone-dark .alive-phone-screen {
|
|
2394
|
+
background: #0f0f0f;
|
|
2395
|
+
}
|
|
2396
|
+
/* Sizes */
|
|
2397
|
+
.alive-phone-sm { width: 220px; border-radius: 32px; border-width: 6px; }
|
|
2398
|
+
.alive-phone-sm::before { width: 70px; height: 18px; border-radius: 9px; }
|
|
2399
|
+
.alive-phone-lg { width: 340px; border-radius: 48px; border-width: 10px; }
|
|
2400
|
+
.alive-phone-lg::before { width: 110px; height: 26px; border-radius: 13px; }
|
|
2401
|
+
|
|
2402
|
+
/* \u2500\u2500 Stat Card \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */
|
|
2403
|
+
.alive-stat {
|
|
2404
|
+
padding: 1.5rem;
|
|
2405
|
+
border-radius: 12px;
|
|
2406
|
+
background: #fff;
|
|
2407
|
+
border: 1px solid rgba(0,0,0,0.07);
|
|
2408
|
+
box-shadow: 0 2px 8px rgba(0,0,0,0.04);
|
|
2409
|
+
}
|
|
2410
|
+
.alive-stat-label {
|
|
2411
|
+
font-size: 0.75rem;
|
|
2412
|
+
font-weight: 600;
|
|
2413
|
+
letter-spacing: 0.06em;
|
|
2414
|
+
color: rgba(0,0,0,0.4);
|
|
2415
|
+
text-transform: uppercase;
|
|
2416
|
+
margin-bottom: 0.5rem;
|
|
2417
|
+
}
|
|
2418
|
+
.alive-stat-value {
|
|
2419
|
+
font-size: 2.25rem;
|
|
2420
|
+
font-weight: 700;
|
|
2421
|
+
letter-spacing: -0.04em;
|
|
2422
|
+
line-height: 1;
|
|
2423
|
+
color: rgba(0,0,0,0.9);
|
|
2424
|
+
margin-bottom: 0.5rem;
|
|
2425
|
+
font-variant-numeric: tabular-nums;
|
|
2426
|
+
}
|
|
2427
|
+
.alive-stat-change {
|
|
2428
|
+
display: inline-flex;
|
|
2429
|
+
align-items: center;
|
|
2430
|
+
gap: 4px;
|
|
2431
|
+
font-size: 0.8125rem;
|
|
2432
|
+
font-weight: 600;
|
|
2433
|
+
}
|
|
2434
|
+
.alive-stat-up { color: #16a34a; }
|
|
2435
|
+
.alive-stat-down { color: #dc2626; }
|
|
2436
|
+
/* Dark variant */
|
|
2437
|
+
.alive-stat-dark {
|
|
2438
|
+
background: rgba(255,255,255,0.05);
|
|
2439
|
+
border-color: rgba(255,255,255,0.09);
|
|
2440
|
+
box-shadow: none;
|
|
2441
|
+
}
|
|
2442
|
+
.alive-stat-dark .alive-stat-label { color: rgba(255,255,255,0.35); }
|
|
2443
|
+
.alive-stat-dark .alive-stat-value { color: #ffffff; }
|
|
2444
|
+
|
|
2445
|
+
/* \u2500\u2500 Feature Checklist \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */
|
|
2446
|
+
.alive-checklist {
|
|
2447
|
+
display: flex;
|
|
2448
|
+
flex-direction: column;
|
|
2449
|
+
gap: 0.875rem;
|
|
2450
|
+
}
|
|
2451
|
+
.alive-checklist-item {
|
|
2452
|
+
display: flex;
|
|
2453
|
+
align-items: flex-start;
|
|
2454
|
+
gap: 0.75rem;
|
|
2455
|
+
font-size: 0.9375rem;
|
|
2456
|
+
color: rgba(0,0,0,0.75);
|
|
2457
|
+
line-height: 1.45;
|
|
2458
|
+
}
|
|
2459
|
+
.alive-checklist-icon {
|
|
2460
|
+
flex-shrink: 0;
|
|
2461
|
+
width: 20px;
|
|
2462
|
+
height: 20px;
|
|
2463
|
+
border-radius: 50%;
|
|
2464
|
+
background: rgba(74,222,128,0.15);
|
|
2465
|
+
border: 1.5px solid rgba(74,222,128,0.4);
|
|
2466
|
+
display: flex;
|
|
2467
|
+
align-items: center;
|
|
2468
|
+
justify-content: center;
|
|
2469
|
+
margin-top: 2px;
|
|
2470
|
+
}
|
|
2471
|
+
.alive-checklist-icon::after {
|
|
2472
|
+
content: '';
|
|
2473
|
+
display: block;
|
|
2474
|
+
width: 5px;
|
|
2475
|
+
height: 9px;
|
|
2476
|
+
border-right: 2px solid #16a34a;
|
|
2477
|
+
border-bottom: 2px solid #16a34a;
|
|
2478
|
+
transform: rotate(45deg) translate(-1px, -1px);
|
|
2479
|
+
}
|
|
2480
|
+
/* Dark variant */
|
|
2481
|
+
.alive-checklist-dark .alive-checklist-item { color: rgba(255,255,255,0.75); }
|
|
2482
|
+
.alive-checklist-dark .alive-checklist-icon {
|
|
2483
|
+
background: rgba(74,222,128,0.12);
|
|
2484
|
+
border-color: rgba(74,222,128,0.3);
|
|
2485
|
+
}
|
|
2486
|
+
|
|
2487
|
+
/* \u2500\u2500 Dot Grid Background \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */
|
|
2488
|
+
.alive-dot-grid {
|
|
2489
|
+
background-image: radial-gradient(circle, rgba(0,0,0,0.12) 1px, transparent 1px);
|
|
2490
|
+
background-size: 24px 24px;
|
|
2491
|
+
}
|
|
2492
|
+
.alive-dot-grid-sm { background-size: 16px 16px; }
|
|
2493
|
+
.alive-dot-grid-lg { background-size: 32px 32px; }
|
|
2494
|
+
.alive-dot-grid-dark {
|
|
2495
|
+
background-image: radial-gradient(circle, rgba(255,255,255,0.12) 1px, transparent 1px);
|
|
2496
|
+
}
|
|
2497
|
+
|
|
2498
|
+
/* \u2500\u2500 Terminal / Code Block \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */
|
|
2499
|
+
.alive-terminal {
|
|
2500
|
+
border-radius: 10px;
|
|
2501
|
+
overflow: hidden;
|
|
2502
|
+
background: #0f0f0f;
|
|
2503
|
+
border: 1px solid rgba(255,255,255,0.08);
|
|
2504
|
+
box-shadow: 0 16px 48px rgba(0,0,0,0.4);
|
|
2505
|
+
font-family: ui-monospace, 'Cascadia Code', 'Fira Code', monospace;
|
|
2506
|
+
}
|
|
2507
|
+
.alive-terminal-bar {
|
|
2508
|
+
display: flex;
|
|
2509
|
+
align-items: center;
|
|
2510
|
+
gap: 8px;
|
|
2511
|
+
padding: 10px 16px;
|
|
2512
|
+
background: #161616;
|
|
2513
|
+
border-bottom: 1px solid rgba(255,255,255,0.06);
|
|
2514
|
+
flex-shrink: 0;
|
|
2515
|
+
}
|
|
2516
|
+
.alive-terminal-body {
|
|
2517
|
+
padding: 1.25rem 1.5rem;
|
|
2518
|
+
font-size: 0.8125rem;
|
|
2519
|
+
line-height: 1.7;
|
|
2520
|
+
color: rgba(255,255,255,0.75);
|
|
2521
|
+
overflow: auto;
|
|
2522
|
+
}
|
|
2523
|
+
.alive-terminal-prompt {
|
|
2524
|
+
color: rgba(255,255,255,0.25);
|
|
2525
|
+
user-select: none;
|
|
2526
|
+
}
|
|
2527
|
+
.alive-terminal-cmd { color: #60a5fa; }
|
|
2528
|
+
.alive-terminal-out { color: rgba(255,255,255,0.45); }
|
|
2529
|
+
.alive-terminal-ok { color: #4ade80; }
|
|
2530
|
+
.alive-terminal-err { color: #f87171; }
|
|
2286
2531
|
`;
|
|
2287
2532
|
}
|
|
2288
2533
|
|
|
@@ -3905,7 +4150,7 @@ function generateAliveSpecific(classes, _config) {
|
|
|
3905
4150
|
|
|
3906
4151
|
// src/cli.ts
|
|
3907
4152
|
var program = new import_commander.Command();
|
|
3908
|
-
program.name("aliveui").description("AliveUI \u2014 motion-first CSS framework").version("1.
|
|
4153
|
+
program.name("aliveui").description("AliveUI \u2014 motion-first CSS framework").version("1.1.0");
|
|
3909
4154
|
program.command("init").description("Create an aliveui.config.js in the current directory").action(() => {
|
|
3910
4155
|
const configPath = (0, import_path.resolve)(process.cwd(), "aliveui.config.js");
|
|
3911
4156
|
if ((0, import_fs2.existsSync)(configPath)) {
|
package/dist/index.js
CHANGED
|
@@ -2291,6 +2291,251 @@ video {
|
|
|
2291
2291
|
color: rgba(0,0,0,0.3);
|
|
2292
2292
|
user-select: none;
|
|
2293
2293
|
}
|
|
2294
|
+
|
|
2295
|
+
/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550
|
|
2296
|
+
AliveUI Build \u2014 Display & marketing components
|
|
2297
|
+
Browser frame \xB7 Phone frame \xB7 Stat card \xB7 Checklist \xB7 Dot grid
|
|
2298
|
+
\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */
|
|
2299
|
+
|
|
2300
|
+
/* \u2500\u2500 Browser Frame \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */
|
|
2301
|
+
.alive-browser {
|
|
2302
|
+
border-radius: 12px;
|
|
2303
|
+
overflow: hidden;
|
|
2304
|
+
border: 1px solid rgba(0,0,0,0.1);
|
|
2305
|
+
background: #fff;
|
|
2306
|
+
box-shadow: 0 24px 64px rgba(0,0,0,0.1), 0 4px 12px rgba(0,0,0,0.06);
|
|
2307
|
+
}
|
|
2308
|
+
.alive-browser-bar {
|
|
2309
|
+
display: flex;
|
|
2310
|
+
align-items: center;
|
|
2311
|
+
gap: 8px;
|
|
2312
|
+
padding: 10px 16px;
|
|
2313
|
+
background: #f3f3f3;
|
|
2314
|
+
border-bottom: 1px solid rgba(0,0,0,0.08);
|
|
2315
|
+
flex-shrink: 0;
|
|
2316
|
+
}
|
|
2317
|
+
.alive-browser-dots {
|
|
2318
|
+
display: flex;
|
|
2319
|
+
gap: 6px;
|
|
2320
|
+
flex-shrink: 0;
|
|
2321
|
+
}
|
|
2322
|
+
.alive-browser-dot {
|
|
2323
|
+
width: 10px;
|
|
2324
|
+
height: 10px;
|
|
2325
|
+
border-radius: 50%;
|
|
2326
|
+
opacity: 0.85;
|
|
2327
|
+
}
|
|
2328
|
+
.alive-browser-dot:nth-child(1) { background: #ff5f57; }
|
|
2329
|
+
.alive-browser-dot:nth-child(2) { background: #febc2e; }
|
|
2330
|
+
.alive-browser-dot:nth-child(3) { background: #28c840; }
|
|
2331
|
+
.alive-browser-url {
|
|
2332
|
+
flex: 1;
|
|
2333
|
+
max-width: 280px;
|
|
2334
|
+
margin: 0 auto;
|
|
2335
|
+
padding: 4px 12px;
|
|
2336
|
+
border-radius: 6px;
|
|
2337
|
+
background: rgba(0,0,0,0.06);
|
|
2338
|
+
border: 1px solid rgba(0,0,0,0.08);
|
|
2339
|
+
font-size: 0.7rem;
|
|
2340
|
+
color: rgba(0,0,0,0.35);
|
|
2341
|
+
text-align: center;
|
|
2342
|
+
font-family: ui-monospace, monospace;
|
|
2343
|
+
white-space: nowrap;
|
|
2344
|
+
overflow: hidden;
|
|
2345
|
+
text-overflow: ellipsis;
|
|
2346
|
+
user-select: none;
|
|
2347
|
+
}
|
|
2348
|
+
.alive-browser-body {
|
|
2349
|
+
overflow: hidden;
|
|
2350
|
+
}
|
|
2351
|
+
/* Dark variant */
|
|
2352
|
+
.alive-browser-dark {
|
|
2353
|
+
border-color: rgba(255,255,255,0.1);
|
|
2354
|
+
background: #0f0f0f;
|
|
2355
|
+
box-shadow: 0 32px 80px rgba(0,0,0,0.6), 0 8px 24px rgba(0,0,0,0.4);
|
|
2356
|
+
}
|
|
2357
|
+
.alive-browser-dark .alive-browser-bar {
|
|
2358
|
+
background: #161616;
|
|
2359
|
+
border-bottom-color: rgba(255,255,255,0.07);
|
|
2360
|
+
}
|
|
2361
|
+
.alive-browser-dark .alive-browser-url {
|
|
2362
|
+
background: rgba(255,255,255,0.05);
|
|
2363
|
+
border-color: rgba(255,255,255,0.07);
|
|
2364
|
+
color: rgba(255,255,255,0.2);
|
|
2365
|
+
}
|
|
2366
|
+
|
|
2367
|
+
/* \u2500\u2500 Phone Frame \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */
|
|
2368
|
+
.alive-phone {
|
|
2369
|
+
position: relative;
|
|
2370
|
+
display: inline-flex;
|
|
2371
|
+
flex-direction: column;
|
|
2372
|
+
border-radius: 40px;
|
|
2373
|
+
border: 8px solid #1c1c1e;
|
|
2374
|
+
background: #fff;
|
|
2375
|
+
overflow: hidden;
|
|
2376
|
+
box-shadow:
|
|
2377
|
+
0 32px 80px rgba(0,0,0,0.35),
|
|
2378
|
+
inset 0 0 0 1px rgba(255,255,255,0.1),
|
|
2379
|
+
0 0 0 1px rgba(0,0,0,0.5);
|
|
2380
|
+
}
|
|
2381
|
+
.alive-phone::before {
|
|
2382
|
+
content: '';
|
|
2383
|
+
position: absolute;
|
|
2384
|
+
top: 10px;
|
|
2385
|
+
left: 50%;
|
|
2386
|
+
transform: translateX(-50%);
|
|
2387
|
+
width: 90px;
|
|
2388
|
+
height: 22px;
|
|
2389
|
+
background: #1c1c1e;
|
|
2390
|
+
border-radius: 11px;
|
|
2391
|
+
z-index: 10;
|
|
2392
|
+
}
|
|
2393
|
+
.alive-phone-screen {
|
|
2394
|
+
width: 100%;
|
|
2395
|
+
overflow: hidden;
|
|
2396
|
+
flex: 1;
|
|
2397
|
+
}
|
|
2398
|
+
.alive-phone-dark {
|
|
2399
|
+
background: #0f0f0f;
|
|
2400
|
+
}
|
|
2401
|
+
.alive-phone-dark .alive-phone-screen {
|
|
2402
|
+
background: #0f0f0f;
|
|
2403
|
+
}
|
|
2404
|
+
/* Sizes */
|
|
2405
|
+
.alive-phone-sm { width: 220px; border-radius: 32px; border-width: 6px; }
|
|
2406
|
+
.alive-phone-sm::before { width: 70px; height: 18px; border-radius: 9px; }
|
|
2407
|
+
.alive-phone-lg { width: 340px; border-radius: 48px; border-width: 10px; }
|
|
2408
|
+
.alive-phone-lg::before { width: 110px; height: 26px; border-radius: 13px; }
|
|
2409
|
+
|
|
2410
|
+
/* \u2500\u2500 Stat Card \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */
|
|
2411
|
+
.alive-stat {
|
|
2412
|
+
padding: 1.5rem;
|
|
2413
|
+
border-radius: 12px;
|
|
2414
|
+
background: #fff;
|
|
2415
|
+
border: 1px solid rgba(0,0,0,0.07);
|
|
2416
|
+
box-shadow: 0 2px 8px rgba(0,0,0,0.04);
|
|
2417
|
+
}
|
|
2418
|
+
.alive-stat-label {
|
|
2419
|
+
font-size: 0.75rem;
|
|
2420
|
+
font-weight: 600;
|
|
2421
|
+
letter-spacing: 0.06em;
|
|
2422
|
+
color: rgba(0,0,0,0.4);
|
|
2423
|
+
text-transform: uppercase;
|
|
2424
|
+
margin-bottom: 0.5rem;
|
|
2425
|
+
}
|
|
2426
|
+
.alive-stat-value {
|
|
2427
|
+
font-size: 2.25rem;
|
|
2428
|
+
font-weight: 700;
|
|
2429
|
+
letter-spacing: -0.04em;
|
|
2430
|
+
line-height: 1;
|
|
2431
|
+
color: rgba(0,0,0,0.9);
|
|
2432
|
+
margin-bottom: 0.5rem;
|
|
2433
|
+
font-variant-numeric: tabular-nums;
|
|
2434
|
+
}
|
|
2435
|
+
.alive-stat-change {
|
|
2436
|
+
display: inline-flex;
|
|
2437
|
+
align-items: center;
|
|
2438
|
+
gap: 4px;
|
|
2439
|
+
font-size: 0.8125rem;
|
|
2440
|
+
font-weight: 600;
|
|
2441
|
+
}
|
|
2442
|
+
.alive-stat-up { color: #16a34a; }
|
|
2443
|
+
.alive-stat-down { color: #dc2626; }
|
|
2444
|
+
/* Dark variant */
|
|
2445
|
+
.alive-stat-dark {
|
|
2446
|
+
background: rgba(255,255,255,0.05);
|
|
2447
|
+
border-color: rgba(255,255,255,0.09);
|
|
2448
|
+
box-shadow: none;
|
|
2449
|
+
}
|
|
2450
|
+
.alive-stat-dark .alive-stat-label { color: rgba(255,255,255,0.35); }
|
|
2451
|
+
.alive-stat-dark .alive-stat-value { color: #ffffff; }
|
|
2452
|
+
|
|
2453
|
+
/* \u2500\u2500 Feature Checklist \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */
|
|
2454
|
+
.alive-checklist {
|
|
2455
|
+
display: flex;
|
|
2456
|
+
flex-direction: column;
|
|
2457
|
+
gap: 0.875rem;
|
|
2458
|
+
}
|
|
2459
|
+
.alive-checklist-item {
|
|
2460
|
+
display: flex;
|
|
2461
|
+
align-items: flex-start;
|
|
2462
|
+
gap: 0.75rem;
|
|
2463
|
+
font-size: 0.9375rem;
|
|
2464
|
+
color: rgba(0,0,0,0.75);
|
|
2465
|
+
line-height: 1.45;
|
|
2466
|
+
}
|
|
2467
|
+
.alive-checklist-icon {
|
|
2468
|
+
flex-shrink: 0;
|
|
2469
|
+
width: 20px;
|
|
2470
|
+
height: 20px;
|
|
2471
|
+
border-radius: 50%;
|
|
2472
|
+
background: rgba(74,222,128,0.15);
|
|
2473
|
+
border: 1.5px solid rgba(74,222,128,0.4);
|
|
2474
|
+
display: flex;
|
|
2475
|
+
align-items: center;
|
|
2476
|
+
justify-content: center;
|
|
2477
|
+
margin-top: 2px;
|
|
2478
|
+
}
|
|
2479
|
+
.alive-checklist-icon::after {
|
|
2480
|
+
content: '';
|
|
2481
|
+
display: block;
|
|
2482
|
+
width: 5px;
|
|
2483
|
+
height: 9px;
|
|
2484
|
+
border-right: 2px solid #16a34a;
|
|
2485
|
+
border-bottom: 2px solid #16a34a;
|
|
2486
|
+
transform: rotate(45deg) translate(-1px, -1px);
|
|
2487
|
+
}
|
|
2488
|
+
/* Dark variant */
|
|
2489
|
+
.alive-checklist-dark .alive-checklist-item { color: rgba(255,255,255,0.75); }
|
|
2490
|
+
.alive-checklist-dark .alive-checklist-icon {
|
|
2491
|
+
background: rgba(74,222,128,0.12);
|
|
2492
|
+
border-color: rgba(74,222,128,0.3);
|
|
2493
|
+
}
|
|
2494
|
+
|
|
2495
|
+
/* \u2500\u2500 Dot Grid Background \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */
|
|
2496
|
+
.alive-dot-grid {
|
|
2497
|
+
background-image: radial-gradient(circle, rgba(0,0,0,0.12) 1px, transparent 1px);
|
|
2498
|
+
background-size: 24px 24px;
|
|
2499
|
+
}
|
|
2500
|
+
.alive-dot-grid-sm { background-size: 16px 16px; }
|
|
2501
|
+
.alive-dot-grid-lg { background-size: 32px 32px; }
|
|
2502
|
+
.alive-dot-grid-dark {
|
|
2503
|
+
background-image: radial-gradient(circle, rgba(255,255,255,0.12) 1px, transparent 1px);
|
|
2504
|
+
}
|
|
2505
|
+
|
|
2506
|
+
/* \u2500\u2500 Terminal / Code Block \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */
|
|
2507
|
+
.alive-terminal {
|
|
2508
|
+
border-radius: 10px;
|
|
2509
|
+
overflow: hidden;
|
|
2510
|
+
background: #0f0f0f;
|
|
2511
|
+
border: 1px solid rgba(255,255,255,0.08);
|
|
2512
|
+
box-shadow: 0 16px 48px rgba(0,0,0,0.4);
|
|
2513
|
+
font-family: ui-monospace, 'Cascadia Code', 'Fira Code', monospace;
|
|
2514
|
+
}
|
|
2515
|
+
.alive-terminal-bar {
|
|
2516
|
+
display: flex;
|
|
2517
|
+
align-items: center;
|
|
2518
|
+
gap: 8px;
|
|
2519
|
+
padding: 10px 16px;
|
|
2520
|
+
background: #161616;
|
|
2521
|
+
border-bottom: 1px solid rgba(255,255,255,0.06);
|
|
2522
|
+
flex-shrink: 0;
|
|
2523
|
+
}
|
|
2524
|
+
.alive-terminal-body {
|
|
2525
|
+
padding: 1.25rem 1.5rem;
|
|
2526
|
+
font-size: 0.8125rem;
|
|
2527
|
+
line-height: 1.7;
|
|
2528
|
+
color: rgba(255,255,255,0.75);
|
|
2529
|
+
overflow: auto;
|
|
2530
|
+
}
|
|
2531
|
+
.alive-terminal-prompt {
|
|
2532
|
+
color: rgba(255,255,255,0.25);
|
|
2533
|
+
user-select: none;
|
|
2534
|
+
}
|
|
2535
|
+
.alive-terminal-cmd { color: #60a5fa; }
|
|
2536
|
+
.alive-terminal-out { color: rgba(255,255,255,0.45); }
|
|
2537
|
+
.alive-terminal-ok { color: #4ade80; }
|
|
2538
|
+
.alive-terminal-err { color: #f87171; }
|
|
2294
2539
|
`;
|
|
2295
2540
|
}
|
|
2296
2541
|
|