@c2n/theme 0.0.10 → 0.0.11
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/base.css +21 -0
- package/dist/report.json +254 -5
- package/dist/theme.css +21 -0
- package/dist/tokens.json +16 -0
- package/package.json +3 -2
package/dist/base.css
CHANGED
|
@@ -412,6 +412,27 @@
|
|
|
412
412
|
--c2-copy-button--transition-duration: calc(150ms * var(--c2-theme--motion-scale, 1));
|
|
413
413
|
}
|
|
414
414
|
|
|
415
|
+
/* @c2n/dashboard */
|
|
416
|
+
:root,
|
|
417
|
+
:host {
|
|
418
|
+
--c2-dash-card__expanded--animation-duration: calc(200ms * var(--c2-theme--motion-scale, 1));
|
|
419
|
+
--c2-dash-card__header--color: var(--c2-theme--color-on-surface, #18181b);
|
|
420
|
+
--c2-dash-card__header--font-size: var(--c2-theme--font-size-md, 14px);
|
|
421
|
+
--c2-dash-card__header--font-weight: var(--c2-theme--font-weight-semibold, 600);
|
|
422
|
+
--c2-dash-card__footer--color: var(--c2-theme--color-on-surface-variant, #71717a);
|
|
423
|
+
--c2-dash-card__footer--font-size: var(--c2-theme--font-size-sm, 12px);
|
|
424
|
+
--c2-dash-card__control--border-radius: var(--c2-theme--radius-md, 6px);
|
|
425
|
+
--c2-dash-card__control--color: var(--c2-theme--color-on-surface-variant, #71717a);
|
|
426
|
+
--c2-dash-card__control__hover--background: var(--c2-theme--color-surface-container, #f4f4f5);
|
|
427
|
+
--c2-dash-card__control__hover--color: var(--c2-theme--color-on-surface, #18181b);
|
|
428
|
+
--c2-dash-card__control__focus--outline: var(--c2-theme--focus-ring, 2px solid rgba(2, 101, 220, 0.4));
|
|
429
|
+
--c2-dash-card__handle__hover--background: var(--c2-theme--color-primary-glow, rgba(2, 101, 220, 0.2));
|
|
430
|
+
--c2-dash-card__handle__active--background: var(--c2-theme--color-primary, rgb(2, 101, 220));
|
|
431
|
+
--c2-dash-card__handle--border-radius: var(--c2-theme--radius-full, 999px);
|
|
432
|
+
--c2-dash-card__handle--transition-duration: calc(150ms * var(--c2-theme--motion-scale, 1));
|
|
433
|
+
--c2-dash-card__handle__focus--outline: var(--c2-theme--focus-ring, 2px solid rgba(2, 101, 220, 0.4));
|
|
434
|
+
}
|
|
435
|
+
|
|
415
436
|
/* @c2n/date-input */
|
|
416
437
|
:root,
|
|
417
438
|
:host {
|
package/dist/report.json
CHANGED
|
@@ -2297,6 +2297,255 @@
|
|
|
2297
2297
|
}
|
|
2298
2298
|
]
|
|
2299
2299
|
},
|
|
2300
|
+
"@c2n/dashboard": {
|
|
2301
|
+
"total": 51,
|
|
2302
|
+
"mapped": 16,
|
|
2303
|
+
"unmapped": 21,
|
|
2304
|
+
"excluded": 13,
|
|
2305
|
+
"noDefault": 1,
|
|
2306
|
+
"unmappedVars": [
|
|
2307
|
+
{
|
|
2308
|
+
"name": "--c2-dashboard--gap",
|
|
2309
|
+
"type": "pixel",
|
|
2310
|
+
"default": "8px",
|
|
2311
|
+
"rule": "R13",
|
|
2312
|
+
"reason": "property gap is not themed by design"
|
|
2313
|
+
},
|
|
2314
|
+
{
|
|
2315
|
+
"name": "--c2-dashboard--padding",
|
|
2316
|
+
"type": "padding",
|
|
2317
|
+
"default": "0px",
|
|
2318
|
+
"rule": "R13",
|
|
2319
|
+
"reason": "property padding is not themed by design"
|
|
2320
|
+
},
|
|
2321
|
+
{
|
|
2322
|
+
"name": "--c2-dash-card--padding",
|
|
2323
|
+
"type": "padding",
|
|
2324
|
+
"default": "0px",
|
|
2325
|
+
"rule": "R13",
|
|
2326
|
+
"reason": "property padding is not themed by design"
|
|
2327
|
+
},
|
|
2328
|
+
{
|
|
2329
|
+
"name": "--c2-dash-card--overflow",
|
|
2330
|
+
"type": "overflow",
|
|
2331
|
+
"default": "hidden",
|
|
2332
|
+
"rule": "R13",
|
|
2333
|
+
"reason": "property overflow is not themed by design"
|
|
2334
|
+
},
|
|
2335
|
+
{
|
|
2336
|
+
"name": "--c2-dash-card__expanded--z-index",
|
|
2337
|
+
"type": "number",
|
|
2338
|
+
"default": "20",
|
|
2339
|
+
"rule": "R13",
|
|
2340
|
+
"reason": "property z-index is not themed by design"
|
|
2341
|
+
},
|
|
2342
|
+
{
|
|
2343
|
+
"name": "--c2-dash-card__header--min-height",
|
|
2344
|
+
"type": "pixel",
|
|
2345
|
+
"default": "44px",
|
|
2346
|
+
"rule": "R13",
|
|
2347
|
+
"reason": "property min-height is not themed by design"
|
|
2348
|
+
},
|
|
2349
|
+
{
|
|
2350
|
+
"name": "--c2-dash-card__header--padding-block",
|
|
2351
|
+
"type": "padding",
|
|
2352
|
+
"default": "8px",
|
|
2353
|
+
"rule": "R13",
|
|
2354
|
+
"reason": "property padding-block is not themed by design"
|
|
2355
|
+
},
|
|
2356
|
+
{
|
|
2357
|
+
"name": "--c2-dash-card__header--padding-inline",
|
|
2358
|
+
"type": "padding",
|
|
2359
|
+
"default": "12px",
|
|
2360
|
+
"rule": "R13",
|
|
2361
|
+
"reason": "property padding-inline is not themed by design"
|
|
2362
|
+
},
|
|
2363
|
+
{
|
|
2364
|
+
"name": "--c2-dash-card__header--gap",
|
|
2365
|
+
"type": "pixel",
|
|
2366
|
+
"default": "12px",
|
|
2367
|
+
"rule": "R13",
|
|
2368
|
+
"reason": "property gap is not themed by design"
|
|
2369
|
+
},
|
|
2370
|
+
{
|
|
2371
|
+
"name": "--c2-dash-card__footer--min-height",
|
|
2372
|
+
"type": "pixel",
|
|
2373
|
+
"default": "36px",
|
|
2374
|
+
"rule": "R13",
|
|
2375
|
+
"reason": "property min-height is not themed by design"
|
|
2376
|
+
},
|
|
2377
|
+
{
|
|
2378
|
+
"name": "--c2-dash-card__footer--padding-block",
|
|
2379
|
+
"type": "padding",
|
|
2380
|
+
"default": "6px",
|
|
2381
|
+
"rule": "R13",
|
|
2382
|
+
"reason": "property padding-block is not themed by design"
|
|
2383
|
+
},
|
|
2384
|
+
{
|
|
2385
|
+
"name": "--c2-dash-card__footer--padding-inline",
|
|
2386
|
+
"type": "padding",
|
|
2387
|
+
"default": "12px",
|
|
2388
|
+
"rule": "R13",
|
|
2389
|
+
"reason": "property padding-inline is not themed by design"
|
|
2390
|
+
},
|
|
2391
|
+
{
|
|
2392
|
+
"name": "--c2-dash-card__footer--gap",
|
|
2393
|
+
"type": "pixel",
|
|
2394
|
+
"default": "8px",
|
|
2395
|
+
"rule": "R13",
|
|
2396
|
+
"reason": "property gap is not themed by design"
|
|
2397
|
+
},
|
|
2398
|
+
{
|
|
2399
|
+
"name": "--c2-dash-card__actions--gap",
|
|
2400
|
+
"type": "pixel",
|
|
2401
|
+
"default": "8px",
|
|
2402
|
+
"rule": "R13",
|
|
2403
|
+
"reason": "property gap is not themed by design"
|
|
2404
|
+
},
|
|
2405
|
+
{
|
|
2406
|
+
"name": "--c2-dash-card__controls--gap",
|
|
2407
|
+
"type": "pixel",
|
|
2408
|
+
"default": "2px",
|
|
2409
|
+
"rule": "R13",
|
|
2410
|
+
"reason": "property gap is not themed by design"
|
|
2411
|
+
},
|
|
2412
|
+
{
|
|
2413
|
+
"name": "--c2-dash-card__controls--offset",
|
|
2414
|
+
"type": "pixel",
|
|
2415
|
+
"default": "4px",
|
|
2416
|
+
"rule": "R13",
|
|
2417
|
+
"reason": "property offset is not themed by design"
|
|
2418
|
+
},
|
|
2419
|
+
{
|
|
2420
|
+
"name": "--c2-dash-card__control--size",
|
|
2421
|
+
"type": "pixel",
|
|
2422
|
+
"default": "24px",
|
|
2423
|
+
"rule": "R13",
|
|
2424
|
+
"reason": "property size is not themed by design"
|
|
2425
|
+
},
|
|
2426
|
+
{
|
|
2427
|
+
"name": "--c2-dash-card__control--icon-size",
|
|
2428
|
+
"type": "pixel",
|
|
2429
|
+
"default": "16px",
|
|
2430
|
+
"rule": "R13",
|
|
2431
|
+
"reason": "property icon-size is not themed by design"
|
|
2432
|
+
},
|
|
2433
|
+
{
|
|
2434
|
+
"name": "--c2-dash-card__control__focus--outline-offset",
|
|
2435
|
+
"type": "pixel",
|
|
2436
|
+
"default": "2px",
|
|
2437
|
+
"rule": "R13",
|
|
2438
|
+
"reason": "property outline-offset is not themed by design"
|
|
2439
|
+
},
|
|
2440
|
+
{
|
|
2441
|
+
"name": "--c2-dash-card__handle--size",
|
|
2442
|
+
"type": "pixel",
|
|
2443
|
+
"default": "6px",
|
|
2444
|
+
"rule": "R13",
|
|
2445
|
+
"reason": "property size is not themed by design"
|
|
2446
|
+
},
|
|
2447
|
+
{
|
|
2448
|
+
"name": "--c2-dash-card__handle--inset",
|
|
2449
|
+
"type": "pixel",
|
|
2450
|
+
"default": "2px",
|
|
2451
|
+
"rule": "R13",
|
|
2452
|
+
"reason": "property inset is not themed by design"
|
|
2453
|
+
}
|
|
2454
|
+
],
|
|
2455
|
+
"excludedVars": [
|
|
2456
|
+
{
|
|
2457
|
+
"name": "--c2-dashboard--background",
|
|
2458
|
+
"type": "background",
|
|
2459
|
+
"default": "transparent",
|
|
2460
|
+
"rule": "R2",
|
|
2461
|
+
"reason": "keyword / derived value transparent"
|
|
2462
|
+
},
|
|
2463
|
+
{
|
|
2464
|
+
"name": "--c2-dashboard--border",
|
|
2465
|
+
"type": "border",
|
|
2466
|
+
"default": "none",
|
|
2467
|
+
"rule": "R2",
|
|
2468
|
+
"reason": "keyword / derived value none"
|
|
2469
|
+
},
|
|
2470
|
+
{
|
|
2471
|
+
"name": "--c2-dashboard--border-radius",
|
|
2472
|
+
"type": "border-radius",
|
|
2473
|
+
"default": "0px",
|
|
2474
|
+
"rule": "R0",
|
|
2475
|
+
"reason": "square by default; the grid is a frame only once an app fills it"
|
|
2476
|
+
},
|
|
2477
|
+
{
|
|
2478
|
+
"name": "--c2-dash-card--background",
|
|
2479
|
+
"type": "background",
|
|
2480
|
+
"default": "transparent",
|
|
2481
|
+
"rule": "R2",
|
|
2482
|
+
"reason": "keyword / derived value transparent"
|
|
2483
|
+
},
|
|
2484
|
+
{
|
|
2485
|
+
"name": "--c2-dash-card--border",
|
|
2486
|
+
"type": "border",
|
|
2487
|
+
"default": "none",
|
|
2488
|
+
"rule": "R2",
|
|
2489
|
+
"reason": "keyword / derived value none"
|
|
2490
|
+
},
|
|
2491
|
+
{
|
|
2492
|
+
"name": "--c2-dash-card--border-radius",
|
|
2493
|
+
"type": "border-radius",
|
|
2494
|
+
"default": "0px",
|
|
2495
|
+
"rule": "R0",
|
|
2496
|
+
"reason": "bare pane; the surface inside it owns the radius"
|
|
2497
|
+
},
|
|
2498
|
+
{
|
|
2499
|
+
"name": "--c2-dash-card--box-shadow",
|
|
2500
|
+
"type": "box-shadow",
|
|
2501
|
+
"default": "none",
|
|
2502
|
+
"rule": "R2",
|
|
2503
|
+
"reason": "keyword / derived value none"
|
|
2504
|
+
},
|
|
2505
|
+
{
|
|
2506
|
+
"name": "--c2-dash-card__header--background",
|
|
2507
|
+
"type": "background",
|
|
2508
|
+
"default": "transparent",
|
|
2509
|
+
"rule": "R2",
|
|
2510
|
+
"reason": "keyword / derived value transparent"
|
|
2511
|
+
},
|
|
2512
|
+
{
|
|
2513
|
+
"name": "--c2-dash-card__header--border-bottom",
|
|
2514
|
+
"type": "border",
|
|
2515
|
+
"default": "none",
|
|
2516
|
+
"rule": "R2",
|
|
2517
|
+
"reason": "keyword / derived value none"
|
|
2518
|
+
},
|
|
2519
|
+
{
|
|
2520
|
+
"name": "--c2-dash-card__footer--background",
|
|
2521
|
+
"type": "background",
|
|
2522
|
+
"default": "transparent",
|
|
2523
|
+
"rule": "R2",
|
|
2524
|
+
"reason": "keyword / derived value transparent"
|
|
2525
|
+
},
|
|
2526
|
+
{
|
|
2527
|
+
"name": "--c2-dash-card__footer--border-top",
|
|
2528
|
+
"type": "border",
|
|
2529
|
+
"default": "none",
|
|
2530
|
+
"rule": "R2",
|
|
2531
|
+
"reason": "keyword / derived value none"
|
|
2532
|
+
},
|
|
2533
|
+
{
|
|
2534
|
+
"name": "--c2-dash-card__control--background",
|
|
2535
|
+
"type": "background",
|
|
2536
|
+
"default": "transparent",
|
|
2537
|
+
"rule": "R2",
|
|
2538
|
+
"reason": "keyword / derived value transparent"
|
|
2539
|
+
},
|
|
2540
|
+
{
|
|
2541
|
+
"name": "--c2-dash-card__handle--background",
|
|
2542
|
+
"type": "background",
|
|
2543
|
+
"default": "transparent",
|
|
2544
|
+
"rule": "R2",
|
|
2545
|
+
"reason": "keyword / derived value transparent"
|
|
2546
|
+
}
|
|
2547
|
+
]
|
|
2548
|
+
},
|
|
2300
2549
|
"@c2n/date-input": {
|
|
2301
2550
|
"total": 26,
|
|
2302
2551
|
"mapped": 16,
|
|
@@ -7108,11 +7357,11 @@
|
|
|
7108
7357
|
}
|
|
7109
7358
|
},
|
|
7110
7359
|
"totals": {
|
|
7111
|
-
"total":
|
|
7112
|
-
"mapped":
|
|
7113
|
-
"unmapped":
|
|
7114
|
-
"excluded":
|
|
7115
|
-
"noDefault":
|
|
7360
|
+
"total": 2141,
|
|
7361
|
+
"mapped": 935,
|
|
7362
|
+
"unmapped": 711,
|
|
7363
|
+
"excluded": 237,
|
|
7364
|
+
"noDefault": 258
|
|
7116
7365
|
},
|
|
7117
7366
|
"unparsed": []
|
|
7118
7367
|
}
|
package/dist/theme.css
CHANGED
|
@@ -540,6 +540,27 @@
|
|
|
540
540
|
--c2-copy-button--transition-duration: calc(150ms * var(--c2-theme--motion-scale, 1));
|
|
541
541
|
}
|
|
542
542
|
|
|
543
|
+
/* @c2n/dashboard */
|
|
544
|
+
:root,
|
|
545
|
+
:host {
|
|
546
|
+
--c2-dash-card__expanded--animation-duration: calc(200ms * var(--c2-theme--motion-scale, 1));
|
|
547
|
+
--c2-dash-card__header--color: var(--c2-theme--color-on-surface, #18181b);
|
|
548
|
+
--c2-dash-card__header--font-size: var(--c2-theme--font-size-md, 14px);
|
|
549
|
+
--c2-dash-card__header--font-weight: var(--c2-theme--font-weight-semibold, 600);
|
|
550
|
+
--c2-dash-card__footer--color: var(--c2-theme--color-on-surface-variant, #71717a);
|
|
551
|
+
--c2-dash-card__footer--font-size: var(--c2-theme--font-size-sm, 12px);
|
|
552
|
+
--c2-dash-card__control--border-radius: var(--c2-theme--radius-md, 6px);
|
|
553
|
+
--c2-dash-card__control--color: var(--c2-theme--color-on-surface-variant, #71717a);
|
|
554
|
+
--c2-dash-card__control__hover--background: var(--c2-theme--color-surface-container, #f4f4f5);
|
|
555
|
+
--c2-dash-card__control__hover--color: var(--c2-theme--color-on-surface, #18181b);
|
|
556
|
+
--c2-dash-card__control__focus--outline: var(--c2-theme--focus-ring, 2px solid rgba(2, 101, 220, 0.4));
|
|
557
|
+
--c2-dash-card__handle__hover--background: var(--c2-theme--color-primary-glow, rgba(2, 101, 220, 0.2));
|
|
558
|
+
--c2-dash-card__handle__active--background: var(--c2-theme--color-primary, rgb(2, 101, 220));
|
|
559
|
+
--c2-dash-card__handle--border-radius: var(--c2-theme--radius-full, 999px);
|
|
560
|
+
--c2-dash-card__handle--transition-duration: calc(150ms * var(--c2-theme--motion-scale, 1));
|
|
561
|
+
--c2-dash-card__handle__focus--outline: var(--c2-theme--focus-ring, 2px solid rgba(2, 101, 220, 0.4));
|
|
562
|
+
}
|
|
563
|
+
|
|
543
564
|
/* @c2n/date-input */
|
|
544
565
|
:root,
|
|
545
566
|
:host {
|
package/dist/tokens.json
CHANGED
|
@@ -590,6 +590,22 @@
|
|
|
590
590
|
"--c2-copy-button__container__focus--outline": "--c2-theme--focus-ring",
|
|
591
591
|
"--c2-copy-button__container__disabled--opacity": "--c2-theme--disabled-opacity",
|
|
592
592
|
"--c2-copy-button--transition-duration": "--c2-theme--motion-scale",
|
|
593
|
+
"--c2-dash-card__expanded--animation-duration": "--c2-theme--motion-scale",
|
|
594
|
+
"--c2-dash-card__header--color": "--c2-theme--color-on-surface",
|
|
595
|
+
"--c2-dash-card__header--font-size": "--c2-theme--font-size-md",
|
|
596
|
+
"--c2-dash-card__header--font-weight": "--c2-theme--font-weight-semibold",
|
|
597
|
+
"--c2-dash-card__footer--color": "--c2-theme--color-on-surface-variant",
|
|
598
|
+
"--c2-dash-card__footer--font-size": "--c2-theme--font-size-sm",
|
|
599
|
+
"--c2-dash-card__control--border-radius": "--c2-theme--radius-md",
|
|
600
|
+
"--c2-dash-card__control--color": "--c2-theme--color-on-surface-variant",
|
|
601
|
+
"--c2-dash-card__control__hover--background": "--c2-theme--color-surface-container",
|
|
602
|
+
"--c2-dash-card__control__hover--color": "--c2-theme--color-on-surface",
|
|
603
|
+
"--c2-dash-card__control__focus--outline": "--c2-theme--focus-ring",
|
|
604
|
+
"--c2-dash-card__handle__hover--background": "--c2-theme--color-primary-glow",
|
|
605
|
+
"--c2-dash-card__handle__active--background": "--c2-theme--color-primary",
|
|
606
|
+
"--c2-dash-card__handle--border-radius": "--c2-theme--radius-full",
|
|
607
|
+
"--c2-dash-card__handle--transition-duration": "--c2-theme--motion-scale",
|
|
608
|
+
"--c2-dash-card__handle__focus--outline": "--c2-theme--focus-ring",
|
|
593
609
|
"--c2-date-input--border": "--c2-theme--border",
|
|
594
610
|
"--c2-date-input--border-radius": "--c2-theme--radius-md",
|
|
595
611
|
"--c2-date-input--color": "--c2-theme--color-on-surface",
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@c2n/theme",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.11",
|
|
4
4
|
"description": "Design tokens (--c2-theme--*) and a generated base theme that maps every @c2n component CSS variable onto them",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"main": "dist/tokens.js",
|
|
@@ -54,6 +54,7 @@
|
|
|
54
54
|
"build": {
|
|
55
55
|
"dependencies": [
|
|
56
56
|
"type-check",
|
|
57
|
+
"../../components/dashboard:build",
|
|
57
58
|
"../../components/steps:build",
|
|
58
59
|
"../../components/code-editor:build",
|
|
59
60
|
"../../components/theme-select:build",
|
|
@@ -131,5 +132,5 @@
|
|
|
131
132
|
"@c2n/config": "*",
|
|
132
133
|
"prettier": "3.9.6"
|
|
133
134
|
},
|
|
134
|
-
"gitHead": "
|
|
135
|
+
"gitHead": "bf962fba5e49a0ac7555a082584e262949d323a5"
|
|
135
136
|
}
|