@duskmoon-dev/core 1.3.0 → 1.4.0

package/dist/index.css

@@ -355,6 +355,47 @@ html {
 }
 
 
+/* Custom utilities */
+/**
+ * Custom utility classes
+ * Extends Tailwind CSS v4 with additional utilities
+ */
+
+/* Responsive grid utilities with auto-fill/auto-fit */
+@utility grid-cols-auto-fill-* {
+  grid-template-columns: repeat(auto-fill, minmax(min(calc(--value(integer) * 0.25rem), 100%), 1fr));
+}
+
+@utility grid-cols-auto-fit-* {
+  grid-template-columns: repeat(auto-fit, minmax(min(calc(--value(integer) * 0.25rem), 100%), 1fr));
+}
+
+/* Screen reader only utility - visually hidden but accessible */
+.sr-only {
+  position: absolute;
+  width: 1px;
+  height: 1px;
+  padding: 0;
+  margin: -1px;
+  overflow: hidden;
+  clip: rect(0, 0, 0, 0);
+  white-space: nowrap;
+  border: 0;
+}
+
+/* Undo sr-only for focus states (useful for skip links) */
+.not-sr-only {
+  position: static;
+  width: auto;
+  height: auto;
+  padding: 0;
+  margin: 0;
+  overflow: visible;
+  clip: auto;
+  white-space: normal;
+}
+
+
 
 /* Built-in themes */
 /**
@@ -457,6 +498,42 @@ html {
 
   --color-outline: oklch(75% 0.01 260);
   --color-outline-variant: oklch(85% 0.01 260);
+
+  /* ============================================
+   * ACCENT COLORS
+   * ============================================ */
+
+  --color-accent: oklch(65% 0.20 145);
+  --color-accent-content: oklch(100% 0 0);
+
+  /* ============================================
+   * NEUTRAL COLORS
+   * ============================================ */
+
+  --color-neutral: oklch(35% 0.02 260);
+  --color-neutral-content: oklch(95% 0.01 260);
+  --color-neutral-variant: oklch(50% 0.02 260);
+
+  /* ============================================
+   * SURFACE VARIANT
+   * ============================================ */
+
+  --color-surface-variant: oklch(94% 0.02 85);
+
+  /* ============================================
+   * INVERSE COLORS
+   * ============================================ */
+
+  --color-inverse-surface: oklch(25% 0.02 260);
+  --color-inverse-on-surface: oklch(95% 0.01 260);
+  --color-inverse-primary: oklch(80% 0.14 55);
+
+  /* ============================================
+   * SHADOW & SCRIM
+   * ============================================ */
+
+  --color-shadow: oklch(0% 0 0);
+  --color-scrim: oklch(0% 0 0 / 50%);
 }
 
 /* Default theme - applies sunshine when no data-theme is set */
@@ -527,6 +604,27 @@ html {
   /* Outline Colors */
   --color-outline: oklch(75% 0.01 260);
   --color-outline-variant: oklch(85% 0.01 260);
+
+  /* Accent Colors */
+  --color-accent: oklch(65% 0.20 145);
+  --color-accent-content: oklch(100% 0 0);
+
+  /* Neutral Colors */
+  --color-neutral: oklch(35% 0.02 260);
+  --color-neutral-content: oklch(95% 0.01 260);
+  --color-neutral-variant: oklch(50% 0.02 260);
+
+  /* Surface Variant */
+  --color-surface-variant: oklch(94% 0.02 85);
+
+  /* Inverse Colors */
+  --color-inverse-surface: oklch(25% 0.02 260);
+  --color-inverse-on-surface: oklch(95% 0.01 260);
+  --color-inverse-primary: oklch(80% 0.14 55);
+
+  /* Shadow & Scrim */
+  --color-shadow: oklch(0% 0 0);
+  --color-scrim: oklch(0% 0 0 / 50%);
 }
 
 /**
@@ -624,6 +722,42 @@ html {
 
   --color-outline: oklch(44% 0.01 260);
   --color-outline-variant: oklch(35% 0.01 260);
+
+  /* ============================================
+   * ACCENT COLORS
+   * ============================================ */
+
+  --color-accent: oklch(72% 0.16 175);
+  --color-accent-content: oklch(20% 0 0);
+
+  /* ============================================
+   * NEUTRAL COLORS
+   * ============================================ */
+
+  --color-neutral: oklch(75% 0.01 260);
+  --color-neutral-content: oklch(20% 0.01 260);
+  --color-neutral-variant: oklch(55% 0.01 260);
+
+  /* ============================================
+   * SURFACE VARIANT
+   * ============================================ */
+
+  --color-surface-variant: oklch(30% 0.02 260);
+
+  /* ============================================
+   * INVERSE COLORS
+   * ============================================ */
+
+  --color-inverse-surface: oklch(95% 0.01 260);
+  --color-inverse-on-surface: oklch(25% 0.02 260);
+  --color-inverse-primary: oklch(55% 0.16 255);
+
+  /* ============================================
+   * SHADOW & SCRIM
+   * ============================================ */
+
+  --color-shadow: oklch(0% 0 0);
+  --color-scrim: oklch(0% 0 0 / 60%);
 }
 
 /* System preference: prefers-color-scheme dark */
@@ -695,6 +829,27 @@ html {
     /* Outline Colors */
     --color-outline: oklch(44% 0.01 260);
     --color-outline-variant: oklch(35% 0.01 260);
+
+    /* Accent Colors */
+    --color-accent: oklch(72% 0.16 175);
+    --color-accent-content: oklch(20% 0 0);
+
+    /* Neutral Colors */
+    --color-neutral: oklch(75% 0.01 260);
+    --color-neutral-content: oklch(20% 0.01 260);
+    --color-neutral-variant: oklch(55% 0.01 260);
+
+    /* Surface Variant */
+    --color-surface-variant: oklch(30% 0.02 260);
+
+    /* Inverse Colors */
+    --color-inverse-surface: oklch(95% 0.01 260);
+    --color-inverse-on-surface: oklch(25% 0.02 260);
+    --color-inverse-primary: oklch(55% 0.16 255);
+
+    /* Shadow & Scrim */
+    --color-shadow: oklch(0% 0 0);
+    --color-scrim: oklch(0% 0 0 / 60%);
   }
 }
 

package/dist/themes/moonlight.css

@@ -93,6 +93,42 @@
 
   --color-outline: oklch(44% 0.01 260);
   --color-outline-variant: oklch(35% 0.01 260);
+
+  /* ============================================
+   * ACCENT COLORS
+   * ============================================ */
+
+  --color-accent: oklch(72% 0.16 175);
+  --color-accent-content: oklch(20% 0 0);
+
+  /* ============================================
+   * NEUTRAL COLORS
+   * ============================================ */
+
+  --color-neutral: oklch(75% 0.01 260);
+  --color-neutral-content: oklch(20% 0.01 260);
+  --color-neutral-variant: oklch(55% 0.01 260);
+
+  /* ============================================
+   * SURFACE VARIANT
+   * ============================================ */
+
+  --color-surface-variant: oklch(30% 0.02 260);
+
+  /* ============================================
+   * INVERSE COLORS
+   * ============================================ */
+
+  --color-inverse-surface: oklch(95% 0.01 260);
+  --color-inverse-on-surface: oklch(25% 0.02 260);
+  --color-inverse-primary: oklch(55% 0.16 255);
+
+  /* ============================================
+   * SHADOW & SCRIM
+   * ============================================ */
+
+  --color-shadow: oklch(0% 0 0);
+  --color-scrim: oklch(0% 0 0 / 60%);
 }
 
 /* System preference: prefers-color-scheme dark */
@@ -164,5 +200,26 @@
     /* Outline Colors */
     --color-outline: oklch(44% 0.01 260);
     --color-outline-variant: oklch(35% 0.01 260);
+
+    /* Accent Colors */
+    --color-accent: oklch(72% 0.16 175);
+    --color-accent-content: oklch(20% 0 0);
+
+    /* Neutral Colors */
+    --color-neutral: oklch(75% 0.01 260);
+    --color-neutral-content: oklch(20% 0.01 260);
+    --color-neutral-variant: oklch(55% 0.01 260);
+
+    /* Surface Variant */
+    --color-surface-variant: oklch(30% 0.02 260);
+
+    /* Inverse Colors */
+    --color-inverse-surface: oklch(95% 0.01 260);
+    --color-inverse-on-surface: oklch(25% 0.02 260);
+    --color-inverse-primary: oklch(55% 0.16 255);
+
+    /* Shadow & Scrim */
+    --color-shadow: oklch(0% 0 0);
+    --color-scrim: oklch(0% 0 0 / 60%);
   }
 }

package/dist/themes/sunshine.css

@@ -93,6 +93,42 @@
 
   --color-outline: oklch(75% 0.01 260);
   --color-outline-variant: oklch(85% 0.01 260);
+
+  /* ============================================
+   * ACCENT COLORS
+   * ============================================ */
+
+  --color-accent: oklch(65% 0.20 145);
+  --color-accent-content: oklch(100% 0 0);
+
+  /* ============================================
+   * NEUTRAL COLORS
+   * ============================================ */
+
+  --color-neutral: oklch(35% 0.02 260);
+  --color-neutral-content: oklch(95% 0.01 260);
+  --color-neutral-variant: oklch(50% 0.02 260);
+
+  /* ============================================
+   * SURFACE VARIANT
+   * ============================================ */
+
+  --color-surface-variant: oklch(94% 0.02 85);
+
+  /* ============================================
+   * INVERSE COLORS
+   * ============================================ */
+
+  --color-inverse-surface: oklch(25% 0.02 260);
+  --color-inverse-on-surface: oklch(95% 0.01 260);
+  --color-inverse-primary: oklch(80% 0.14 55);
+
+  /* ============================================
+   * SHADOW & SCRIM
+   * ============================================ */
+
+  --color-shadow: oklch(0% 0 0);
+  --color-scrim: oklch(0% 0 0 / 50%);
 }
 
 /* Default theme - applies sunshine when no data-theme is set */
@@ -163,4 +199,25 @@
   /* Outline Colors */
   --color-outline: oklch(75% 0.01 260);
   --color-outline-variant: oklch(85% 0.01 260);
+
+  /* Accent Colors */
+  --color-accent: oklch(65% 0.20 145);
+  --color-accent-content: oklch(100% 0 0);
+
+  /* Neutral Colors */
+  --color-neutral: oklch(35% 0.02 260);
+  --color-neutral-content: oklch(95% 0.01 260);
+  --color-neutral-variant: oklch(50% 0.02 260);
+
+  /* Surface Variant */
+  --color-surface-variant: oklch(94% 0.02 85);
+
+  /* Inverse Colors */
+  --color-inverse-surface: oklch(25% 0.02 260);
+  --color-inverse-on-surface: oklch(95% 0.01 260);
+  --color-inverse-primary: oklch(80% 0.14 55);
+
+  /* Shadow & Scrim */
+  --color-shadow: oklch(0% 0 0);
+  --color-scrim: oklch(0% 0 0 / 50%);
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@duskmoon-dev/core",
-  "version": "1.3.0",
+  "version": "1.4.0",
   "description": "DuskMoonUI - Tailwind CSS v4 plugin with Material Design 3 color system and component styles",
   "type": "module",
   "main": "./dist/index.css",