@astryxdesign/theme-gothic 0.5.4-canary.4d2bde2 → 0.5.4-canary.53bc34d

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.
Files changed (2) hide show
  1. package/dist/theme.css +64 -64
  2. package/package.json +3 -3
package/dist/theme.css CHANGED
@@ -314,126 +314,126 @@
314
314
  --shadow-inset-error: inset 0px 0px 0px 1px #d4485150;
315
315
  }
316
316
 
317
- .astryx-heading[data-level="1"] {
317
+ .astryx-heading.level-1 {
318
318
  font-family: var(--font-family-heading);
319
319
  font-size: var(--text-heading-1-size);
320
320
  font-weight: var(--text-heading-1-weight);
321
321
  line-height: var(--text-heading-1-leading);
322
322
  }
323
323
 
324
- .astryx-heading[data-level="2"] {
324
+ .astryx-heading.level-2 {
325
325
  font-family: var(--font-family-heading);
326
326
  font-size: var(--text-heading-2-size);
327
327
  font-weight: var(--text-heading-2-weight);
328
328
  line-height: var(--text-heading-2-leading);
329
329
  }
330
330
 
331
- .astryx-heading[data-level="3"] {
331
+ .astryx-heading.level-3 {
332
332
  font-family: var(--font-family-heading);
333
333
  font-size: var(--text-heading-3-size);
334
334
  font-weight: var(--text-heading-3-weight);
335
335
  line-height: var(--text-heading-3-leading);
336
336
  }
337
337
 
338
- .astryx-heading[data-level="4"] {
338
+ .astryx-heading.level-4 {
339
339
  font-family: var(--font-family-heading);
340
340
  font-size: var(--text-heading-4-size);
341
341
  font-weight: var(--text-heading-4-weight);
342
342
  line-height: var(--text-heading-4-leading);
343
343
  }
344
344
 
345
- .astryx-heading[data-level="5"] {
345
+ .astryx-heading.level-5 {
346
346
  font-family: var(--font-family-heading);
347
347
  font-size: var(--text-heading-5-size);
348
348
  font-weight: var(--text-heading-5-weight);
349
349
  line-height: var(--text-heading-5-leading);
350
350
  }
351
351
 
352
- .astryx-heading[data-level="6"] {
352
+ .astryx-heading.level-6 {
353
353
  font-family: var(--font-family-heading);
354
354
  font-size: var(--text-heading-6-size);
355
355
  font-weight: var(--text-heading-6-weight);
356
356
  line-height: var(--text-heading-6-leading);
357
357
  }
358
358
 
359
- .astryx-heading[data-type="display-1"] {
359
+ .astryx-heading.display-1 {
360
360
  font-family: var(--font-family-heading);
361
361
  font-size: var(--text-display-1-size);
362
362
  line-height: var(--text-display-1-leading);
363
363
  }
364
364
 
365
- .astryx-heading[data-type="display-2"] {
365
+ .astryx-heading.display-2 {
366
366
  font-family: var(--font-family-heading);
367
367
  font-size: var(--text-display-2-size);
368
368
  line-height: var(--text-display-2-leading);
369
369
  }
370
370
 
371
- .astryx-heading[data-type="display-3"] {
371
+ .astryx-heading.display-3 {
372
372
  font-family: var(--font-family-heading);
373
373
  font-size: var(--text-display-3-size);
374
374
  line-height: var(--text-display-3-leading);
375
375
  }
376
376
 
377
- .astryx-text[data-type="body"] {
377
+ .astryx-text.body {
378
378
  font-family: var(--font-family-body);
379
379
  font-size: var(--text-body-size);
380
380
  line-height: var(--text-body-leading);
381
381
  }
382
382
 
383
- .astryx-text[data-type="large"] {
383
+ .astryx-text.large {
384
384
  font-family: var(--font-family-body);
385
385
  font-size: var(--text-large-size);
386
386
  line-height: var(--text-large-leading);
387
387
  }
388
388
 
389
- .astryx-text[data-type="label"] {
389
+ .astryx-text.label {
390
390
  font-family: var(--font-family-body);
391
391
  font-size: var(--text-label-size);
392
392
  line-height: var(--text-label-leading);
393
393
  }
394
394
 
395
- .astryx-text[data-type="code"] {
395
+ .astryx-text.code {
396
396
  font-family: var(--font-family-code);
397
397
  font-size: var(--text-code-size);
398
398
  line-height: var(--text-code-leading);
399
399
  }
400
400
 
401
- .astryx-text[data-type="supporting"] {
401
+ .astryx-text.supporting {
402
402
  font-family: var(--font-family-body);
403
403
  font-size: var(--text-supporting-size);
404
404
  line-height: var(--text-supporting-leading);
405
405
  }
406
406
 
407
- .astryx-text[data-type="display-1"] {
407
+ .astryx-text.display-1 {
408
408
  font-family: "Manufacturing Consent", "UnifrakturMaguntia", "Old English Text MT", serif;
409
409
  font-size: var(--text-display-1-size);
410
410
  line-height: var(--text-display-1-leading);
411
411
  }
412
412
 
413
- .astryx-text[data-type="display-2"] {
413
+ .astryx-text.display-2 {
414
414
  font-family: "Manufacturing Consent", "UnifrakturMaguntia", "Old English Text MT", serif;
415
415
  font-size: var(--text-display-2-size);
416
416
  line-height: var(--text-display-2-leading);
417
417
  }
418
418
 
419
- .astryx-text[data-type="display-3"] {
419
+ .astryx-text.display-3 {
420
420
  font-family: "Manufacturing Consent", "UnifrakturMaguntia", "Old English Text MT", serif;
421
421
  font-size: var(--text-display-3-size);
422
422
  line-height: var(--text-display-3-leading);
423
423
  }
424
424
 
425
- .astryx-button[data-variant="secondary"] {
425
+ .astryx-button.secondary {
426
426
  background-color: var(--color-background-gray);
427
427
  color: var(--color-text-gray);
428
428
  border-color: transparent;
429
429
  border-width: 0;
430
430
  }
431
431
 
432
- .astryx-button[data-variant="ghost"]:hover:where(:not(:disabled,[aria-disabled="true"])) {
432
+ .astryx-button.ghost:hover:where(:not(:disabled,[aria-disabled="true"])) {
433
433
  background-color: var(--color-overlay-hover);
434
434
  }
435
435
 
436
- .astryx-button[data-variant="destructive"] {
436
+ .astryx-button.destructive {
437
437
  background-color: var(--color-error);
438
438
  color: var(--color-text-red);
439
439
  }
@@ -443,27 +443,27 @@
443
443
  font-weight: var(--font-weight-medium);
444
444
  }
445
445
 
446
- .astryx-badge[data-variant="info"] {
446
+ .astryx-badge.info {
447
447
  background-color: var(--color-background-blue);
448
448
  color: var(--color-text-blue);
449
449
  }
450
450
 
451
- .astryx-badge[data-variant="neutral"] {
451
+ .astryx-badge.neutral {
452
452
  background-color: var(--color-background-gray);
453
453
  color: var(--color-text-gray);
454
454
  }
455
455
 
456
- .astryx-badge[data-variant="success"] {
456
+ .astryx-badge.success {
457
457
  background-color: var(--color-background-green);
458
458
  color: var(--color-text-green);
459
459
  }
460
460
 
461
- .astryx-badge[data-variant="warning"] {
461
+ .astryx-badge.warning {
462
462
  background-color: var(--color-background-yellow);
463
463
  color: var(--color-text-yellow);
464
464
  }
465
465
 
466
- .astryx-badge[data-variant="error"] {
466
+ .astryx-badge.error {
467
467
  background-color: var(--color-background-red);
468
468
  color: var(--color-text-red);
469
469
  }
@@ -473,28 +473,28 @@
473
473
  --_banner-radius: var(--radius-element);
474
474
  }
475
475
 
476
- .astryx-banner[data-status="info"] {
476
+ .astryx-banner.info {
477
477
  background-color: var(--color-background-blue);
478
478
  --color-text-primary: var(--color-text-blue);
479
479
  --color-text-secondary: var(--color-text-blue);
480
480
  --color-accent: var(--color-text-blue);
481
481
  }
482
482
 
483
- .astryx-banner[data-status="success"] {
483
+ .astryx-banner.success {
484
484
  background-color: var(--color-background-green);
485
485
  --color-text-primary: var(--color-text-green);
486
486
  --color-text-secondary: var(--color-text-green);
487
487
  --color-success: var(--color-text-green);
488
488
  }
489
489
 
490
- .astryx-banner[data-status="warning"] {
490
+ .astryx-banner.warning {
491
491
  background-color: var(--color-background-yellow);
492
492
  --color-text-primary: var(--color-text-yellow);
493
493
  --color-text-secondary: var(--color-text-yellow);
494
494
  --color-warning: var(--color-text-yellow);
495
495
  }
496
496
 
497
- .astryx-banner[data-status="error"] {
497
+ .astryx-banner.error {
498
498
  background-color: var(--color-background-red);
499
499
  --color-text-primary: var(--color-text-red);
500
500
  --color-text-secondary: var(--color-text-red);
@@ -507,52 +507,52 @@
507
507
  --_card-radius: var(--radius-container);
508
508
  }
509
509
 
510
- .astryx-card[data-variant="blue"] {
510
+ .astryx-card.blue {
511
511
  --color-text-primary: var(--color-text-blue);
512
512
  --color-text-secondary: var(--color-text-blue);
513
513
  }
514
514
 
515
- .astryx-card[data-variant="cyan"] {
515
+ .astryx-card.cyan {
516
516
  --color-text-primary: var(--color-text-cyan);
517
517
  --color-text-secondary: var(--color-text-cyan);
518
518
  }
519
519
 
520
- .astryx-card[data-variant="gray"] {
520
+ .astryx-card.gray {
521
521
  --color-text-primary: var(--color-text-gray);
522
522
  --color-text-secondary: var(--color-text-gray);
523
523
  }
524
524
 
525
- .astryx-card[data-variant="green"] {
525
+ .astryx-card.green {
526
526
  --color-text-primary: var(--color-text-green);
527
527
  --color-text-secondary: var(--color-text-green);
528
528
  }
529
529
 
530
- .astryx-card[data-variant="orange"] {
530
+ .astryx-card.orange {
531
531
  --color-text-primary: var(--color-text-orange);
532
532
  --color-text-secondary: var(--color-text-orange);
533
533
  }
534
534
 
535
- .astryx-card[data-variant="pink"] {
535
+ .astryx-card.pink {
536
536
  --color-text-primary: var(--color-text-pink);
537
537
  --color-text-secondary: var(--color-text-pink);
538
538
  }
539
539
 
540
- .astryx-card[data-variant="purple"] {
540
+ .astryx-card.purple {
541
541
  --color-text-primary: var(--color-text-purple);
542
542
  --color-text-secondary: var(--color-text-purple);
543
543
  }
544
544
 
545
- .astryx-card[data-variant="red"] {
545
+ .astryx-card.red {
546
546
  --color-text-primary: var(--color-text-red);
547
547
  --color-text-secondary: var(--color-text-red);
548
548
  }
549
549
 
550
- .astryx-card[data-variant="teal"] {
550
+ .astryx-card.teal {
551
551
  --color-text-primary: var(--color-text-teal);
552
552
  --color-text-secondary: var(--color-text-teal);
553
553
  }
554
554
 
555
- .astryx-card[data-variant="yellow"] {
555
+ .astryx-card.yellow {
556
556
  --color-text-primary: var(--color-text-yellow);
557
557
  --color-text-secondary: var(--color-text-yellow);
558
558
  }
@@ -566,55 +566,55 @@
566
566
  --_field-radius: var(--radius-element);
567
567
  }
568
568
 
569
- .astryx-text[data-color="primary"] { color: var(--color-text-primary); }
569
+ .astryx-text.primary { color: var(--color-text-primary); }
570
570
 
571
- .astryx-heading[data-color="primary"] { color: var(--color-text-primary); }
571
+ .astryx-heading.primary { color: var(--color-text-primary); }
572
572
 
573
- .astryx-text[data-color="secondary"] { color: var(--color-text-secondary); }
573
+ .astryx-text.secondary { color: var(--color-text-secondary); }
574
574
 
575
- .astryx-heading[data-color="secondary"] { color: var(--color-text-secondary); }
575
+ .astryx-heading.secondary { color: var(--color-text-secondary); }
576
576
 
577
- .astryx-text[data-color="disabled"] { color: var(--color-text-disabled); }
577
+ .astryx-text.disabled { color: var(--color-text-disabled); }
578
578
 
579
- .astryx-heading[data-color="disabled"] { color: var(--color-text-disabled); }
579
+ .astryx-heading.disabled { color: var(--color-text-disabled); }
580
580
 
581
- .astryx-text[data-color="placeholder"] { color: var(--color-text-secondary); }
581
+ .astryx-text.placeholder { color: var(--color-text-secondary); }
582
582
 
583
- .astryx-heading[data-color="placeholder"] { color: var(--color-text-secondary); }
583
+ .astryx-heading.placeholder { color: var(--color-text-secondary); }
584
584
 
585
- .astryx-text[data-color="accent"] { color: var(--color-text-accent); }
585
+ .astryx-text.accent { color: var(--color-text-accent); }
586
586
 
587
- .astryx-heading[data-color="accent"] { color: var(--color-text-accent); }
587
+ .astryx-heading.accent { color: var(--color-text-accent); }
588
588
 
589
- .astryx-text[data-size="4xs"] { font-size: var(--font-size-4xs); }
589
+ .astryx-text.size-4xs { font-size: var(--font-size-4xs); }
590
590
 
591
- .astryx-text[data-size="3xs"] { font-size: var(--font-size-3xs); }
591
+ .astryx-text.size-3xs { font-size: var(--font-size-3xs); }
592
592
 
593
- .astryx-text[data-size="2xs"] { font-size: var(--font-size-2xs); }
593
+ .astryx-text.size-2xs { font-size: var(--font-size-2xs); }
594
594
 
595
- .astryx-text[data-size="xsm"] { font-size: var(--font-size-xs); }
595
+ .astryx-text.xsm { font-size: var(--font-size-xs); }
596
596
 
597
- .astryx-text[data-size="sm"] { font-size: var(--font-size-sm); }
597
+ .astryx-text.sm { font-size: var(--font-size-sm); }
598
598
 
599
- .astryx-text[data-size="base"] { font-size: var(--font-size-base); }
599
+ .astryx-text.base { font-size: var(--font-size-base); }
600
600
 
601
- .astryx-text[data-size="lg"] { font-size: var(--font-size-lg); }
601
+ .astryx-text.lg { font-size: var(--font-size-lg); }
602
602
 
603
- .astryx-text[data-size="xl"] { font-size: var(--font-size-xl); }
603
+ .astryx-text.xl { font-size: var(--font-size-xl); }
604
604
 
605
- .astryx-text[data-size="2xl"] { font-size: var(--font-size-2xl); }
605
+ .astryx-text.size-2xl { font-size: var(--font-size-2xl); }
606
606
 
607
- .astryx-text[data-size="3xl"] { font-size: var(--font-size-3xl); }
607
+ .astryx-text.size-3xl { font-size: var(--font-size-3xl); }
608
608
 
609
- .astryx-text[data-size="4xl"] { font-size: var(--font-size-4xl); }
609
+ .astryx-text.size-4xl { font-size: var(--font-size-4xl); }
610
610
 
611
- .astryx-heading[data-weight="normal"] { font-weight: var(--font-weight-normal); }
611
+ .astryx-heading.normal { font-weight: var(--font-weight-normal); }
612
612
 
613
- .astryx-heading[data-weight="medium"] { font-weight: var(--font-weight-medium); }
613
+ .astryx-heading.medium { font-weight: var(--font-weight-medium); }
614
614
 
615
- .astryx-heading[data-weight="semibold"] { font-weight: var(--font-weight-semibold); }
615
+ .astryx-heading.semibold { font-weight: var(--font-weight-semibold); }
616
616
 
617
- .astryx-heading[data-weight="bold"] { font-weight: var(--font-weight-bold); }
617
+ .astryx-heading.bold { font-weight: var(--font-weight-bold); }
618
618
  }
619
619
  }
620
620
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@astryxdesign/theme-gothic",
3
- "version": "0.5.4-canary.4d2bde2",
3
+ "version": "0.5.4-canary.53bc34d",
4
4
  "displayName": "Gothic Theme",
5
5
  "private": false,
6
6
  "description": "Deep blue-grays and a signature display serif. Dramatic and editorial, for surfaces that want to be remembered.",
@@ -49,11 +49,11 @@
49
49
  "lucide-react": "^1.18.0"
50
50
  },
51
51
  "peerDependencies": {
52
- "@astryxdesign/core": "0.5.4-canary.4d2bde2",
52
+ "@astryxdesign/core": "0.5.4-canary.53bc34d",
53
53
  "react": ">=19"
54
54
  },
55
55
  "devDependencies": {
56
- "@astryxdesign/cli": "0.5.4-canary.4d2bde2"
56
+ "@astryxdesign/cli": "0.5.4-canary.53bc34d"
57
57
  },
58
58
  "module": "./dist/source.mjs",
59
59
  "scripts": {