kimu-core 0.4.1 → 0.5.0

package/src/modules-repository/theme/themes/theme-gold.css

@@ -1,100 +1,100 @@
-/**
- * Gold Theme - Elegant gold and luxury colors
- * A premium theme with golden accents
- */
-
-:root {
-  /* Main colors */
-  --kimu-background: linear-gradient(135deg, #1A1410 0%, #2A2218 50%, #3A3020 100%);
-  --kimu-surface: rgba(218, 165, 32, 0.1);
-  --kimu-surface-elevated: rgba(218, 165, 32, 0.15);
-  
-  /* Text colors */
-  --kimu-text-primary: #FFD700;
-  --kimu-text-secondary: #F0C85B;
-  --kimu-text-tertiary: #D4AF37;
-  --kimu-text-disabled: #B8941F;
-  
-  /* Border colors */
-  --kimu-border: #DAA520;
-  --kimu-border-light: #FFD700;
-  --kimu-divider: rgba(218, 165, 32, 0.3);
-  
-  /* Accent colors */
-  --kimu-primary: #FFD700;
-  --kimu-primary-dark: #DAA520;
-  --kimu-primary-light: #FFEC8B;
-  --kimu-secondary: #F0C85B;
-  --kimu-accent: #FFE55C;
-  
-  /* State colors */
-  --kimu-success: #90EE90;
-  --kimu-warning: #FFA500;
-  --kimu-error: #DC143C;
-  --kimu-info: #87CEEB;
-  
-  /* Shadow */
-  --kimu-shadow: rgba(218, 165, 32, 0.4);
-  --kimu-shadow-strong: rgba(218, 165, 32, 0.7);
-  
-  /* Component colors */
-  --kimu-input-bg: rgba(42, 34, 24, 0.7);
-  --kimu-input-border: #DAA520;
-  --kimu-button-bg: #FFD700;
-  --kimu-button-hover: #FFEC8B;
-  --kimu-card-bg: rgba(42, 34, 24, 0.9);
-  
-  /* Font */
-  --kimu-font: 'Georgia', 'Times New Roman', serif;
-}
-
-/* Body background with gradient */
-body {
-  background: linear-gradient(135deg, #1A1410 0%, #2A2218 50%, #3A3020 100%);
-  background-attachment: fixed;
-  color: var(--kimu-text-primary);
-  font-family: var(--kimu-font);
-}
-
-/* Gold shine animation */
-@keyframes gold-shine {
-  0% {
-    background-position: -200% center;
-  }
-  100% {
-    background-position: 200% center;
-  }
-}
-
-/* Luxury glow effect */
-button:hover,
-a:hover {
-  box-shadow: 0 0 20px rgba(255, 215, 0, 0.6),
-              0 0 40px rgba(255, 215, 0, 0.3),
-              0 8px 24px rgba(0, 0, 0, 0.4);
-  text-shadow: 0 0 10px rgba(255, 215, 0, 0.8);
-}
-
-/* Elegant text shadow */
-h1, h2, h3, h4, h5, h6 {
-  text-shadow: 0 2px 10px rgba(255, 215, 0, 0.5),
-               0 0 20px rgba(218, 165, 32, 0.3);
-}
-
-/* Sparkle effect */
-body::after {
-  content: '';
-  position: fixed;
-  top: 0;
-  left: 0;
-  width: 100%;
-  height: 100%;
-  background-image: 
-    radial-gradient(2px 2px at 15% 25%, rgba(255, 215, 0, 0.4), transparent),
-    radial-gradient(2px 2px at 75% 65%, rgba(255, 215, 0, 0.3), transparent),
-    radial-gradient(1px 1px at 45% 85%, rgba(255, 236, 139, 0.5), transparent),
-    radial-gradient(1px 1px at 85% 15%, rgba(218, 165, 32, 0.4), transparent);
-  background-size: 250px 250px, 300px 300px, 200px 200px, 280px 280px;
-  pointer-events: none;
-  z-index: 0;
-}
+/**
+ * Gold Theme - Elegant gold and luxury colors
+ * A premium theme with golden accents
+ */
+
+:root {
+  /* Main colors */
+  --kimu-background: linear-gradient(135deg, #1A1410 0%, #2A2218 50%, #3A3020 100%);
+  --kimu-surface: rgba(218, 165, 32, 0.1);
+  --kimu-surface-elevated: rgba(218, 165, 32, 0.15);
+  
+  /* Text colors */
+  --kimu-text-primary: #FFD700;
+  --kimu-text-secondary: #F0C85B;
+  --kimu-text-tertiary: #D4AF37;
+  --kimu-text-disabled: #B8941F;
+  
+  /* Border colors */
+  --kimu-border: #DAA520;
+  --kimu-border-light: #FFD700;
+  --kimu-divider: rgba(218, 165, 32, 0.3);
+  
+  /* Accent colors */
+  --kimu-primary: #FFD700;
+  --kimu-primary-dark: #DAA520;
+  --kimu-primary-light: #FFEC8B;
+  --kimu-secondary: #F0C85B;
+  --kimu-accent: #FFE55C;
+  
+  /* State colors */
+  --kimu-success: #90EE90;
+  --kimu-warning: #FFA500;
+  --kimu-error: #DC143C;
+  --kimu-info: #87CEEB;
+  
+  /* Shadow */
+  --kimu-shadow: rgba(218, 165, 32, 0.4);
+  --kimu-shadow-strong: rgba(218, 165, 32, 0.7);
+  
+  /* Component colors */
+  --kimu-input-bg: rgba(42, 34, 24, 0.7);
+  --kimu-input-border: #DAA520;
+  --kimu-button-bg: #FFD700;
+  --kimu-button-hover: #FFEC8B;
+  --kimu-card-bg: rgba(42, 34, 24, 0.9);
+  
+  /* Font */
+  --kimu-font: 'Georgia', 'Times New Roman', serif;
+}
+
+/* Body background with gradient */
+body {
+  background: linear-gradient(135deg, #1A1410 0%, #2A2218 50%, #3A3020 100%);
+  background-attachment: fixed;
+  color: var(--kimu-text-primary);
+  font-family: var(--kimu-font);
+}
+
+/* Gold shine animation */
+@keyframes gold-shine {
+  0% {
+    background-position: -200% center;
+  }
+  100% {
+    background-position: 200% center;
+  }
+}
+
+/* Luxury glow effect */
+button:hover,
+a:hover {
+  box-shadow: 0 0 20px rgba(255, 215, 0, 0.6),
+              0 0 40px rgba(255, 215, 0, 0.3),
+              0 8px 24px rgba(0, 0, 0, 0.4);
+  text-shadow: 0 0 10px rgba(255, 215, 0, 0.8);
+}
+
+/* Elegant text shadow */
+h1, h2, h3, h4, h5, h6 {
+  text-shadow: 0 2px 10px rgba(255, 215, 0, 0.5),
+               0 0 20px rgba(218, 165, 32, 0.3);
+}
+
+/* Sparkle effect */
+body::after {
+  content: '';
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  background-image: 
+    radial-gradient(2px 2px at 15% 25%, rgba(255, 215, 0, 0.4), transparent),
+    radial-gradient(2px 2px at 75% 65%, rgba(255, 215, 0, 0.3), transparent),
+    radial-gradient(1px 1px at 45% 85%, rgba(255, 236, 139, 0.5), transparent),
+    radial-gradient(1px 1px at 85% 15%, rgba(218, 165, 32, 0.4), transparent);
+  background-size: 250px 250px, 300px 300px, 200px 200px, 280px 280px;
+  pointer-events: none;
+  z-index: 0;
+}

package/src/modules-repository/theme/themes/theme-high-contrast.css

@@ -1,126 +1,126 @@
-/**
- * High Contrast Theme - For accessibility
- * 
- * Designed following WCAG AAA guidelines:
- * - Contrast ratio ≥ 7:1 for normal text
- * - Contrast ratio ≥ 4.5:1 for large text
- * - Clear visual indicators for focus and active states
- */
-
-:root {
-  /* Primary Colors - Pure Black on White */
-  --kimu-primary: #0000FF;
-  --kimu-primary-hover: #0000CC;
-  --kimu-primary-active: #000099;
-  --kimu-primary-light: rgba(0, 0, 255, 0.15);
-
-  /* Secondary Colors - Dark Green */
-  --kimu-secondary: #006600;
-  --kimu-secondary-hover: #008800;
-  --kimu-secondary-active: #004400;
-
-  /* Accent Colors - Dark Purple */
-  --kimu-accent: #660099;
-  --kimu-accent-hover: #7700AA;
-  --kimu-accent-active: #550088;
-
-  /* Background Colors - Pure White */
-  --kimu-bg-primary: #FFFFFF;
-  --kimu-bg-secondary: #F5F5F5;
-  --kimu-bg-tertiary: #EBEBEB;
-  --kimu-bg-hover: #E0E0E0;
-
-  /* Text Colors - Pure Black */
-  --kimu-text-primary: #000000;
-  --kimu-text-secondary: #1A1A1A;
-  --kimu-text-tertiary: #333333;
-  --kimu-text-disabled: #666666;
-
-  /* Border Colors - Strong Contrast */
-  --kimu-border: #000000;
-  --kimu-border-light: #333333;
-  --kimu-border-strong: #000000;
-
-  /* Status Colors - High Contrast */
-  --kimu-success: #006600;
-  --kimu-warning: #CC6600;
-  --kimu-error: #CC0000;
-  --kimu-info: #0000CC;
-
-  /* Shadows - Stronger for visibility */
-  --kimu-shadow-sm: 0 2px 4px rgba(0, 0, 0, 0.5);
-  --kimu-shadow-md: 0 4px 8px rgba(0, 0, 0, 0.5);
-  --kimu-shadow-lg: 0 8px 16px rgba(0, 0, 0, 0.5);
-
-  /* Additional Component-specific Colors */
-  --kimu-card-bg: var(--kimu-bg-primary);
-  --kimu-input-bg: #FFFFFF;
-  --kimu-input-border: #000000;
-  --kimu-input-focus: #0000FF;
-
-  /* Links - Underlined by default for accessibility */
-  --kimu-link: #0000FF;
-  --kimu-link-hover: #0000CC;
-
-  /* Overlays */
-  --kimu-overlay: rgba(0, 0, 0, 0.85);
-}
-
-/* High Contrast specific enhancements */
-body {
-  color: var(--kimu-text-primary);
-  background: var(--kimu-bg-primary);
-}
-
-/* Ensure all links are underlined */
-a {
-  text-decoration: underline;
-  font-weight: bold;
-}
-
-/* Strong focus indicators */
-:focus-visible {
-  outline: 3px solid var(--kimu-primary);
-  outline-offset: 2px;
-}
-
-/* Button styling with clear borders */
-button {
-  border: 2px solid var(--kimu-border) !important;
-  font-weight: bold;
-}
-
-/* Input styling with clear borders */
-input,
-textarea,
-select {
-  border: 2px solid var(--kimu-border) !important;
-}
-
-input:focus,
-textarea:focus,
-select:focus {
-  border-color: var(--kimu-input-focus) !important;
-  outline: 2px solid var(--kimu-input-focus);
-  outline-offset: 1px;
-}
-
-/* Scrollbar - High contrast */
-::-webkit-scrollbar {
-  width: 16px;
-  height: 16px;
-}
-
-::-webkit-scrollbar-track {
-  background: #F0F0F0;
-  border: 1px solid #000000;
-}
-
-::-webkit-scrollbar-thumb {
-  background: #000000;
-  border: 2px solid #FFFFFF;
-}
-
-::-webkit-scrollbar-thumb:hover {
-  background: #333333;
-}
+/**
+ * High Contrast Theme - For accessibility
+ * 
+ * Designed following WCAG AAA guidelines:
+ * - Contrast ratio ≥ 7:1 for normal text
+ * - Contrast ratio ≥ 4.5:1 for large text
+ * - Clear visual indicators for focus and active states
+ */
+
+:root {
+  /* Primary Colors - Pure Black on White */
+  --kimu-primary: #0000FF;
+  --kimu-primary-hover: #0000CC;
+  --kimu-primary-active: #000099;
+  --kimu-primary-light: rgba(0, 0, 255, 0.15);
+
+  /* Secondary Colors - Dark Green */
+  --kimu-secondary: #006600;
+  --kimu-secondary-hover: #008800;
+  --kimu-secondary-active: #004400;
+
+  /* Accent Colors - Dark Purple */
+  --kimu-accent: #660099;
+  --kimu-accent-hover: #7700AA;
+  --kimu-accent-active: #550088;
+
+  /* Background Colors - Pure White */
+  --kimu-bg-primary: #FFFFFF;
+  --kimu-bg-secondary: #F5F5F5;
+  --kimu-bg-tertiary: #EBEBEB;
+  --kimu-bg-hover: #E0E0E0;
+
+  /* Text Colors - Pure Black */
+  --kimu-text-primary: #000000;
+  --kimu-text-secondary: #1A1A1A;
+  --kimu-text-tertiary: #333333;
+  --kimu-text-disabled: #666666;
+
+  /* Border Colors - Strong Contrast */
+  --kimu-border: #000000;
+  --kimu-border-light: #333333;
+  --kimu-border-strong: #000000;
+
+  /* Status Colors - High Contrast */
+  --kimu-success: #006600;
+  --kimu-warning: #CC6600;
+  --kimu-error: #CC0000;
+  --kimu-info: #0000CC;
+
+  /* Shadows - Stronger for visibility */
+  --kimu-shadow-sm: 0 2px 4px rgba(0, 0, 0, 0.5);
+  --kimu-shadow-md: 0 4px 8px rgba(0, 0, 0, 0.5);
+  --kimu-shadow-lg: 0 8px 16px rgba(0, 0, 0, 0.5);
+
+  /* Additional Component-specific Colors */
+  --kimu-card-bg: var(--kimu-bg-primary);
+  --kimu-input-bg: #FFFFFF;
+  --kimu-input-border: #000000;
+  --kimu-input-focus: #0000FF;
+
+  /* Links - Underlined by default for accessibility */
+  --kimu-link: #0000FF;
+  --kimu-link-hover: #0000CC;
+
+  /* Overlays */
+  --kimu-overlay: rgba(0, 0, 0, 0.85);
+}
+
+/* High Contrast specific enhancements */
+body {
+  color: var(--kimu-text-primary);
+  background: var(--kimu-bg-primary);
+}
+
+/* Ensure all links are underlined */
+a {
+  text-decoration: underline;
+  font-weight: bold;
+}
+
+/* Strong focus indicators */
+:focus-visible {
+  outline: 3px solid var(--kimu-primary);
+  outline-offset: 2px;
+}
+
+/* Button styling with clear borders */
+button {
+  border: 2px solid var(--kimu-border) !important;
+  font-weight: bold;
+}
+
+/* Input styling with clear borders */
+input,
+textarea,
+select {
+  border: 2px solid var(--kimu-border) !important;
+}
+
+input:focus,
+textarea:focus,
+select:focus {
+  border-color: var(--kimu-input-focus) !important;
+  outline: 2px solid var(--kimu-input-focus);
+  outline-offset: 1px;
+}
+
+/* Scrollbar - High contrast */
+::-webkit-scrollbar {
+  width: 16px;
+  height: 16px;
+}
+
+::-webkit-scrollbar-track {
+  background: #F0F0F0;
+  border: 1px solid #000000;
+}
+
+::-webkit-scrollbar-thumb {
+  background: #000000;
+  border: 2px solid #FFFFFF;
+}
+
+::-webkit-scrollbar-thumb:hover {
+  background: #333333;
+}

package/src/modules-repository/theme/themes/theme-lava.css

@@ -1,101 +1,101 @@
-/**
- * Lava Theme - Intense red and orange fire colors
- * A powerful theme inspired by molten lava
- */
-
-:root {
-  /* Main colors */
-  --kimu-background: linear-gradient(135deg, #1A0000 0%, #330000 30%, #4D0000 60%, #660000 100%);
-  --kimu-surface: rgba(255, 69, 0, 0.1);
-  --kimu-surface-elevated: rgba(255, 69, 0, 0.2);
-  
-  /* Text colors */
-  --kimu-text-primary: #FFE5D9;
-  --kimu-text-secondary: #FFD4BF;
-  --kimu-text-tertiary: #FFC4A6;
-  --kimu-text-disabled: #CC9980;
-  
-  /* Border colors */
-  --kimu-border: #FF4500;
-  --kimu-border-light: #FF6347;
-  --kimu-divider: rgba(255, 69, 0, 0.3);
-  
-  /* Accent colors */
-  --kimu-primary: #FF4500;
-  --kimu-primary-dark: #CC3700;
-  --kimu-primary-light: #FF6347;
-  --kimu-secondary: #FF8C00;
-  --kimu-accent: #FFD700;
-  
-  /* State colors */
-  --kimu-success: #FFD700;
-  --kimu-warning: #FFA500;
-  --kimu-error: #B22222;
-  --kimu-info: #FF6347;
-  
-  /* Shadow */
-  --kimu-shadow: rgba(255, 69, 0, 0.5);
-  --kimu-shadow-strong: rgba(255, 69, 0, 0.8);
-  
-  /* Component colors */
-  --kimu-input-bg: rgba(51, 0, 0, 0.7);
-  --kimu-input-border: #FF4500;
-  --kimu-button-bg: #FF4500;
-  --kimu-button-hover: #FF6347;
-  --kimu-card-bg: rgba(51, 0, 0, 0.8);
-  
-  /* Font */
-  --kimu-font: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', sans-serif;
-}
-
-/* Body background with gradient */
-body {
-  background: linear-gradient(135deg, #1A0000 0%, #330000 30%, #4D0000 60%, #660000 100%);
-  background-attachment: fixed;
-  color: var(--kimu-text-primary);
-}
-
-/* Lava glow animation */
-@keyframes lava-glow {
-  0%, 100% {
-    box-shadow: 0 0 20px rgba(255, 69, 0, 0.5),
-                0 0 40px rgba(255, 69, 0, 0.3);
-  }
-  50% {
-    box-shadow: 0 0 30px rgba(255, 140, 0, 0.7),
-                0 0 60px rgba(255, 140, 0, 0.5);
-  }
-}
-
-/* Fire effect on hover */
-button:hover,
-a:hover {
-  animation: lava-glow 2s infinite;
-}
-
-/* Ember particles effect */
-body::after {
-  content: '';
-  position: fixed;
-  top: 0;
-  left: 0;
-  width: 100%;
-  height: 100%;
-  background-image: 
-    radial-gradient(3px 3px at 10% 20%, rgba(255, 140, 0, 0.4), transparent),
-    radial-gradient(2px 2px at 80% 60%, rgba(255, 69, 0, 0.3), transparent),
-    radial-gradient(3px 3px at 40% 80%, rgba(255, 215, 0, 0.4), transparent);
-  background-size: 300px 300px;
-  animation: ember-rise 15s linear infinite;
-  pointer-events: none;
-  z-index: 0;
-}
-
-@keyframes ember-rise {
-  from {
-    transform: translateY(100%);
-  }
-  to {
-    transform: translateY(-100%);
-  }
-}
+/**
+ * Lava Theme - Intense red and orange fire colors
+ * A powerful theme inspired by molten lava
+ */
+
+:root {
+  /* Main colors */
+  --kimu-background: linear-gradient(135deg, #1A0000 0%, #330000 30%, #4D0000 60%, #660000 100%);
+  --kimu-surface: rgba(255, 69, 0, 0.1);
+  --kimu-surface-elevated: rgba(255, 69, 0, 0.2);
+  
+  /* Text colors */
+  --kimu-text-primary: #FFE5D9;
+  --kimu-text-secondary: #FFD4BF;
+  --kimu-text-tertiary: #FFC4A6;
+  --kimu-text-disabled: #CC9980;
+  
+  /* Border colors */
+  --kimu-border: #FF4500;
+  --kimu-border-light: #FF6347;
+  --kimu-divider: rgba(255, 69, 0, 0.3);
+  
+  /* Accent colors */
+  --kimu-primary: #FF4500;
+  --kimu-primary-dark: #CC3700;
+  --kimu-primary-light: #FF6347;
+  --kimu-secondary: #FF8C00;
+  --kimu-accent: #FFD700;
+  
+  /* State colors */
+  --kimu-success: #FFD700;
+  --kimu-warning: #FFA500;
+  --kimu-error: #B22222;
+  --kimu-info: #FF6347;
+  
+  /* Shadow */
+  --kimu-shadow: rgba(255, 69, 0, 0.5);
+  --kimu-shadow-strong: rgba(255, 69, 0, 0.8);
+  
+  /* Component colors */
+  --kimu-input-bg: rgba(51, 0, 0, 0.7);
+  --kimu-input-border: #FF4500;
+  --kimu-button-bg: #FF4500;
+  --kimu-button-hover: #FF6347;
+  --kimu-card-bg: rgba(51, 0, 0, 0.8);
+  
+  /* Font */
+  --kimu-font: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', sans-serif;
+}
+
+/* Body background with gradient */
+body {
+  background: linear-gradient(135deg, #1A0000 0%, #330000 30%, #4D0000 60%, #660000 100%);
+  background-attachment: fixed;
+  color: var(--kimu-text-primary);
+}
+
+/* Lava glow animation */
+@keyframes lava-glow {
+  0%, 100% {
+    box-shadow: 0 0 20px rgba(255, 69, 0, 0.5),
+                0 0 40px rgba(255, 69, 0, 0.3);
+  }
+  50% {
+    box-shadow: 0 0 30px rgba(255, 140, 0, 0.7),
+                0 0 60px rgba(255, 140, 0, 0.5);
+  }
+}
+
+/* Fire effect on hover */
+button:hover,
+a:hover {
+  animation: lava-glow 2s infinite;
+}
+
+/* Ember particles effect */
+body::after {
+  content: '';
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  background-image: 
+    radial-gradient(3px 3px at 10% 20%, rgba(255, 140, 0, 0.4), transparent),
+    radial-gradient(2px 2px at 80% 60%, rgba(255, 69, 0, 0.3), transparent),
+    radial-gradient(3px 3px at 40% 80%, rgba(255, 215, 0, 0.4), transparent);
+  background-size: 300px 300px;
+  animation: ember-rise 15s linear infinite;
+  pointer-events: none;
+  z-index: 0;
+}
+
+@keyframes ember-rise {
+  from {
+    transform: translateY(100%);
+  }
+  to {
+    transform: translateY(-100%);
+  }
+}