@astryxdesign/theme-y2k 0.0.0-bootstrap.0 → 0.0.15

package/dist/theme.css

@@ -0,0 +1,529 @@
+/*
+ * @generated by `astryx theme build` — do not edit manually.
+ * Source: src/y2kTheme.ts
+ * Command: astryx theme build src/y2kTheme.ts --out dist/theme.css
+ * Generated: 2026-06-24T18:16:21.621Z
+ */
+
+@layer reset {
+@scope ([data-astryx-theme="y2k"]) to ([data-astryx-theme]) {
+  :where(h1, h2, h3, h4, h5, h6) {
+    font-family: var(--font-family-heading);
+    color: var(--color-text-primary);
+  }
+
+  :where(h1) {
+    font-size: var(--font-size-2xl);
+    font-weight: var(--font-weight-semibold);
+    line-height: 1.4194;
+  }
+
+  :where(h2) {
+    font-size: var(--font-size-xl);
+    font-weight: var(--font-weight-semibold);
+    line-height: 1.44;
+  }
+
+  :where(h3) {
+    font-size: var(--font-size-lg);
+    font-weight: var(--font-weight-semibold);
+    line-height: 1.4;
+  }
+
+  :where(h4) {
+    font-size: var(--font-size-base);
+    font-weight: var(--font-weight-semibold);
+    line-height: 1.5;
+  }
+
+  :where(h5) {
+    font-size: var(--font-size-sm);
+    font-weight: var(--font-weight-semibold);
+    line-height: 1.5385;
+  }
+
+  :where(h6) {
+    font-size: var(--font-size-xs);
+    font-weight: var(--font-weight-semibold);
+    line-height: 1.6;
+  }
+
+  :where(p) {
+    font-family: var(--font-family-body);
+    font-size: var(--font-size-base);
+    font-weight: var(--font-weight-normal);
+    line-height: 1.5;
+    color: var(--color-text-primary);
+  }
+
+  :where(small) {
+    font-size: 12px;
+    font-weight: var(--font-weight-normal);
+    line-height: 1.5385;
+    color: var(--color-text-secondary);
+  }
+
+  :where(code, pre) {
+    font-family: var(--font-family-code);
+    font-size: var(--font-size-base);
+    line-height: 1.5;
+  }
+
+  :where(hr) {
+    border: none;
+    border-top: 1px solid var(--color-border);
+  }
+}
+}
+
+@layer astryx-theme {
+  :root { color-scheme: light dark; }
+
+@scope ([data-astryx-theme="y2k"]) to ([data-astryx-theme]) {
+  :scope {
+    --font-size-4xs: 0.3125rem;
+    --font-size-3xs: 0.4375rem;
+    --font-size-2xs: 0.5rem;
+    --font-size-xs: 0.625rem;
+    --font-size-sm: 0.8125rem;
+    --font-size-base: 1rem;
+    --font-size-lg: 1.25rem;
+    --font-size-xl: 1.5625rem;
+    --font-size-2xl: 1.9375rem;
+    --font-size-3xl: 2.4375rem;
+    --font-size-4xl: 3.0625rem;
+    --font-size-5xl: 3.8125rem;
+    --text-heading-1-size: var(--font-size-2xl);
+    --text-heading-1-weight: var(--font-weight-semibold);
+    --text-heading-1-leading: 1.4194;
+    --text-heading-2-size: var(--font-size-xl);
+    --text-heading-2-weight: var(--font-weight-semibold);
+    --text-heading-2-leading: 1.44;
+    --text-heading-3-size: var(--font-size-lg);
+    --text-heading-3-weight: var(--font-weight-semibold);
+    --text-heading-3-leading: 1.4;
+    --text-heading-4-size: var(--font-size-base);
+    --text-heading-4-weight: var(--font-weight-semibold);
+    --text-heading-4-leading: 1.5;
+    --text-heading-5-size: var(--font-size-sm);
+    --text-heading-5-weight: var(--font-weight-semibold);
+    --text-heading-5-leading: 1.5385;
+    --text-heading-6-size: var(--font-size-xs);
+    --text-heading-6-weight: var(--font-weight-semibold);
+    --text-heading-6-leading: 1.6;
+    --text-body-size: var(--font-size-base);
+    --text-body-weight: var(--font-weight-normal);
+    --text-body-leading: 1.5;
+    --text-large-size: var(--font-size-lg);
+    --text-large-weight: var(--font-weight-semibold);
+    --text-large-leading: 1.4;
+    --text-label-size: var(--font-size-base);
+    --text-label-weight: var(--font-weight-medium);
+    --text-label-leading: 1.5;
+    --text-code-size: var(--font-size-base);
+    --text-code-weight: var(--font-weight-normal);
+    --text-code-leading: 1.5;
+    --text-supporting-size: 12px;
+    --text-supporting-weight: var(--font-weight-normal);
+    --text-supporting-leading: 1.5385;
+    --text-display-1-size: var(--font-size-5xl);
+    --text-display-1-weight: var(--font-weight-normal);
+    --text-display-1-leading: 1.2459;
+    --text-display-2-size: var(--font-size-4xl);
+    --text-display-2-weight: var(--font-weight-normal);
+    --text-display-2-leading: 1.2245;
+    --text-display-3-size: var(--font-size-3xl);
+    --text-display-3-weight: var(--font-weight-normal);
+    --text-display-3-leading: 1.2308;
+    --radius-none: 0px;
+    --radius-inner: 0px;
+    --radius-element: 0px;
+    --radius-container: 0px;
+    --radius-page: 0px;
+    --radius-chat: 0px;
+    --radius-full: 0px;
+    --duration-fast-min: 80ms;
+    --duration-fast: 100ms;
+    --duration-fast-max: 125ms;
+    --duration-medium-min: 200ms;
+    --duration-medium: 250ms;
+    --duration-medium-max: 315ms;
+    --duration-slow-min: 480ms;
+    --duration-slow: 600ms;
+    --duration-slow-max: 750ms;
+    --font-family-body: Poppins, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
+    --font-family-heading: Poppins, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
+    --font-family-code: "JetBrains Mono", "SF Mono", Monaco, Consolas, monospace;
+    --color-syntax-keyword: light-dark(#615a7a, #aea6ca);
+    --color-syntax-string: light-dark(#586242, #a5af8b);
+    --color-syntax-comment: light-dark(#5e5e5e, #ababab);
+    --color-syntax-number: light-dark(#775843, #c8a48c);
+    --color-syntax-function: light-dark(#39637d, #87b0cd);
+    --color-syntax-type: light-dark(#615a7a, #aea6ca);
+    --color-syntax-variable: light-dark(#5e5e5e, #ababab);
+    --color-syntax-operator: light-dark(#5e5e5e, #ababab);
+    --color-syntax-constant: light-dark(#775843, #c8a48c);
+    --color-syntax-tag: light-dark(#7f5351, #d19f9d);
+    --color-syntax-attribute: light-dark(#6c5c3e, #bca987);
+    --color-syntax-property: light-dark(#3c6755, #87b5a1);
+    --color-syntax-punctuation: light-dark(#5e5e5e, #ababab);
+    --color-syntax-background: light-dark(#FFF6ED, #190f00);
+    --spacing-0-5: 3px;
+    --spacing-1: 6px;
+    --spacing-1-5: 9px;
+    --spacing-2: 12px;
+    --spacing-3: 18px;
+    --spacing-4: 24px;
+    --spacing-5: 30px;
+    --spacing-6: 36px;
+    --spacing-7: 42px;
+    --spacing-8: 48px;
+    --size-element-sm: 32px;
+    --size-element-md: 40px;
+    --size-element-lg: 48px;
+    --color-accent: light-dark(#2d241b, #EDEFFC);
+    --color-accent-muted: light-dark(#2d241b14, #EDEFFC20);
+    --color-neutral: light-dark(#2d241b10, #EDEFFC1A);
+    --color-background-surface: light-dark(#FFFFFF, #16182b);
+    --color-background-body: light-dark(#CCCFFA, #0e0f1a);
+    --color-overlay: light-dark(#2d241b80, #0a0b14CC);
+    --color-overlay-hover: light-dark(#2d241b0D, #EDEFFC0D);
+    --color-overlay-pressed: light-dark(#2d241b1A, #EDEFFC1A);
+    --color-background-muted: light-dark(#ede0d4, #1f2238);
+    --color-text-primary: light-dark(#2d241b, #EDEFFC);
+    --color-text-secondary: light-dark(#675d52, #a6acd6);
+    --color-text-disabled: light-dark(#d1c5b8, #4a4f6b);
+    --color-text-accent: light-dark(#2d241b, #EDEFFC);
+    --color-on-dark: #FFFFFF;
+    --color-on-light: #2d241b;
+    --color-on-accent: light-dark(#FFFFFF, #16182b);
+    --color-on-success: light-dark(#3a5500, #1e3200);
+    --color-on-error: light-dark(#8b1d24, #5c0008);
+    --color-on-warning: light-dark(#614400, #3f2600);
+    --color-icon-accent: light-dark(#2d241b, #EDEFFC);
+    --color-icon-primary: light-dark(#2d241b, #EDEFFC);
+    --color-icon-secondary: light-dark(#675d52, #a6acd6);
+    --color-icon-disabled: light-dark(#d1c5b8, #4a4f6b);
+    --color-background-card: light-dark(#FFFFFF, #16182b);
+    --color-background-popover: light-dark(#FFFFFF, #1f2238);
+    --color-background-inverted: light-dark(#2d241b, #EDEFFC);
+    --color-success: light-dark(#C5E17A, #C5E17A);
+    --color-success-muted: light-dark(#C5E17A, #C5E17A);
+    --color-error: light-dark(#FFC5C3, #FFC5C3);
+    --color-error-muted: light-dark(#FFC5C3, #FFC5C3);
+    --color-warning: light-dark(#FFE08A, #FFE08A);
+    --color-warning-muted: light-dark(#FFE08A, #FFE08A);
+    --color-border: light-dark(#2F292E, #EDEFFC1A);
+    --color-border-emphasized: light-dark(#2F292E, #3a3f5e);
+    --color-skeleton: light-dark(#d1c5b8, #2a2e47);
+    --color-shadow: light-dark(#2d241b1A, #0000004D);
+    --color-tint-hover: light-dark(#2d241b, #EDEFFC);
+    --color-background-green: light-dark(#C5E17A, #C5E17A);
+    --color-border-green: light-dark(#B5D16A, #B5D16A);
+    --color-icon-green: light-dark(#3a5500, #1e3200);
+    --color-text-green: light-dark(#3a5500, #1e3200);
+    --color-background-red: light-dark(#FFC5C3, #FFC5C3);
+    --color-border-red: light-dark(#FF9E9A, #FF9E9A);
+    --color-icon-red: light-dark(#8b1d24, #5c0008);
+    --color-text-red: light-dark(#8b1d24, #5c0008);
+    --color-background-yellow: light-dark(#FFE08A, #FFE08A);
+    --color-border-yellow: light-dark(#FFCC55, #FFCC55);
+    --color-icon-yellow: light-dark(#614400, #3f2600);
+    --color-text-yellow: light-dark(#614400, #3f2600);
+    --color-background-blue: light-dark(#B8E0FF, #B8E0FF);
+    --color-border-blue: light-dark(#8ECFFF, #8ECFFF);
+    --color-icon-blue: light-dark(#004e74, #002c4d);
+    --color-text-blue: light-dark(#004e74, #002c4d);
+    --color-background-pink: light-dark(#FFC8E0, #FFC8E0);
+    --color-border-pink: light-dark(#FFA0C8, #FFA0C8);
+    --color-icon-pink: light-dark(#822050, #580030);
+    --color-text-pink: light-dark(#822050, #580030);
+    --color-background-purple: light-dark(#DDD0FF, #DDD0FF);
+    --color-border-purple: light-dark(#C0AAFF, #C0AAFF);
+    --color-icon-purple: light-dark(#453080, #201058);
+    --color-text-purple: light-dark(#453080, #201058);
+    --color-background-cyan: light-dark(#A8F0E2, #A8F0E2);
+    --color-border-cyan: light-dark(#70E8D0, #70E8D0);
+    --color-icon-cyan: light-dark(#005548, #003028);
+    --color-text-cyan: light-dark(#005548, #003028);
+    --color-background-orange: light-dark(#FFCCA0, #FFCCA0);
+    --color-border-orange: light-dark(#FFAA66, #FFAA66);
+    --color-icon-orange: light-dark(#703500, #4a1800);
+    --color-text-orange: light-dark(#703500, #4a1800);
+    --color-background-teal: light-dark(#A8EED0, #A8EED0);
+    --color-border-teal: light-dark(#78E0B0, #78E0B0);
+    --color-icon-teal: light-dark(#005530, #003018);
+    --color-text-teal: light-dark(#005530, #003018);
+    --color-background-gray: light-dark(#ede0d4, #ede0d4);
+    --color-border-gray: light-dark(#dfd2c6, #dfd2c6);
+    --color-icon-gray: light-dark(#4f453b, #2d241b);
+    --color-text-gray: light-dark(#4f453b, #2d241b);
+    --shadow-low: 0 2px 4px #2d241b0D, 0 4px 8px #2d241b1A;
+    --shadow-med: 0 2px 4px #2d241b0D, 0 4px 12px #2d241b1A;
+    --shadow-high: 0 4px 6px #2d241b1A, 0 12px 24px #2d241b26;
+    --shadow-inset-hover: inset 0px 0px 0px 2px #2d241b30;
+    --shadow-inset-selected: inset 0px 0px 0px 2px #2d241b50;
+    --shadow-inset-success: inset 0px 0px 0px 2px #3a550050;
+    --shadow-inset-warning: inset 0px 0px 0px 2px #61440050;
+    --shadow-inset-error: inset 0px 0px 0px 2px #8b1d2450;
+  }
+
+  .astryx-heading.level-1 {
+    font-family: var(--font-family-heading);
+    font-size: var(--text-heading-1-size);
+    font-weight: var(--text-heading-1-weight);
+    line-height: var(--text-heading-1-leading);
+  }
+
+  .astryx-heading.level-2 {
+    font-family: var(--font-family-heading);
+    font-size: var(--text-heading-2-size);
+    font-weight: var(--text-heading-2-weight);
+    line-height: var(--text-heading-2-leading);
+  }
+
+  .astryx-heading.level-3 {
+    font-family: var(--font-family-heading);
+    font-size: var(--text-heading-3-size);
+    font-weight: var(--text-heading-3-weight);
+    line-height: var(--text-heading-3-leading);
+  }
+
+  .astryx-heading.level-4 {
+    font-family: var(--font-family-heading);
+    font-size: var(--text-heading-4-size);
+    font-weight: var(--text-heading-4-weight);
+    line-height: var(--text-heading-4-leading);
+  }
+
+  .astryx-heading.level-5 {
+    font-family: var(--font-family-heading);
+    font-size: var(--text-heading-5-size);
+    font-weight: var(--text-heading-5-weight);
+    line-height: var(--text-heading-5-leading);
+  }
+
+  .astryx-heading.level-6 {
+    font-family: var(--font-family-heading);
+    font-size: var(--text-heading-6-size);
+    font-weight: var(--text-heading-6-weight);
+    line-height: var(--text-heading-6-leading);
+  }
+
+  .astryx-text.body {
+    font-family: var(--font-family-body);
+    font-size: var(--text-body-size);
+    line-height: var(--text-body-leading);
+  }
+
+  .astryx-text.large {
+    font-family: var(--font-family-body);
+    font-size: var(--text-large-size);
+    line-height: var(--text-large-leading);
+  }
+
+  .astryx-text.label {
+    font-family: var(--font-family-body);
+    font-size: var(--text-label-size);
+    line-height: var(--text-label-leading);
+  }
+
+  .astryx-text.code {
+    font-family: var(--font-family-code);
+    font-size: var(--text-code-size);
+    line-height: var(--text-code-leading);
+  }
+
+  .astryx-text.supporting {
+    font-family: var(--font-family-body);
+    font-size: var(--text-supporting-size);
+    line-height: var(--text-supporting-leading);
+  }
+
+  .astryx-text.display-1 {
+    font-family: "Crimson Text", Georgia, "Times New Roman", Times, serif;
+    font-size: var(--text-display-1-size);
+    line-height: var(--text-display-1-leading);
+  }
+
+  .astryx-text.display-2 {
+    font-family: "Crimson Text", Georgia, "Times New Roman", Times, serif;
+    font-size: var(--text-display-2-size);
+    line-height: var(--text-display-2-leading);
+  }
+
+  .astryx-text.display-3 {
+    font-family: "Crimson Text", Georgia, "Times New Roman", Times, serif;
+    font-size: var(--text-display-3-size);
+    line-height: var(--text-display-3-leading);
+  }
+
+  .astryx-top-nav-item.selected {
+    background-color: transparent;
+  }
+
+  .astryx-top-nav-item.selected:hover {
+    background-color: var(--color-overlay-hover);
+  }
+
+  .astryx-top-nav-item.selected:active {
+    background-color: var(--color-overlay-pressed);
+  }
+
+  .astryx-button {
+    border-radius: 0px;
+    border-width: 1px;
+    border-style: solid;
+    border-color: var(--color-border);
+    --_button-radius: 0px;
+  }
+
+  .astryx-button.primary {
+    background-color: var(--color-text-primary);
+    color: var(--color-background-body);
+    border-color: transparent;
+  }
+
+  .astryx-button.secondary {
+    background-color: var(--color-background-green);
+    border-width: 1px;
+    border-style: solid;
+    border-color: var(--color-text-green);
+    color: var(--color-text-green);
+  }
+
+  .astryx-button.secondary:hover {
+    background-color: var(--color-border-green);
+  }
+
+  .astryx-button.ghost {
+    border-color: transparent;
+  }
+
+  .astryx-button.destructive {
+    background-color: var(--color-background-red);
+    color: var(--color-text-red);
+    border-width: 1px;
+    border-style: solid;
+    border-color: var(--color-text-red);
+  }
+
+  .astryx-badge {
+    border-radius: 9999px;
+    border-width: 1.5px;
+    border-style: solid;
+    border-color: color-mix(in srgb, currentColor 30%, transparent);
+  }
+
+  .astryx-badge.info {
+    background-color: var(--color-background-blue);
+    color: var(--color-text-blue);
+  }
+
+  .astryx-badge.neutral {
+    background-color: var(--color-background-gray);
+    color: var(--color-text-gray);
+  }
+
+  .astryx-badge.success {
+    background-color: var(--color-background-green);
+    color: var(--color-text-green);
+  }
+
+  .astryx-badge.warning {
+    background-color: var(--color-background-yellow);
+    color: var(--color-text-yellow);
+  }
+
+  .astryx-badge.error {
+    background-color: var(--color-background-red);
+    color: var(--color-text-red);
+  }
+
+  .astryx-banner {
+    border-radius: 0px;
+    --_banner-radius: 0px;
+  }
+
+  .astryx-banner.info {
+    background-color: var(--color-background-blue);
+    --color-text-primary: var(--color-text-blue);
+    --color-text-secondary: var(--color-text-blue);
+    --color-accent: var(--color-text-blue);
+  }
+
+  .astryx-banner.success {
+    background-color: var(--color-background-green);
+    --color-text-primary: var(--color-text-green);
+    --color-text-secondary: var(--color-text-green);
+    --color-success: var(--color-text-green);
+  }
+
+  .astryx-banner.warning {
+    background-color: var(--color-background-yellow);
+    --color-text-primary: var(--color-text-yellow);
+    --color-text-secondary: var(--color-text-yellow);
+    --color-warning: var(--color-text-yellow);
+  }
+
+  .astryx-banner.error {
+    background-color: var(--color-background-red);
+    --color-text-primary: var(--color-text-red);
+    --color-text-secondary: var(--color-text-red);
+    --color-error: var(--color-text-red);
+  }
+
+  .astryx-field {
+    border-radius: 0px;
+    --_field-radius: 0px;
+  }
+
+  .astryx-card {
+    border-radius: 0px;
+    --astryx-card-padding: var(--spacing-3);
+    --_card-radius: 0px;
+  }
+
+  .astryx-section {
+    --astryx-section-padding: var(--spacing-3);
+  }
+
+  .astryx-text.primary { color: var(--color-text-primary); }
+
+  .astryx-heading.primary { color: var(--color-text-primary); }
+
+  .astryx-text.secondary { color: var(--color-text-secondary); }
+
+  .astryx-heading.secondary { color: var(--color-text-secondary); }
+
+  .astryx-text.disabled { color: var(--color-text-disabled); }
+
+  .astryx-heading.disabled { color: var(--color-text-disabled); }
+
+  .astryx-text.placeholder { color: var(--color-text-secondary); }
+
+  .astryx-heading.placeholder { color: var(--color-text-secondary); }
+
+  .astryx-text.active { color: var(--color-accent); }
+
+  .astryx-heading.active { color: var(--color-accent); }
+}
+}
+
+@layer astryx-theme {
+@scope ([data-astryx-theme="y2k"]) to ([data-astryx-theme]) {
+  [data-astryx-media="dark"] {
+    color-scheme: dark;
+    --color-text-primary: var(--color-on-dark);
+    --color-icon-primary: var(--color-on-dark);
+    --color-accent: var(--color-on-dark);
+  }
+
+  [data-astryx-media="light"] {
+    color-scheme: light;
+    --color-text-primary: var(--color-on-light);
+    --color-icon-primary: var(--color-on-light);
+    --color-accent: var(--color-on-light);
+  }
+}
+}

package/dist/y2k.d.ts

@@ -0,0 +1,11 @@
+/**
+ * @generated by `astryx theme build` — do not edit manually.
+ * Source: src/y2kTheme.ts
+ * Command: astryx theme build src/y2kTheme.ts --out dist/theme.css
+ * Generated: 2026-06-24T18:16:21.622Z
+ */
+
+import type { DefinedTheme } from '@astryxdesign/core/theme';
+import type { IconRegistry } from '@astryxdesign/core/Icon';
+export declare const y2kIconRegistry: IconRegistry;
+export declare const y2kTheme: DefinedTheme;