@oneqode/design-system 0.4.1 → 0.4.3

package/build/css/remake/tokens.css

@@ -12,7 +12,7 @@
   --color-border-focus: #2a8dff; /** Focus ring border */
   --color-border-information: #2a8dff; /** Informational border */
   --color-border-inverse: #e0e0e0; /** Border on inverse surfaces */
-  --color-border-subtle: #000000; /** Subtle border - hairline dividers */
+  --color-border-subtle: #0d0d0d; /** Subtle border - hairline dividers */
   --color-border-success: #22c55e; /** Success border */
   --color-border-warning: #f59e0b; /** Warning border */
   --color-blue-50: #eef7ff;
@@ -68,7 +68,7 @@
   --color-neutral-600: #555555;
   --color-neutral-700: #333333;
   --color-neutral-800: #1f1f1f;
-  --color-neutral-900: #000000;
+  --color-neutral-900: #0d0d0d;
   --color-neutral-950: #050505;
   --color-black: #000000;
   --color-white: #ffffff;
@@ -77,9 +77,9 @@
   --color-surface-action-hover: #4aa2ff; /** Primary action surface - hover state */
   --color-surface-bg: #000000; /** Page background - foundation black/white */
   --color-surface-default: #050505; /** Default card/component surface */
-  --color-surface-disabled: #000000; /** Disabled component surface */
+  --color-surface-disabled: #0d0d0d; /** Disabled component surface */
   --color-surface-inverse: #ffffff; /** Inverted surface - white card on dark, black card on light */
-  --color-surface-raised: #000000; /** Raised surface - modals, popovers, ghost-button hover */
+  --color-surface-raised: #0d0d0d; /** Raised surface - modals, popovers, ghost-button hover */
   --color-alias-accent-50: #eef7ff;
   --color-alias-accent-100: #d9ecff;
   --color-alias-accent-200: #b6daff;
@@ -149,7 +149,7 @@
   --color-alias-neutral-600: #555555;
   --color-alias-neutral-700: #333333;
   --color-alias-neutral-800: #1f1f1f;
-  --color-alias-neutral-900: #000000;
+  --color-alias-neutral-900: #0d0d0d;
   --color-alias-neutral-950: #050505;
   --color-alias-black: #000000;
   --color-alias-white: #ffffff;
@@ -186,6 +186,16 @@
   --container-text: 720px; /** Prose content, legal pages, CTAs */
   --container-compact: 650px; /** Tight text blocks, centered descriptions */
   --container-content: 600px; /** Paragraph descriptions, subtitles */
+  --spacing-1: 0.25rem; /** 4px - 0.25rem step on the spacing scale */
+  --spacing-2: 0.5rem; /** 8px */
+  --spacing-3: 0.75rem; /** 12px */
+  --spacing-4: 1rem; /** 16px */
+  --spacing-5: 1.25rem; /** 20px */
+  --spacing-6: 1.5rem; /** 24px */
+  --spacing-8: 2rem; /** 32px */
+  --spacing-10: 2.5rem; /** 40px */
+  --spacing-12: 3rem; /** 48px */
+  --spacing-16: 4rem; /** 64px */
   --spacing-section: 5rem; /** Standard spacing between page sections */
   --spacing-section-lg: 10rem; /** Large section block padding - 160px (used for major page sections per Figma) */
   --spacing-inset: 1.5rem; /** Standard inner padding for sections and cards - 24px */
@@ -271,7 +281,7 @@
   --component-icon-stroke-thin: 1.5; /** Icon stroke width - airy, decorative */
   --component-icon-stroke-regular: 2; /** Icon stroke width - default (Lucide native) */
   --component-icon-stroke-bold: 2.5; /** Icon stroke width - emphasis, comparison glyphs */
-  --component-tag-default-bg: #000000; /** Mono tag - default variant background (dark fill) */
+  --component-tag-default-bg: #0d0d0d; /** Mono tag - default variant background (dark fill) */
   --component-tag-default-text: #ffffff; /** Mono tag - default variant text (white) */
   --component-tag-default-border: transparent; /** Mono tag - default variant has no border */
   --component-tag-accent-bg: #2a8dff; /** Mono tag - accent variant background (brand blue) */
@@ -283,6 +293,7 @@
   --gradient-card-overlay: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.85) 100%); /** Bottom-fade scrim on image cards (feature triptych) for text legibility */
   --gradient-hero-overlay: linear-gradient(180deg, rgba(0, 0, 0, 0.2) 0%, rgba(0, 0, 0, 0.7) 100%); /** Top-to-bottom darken on hero imagery - keeps headline legible without flattening the photo */
   --pattern-hatch: repeating-linear-gradient(45deg, transparent 0 4px, rgba(255, 255, 255, 0.06) 4px 5px); /** Diagonal hairline hatch decoration - section frame on case studies and feature card borders */
+  --layout-padding-xy: 1.25rem; /** Mobile horizontal padding for direct section children of <main> - 20px */
   --motion-duration-fast: 150ms; /** Snappy interactions - button/link hover, icon swaps */
   --motion-duration-base: 250ms; /** Default UI transition - default for most state changes */
   --motion-duration-slow: 400ms; /** Deliberate transition - card/image reveals, dropdown open */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@oneqode/design-system",
-  "version": "0.4.1",
+  "version": "0.4.3",
   "type": "module",
   "description": "OneQode design tokens: CSS custom properties, Tailwind v4 theme, shadcn variables, and flat JSON.",
   "license": "MIT",