@rokkit/themes 1.0.0-next.95 → 1.0.0-next.96

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rokkit/themes",
-  "version": "1.0.0-next.95",
+  "version": "1.0.0-next.96",
   "description": "Themes for use with rokkit components.",
   "author": "Jerry Thomas <me@jerrythomas.name>",
   "license": "MIT",
@@ -11,15 +11,15 @@
     "access": "public"
   },
   "devDependencies": {
-    "@sveltejs/vite-plugin-svelte": "^3.0.2",
-    "@vitest/coverage-v8": "^1.4.0",
-    "@vitest/ui": "~1.4.0",
-    "jsdom": "^24.0.0",
-    "svelte": "^4.2.12",
-    "typescript": "^5.4.4",
-    "vite": "^5.2.8",
-    "vitest": "~1.4.0",
-    "shared-config": "1.0.0-next.95"
+    "@sveltejs/vite-plugin-svelte": "^3.1.1",
+    "@vitest/coverage-v8": "^1.6.0",
+    "@vitest/ui": "~1.6.0",
+    "jsdom": "^24.1.0",
+    "svelte": "^4.2.17",
+    "typescript": "^5.4.5",
+    "vite": "^5.2.12",
+    "vitest": "~1.6.0",
+    "shared-config": "1.0.0-next.96"
   },
   "files": [
     "src"
@@ -38,7 +38,7 @@
     }
   },
   "dependencies": {
-    "@rokkit/core": "1.0.0-next.95"
+    "@rokkit/core": "1.0.0-next.96"
   },
   "scripts": {
     "format": "prettier --write .",

package/src/base/alert.css

@@ -1,15 +1,30 @@
-alert-list alert {
-  @apply bg-neutral border-neutral-muted text-neutral-800;
+/* Alert styles */
+alert-list {
+  @apply top-12 right-8 w-80;
 }
-alert-list alert.danger {
-  @apply bg-danger border-danger-muted text-neutral-800;
+
+alert,
+error,
+info,
+warning,
+success {
+  @apply px-4 py-2 border rounded select-none cursor-pointer;
 }
-alert-list alert.success {
-  @apply bg-success border-success-muted text-neutral-800;
+
+alert.error,
+alert.danger,
+error {
+  @apply bg-error text-error-contrast border-error-muted;
 }
-alert-list alert.info {
-  @apply bg-info border-info-muted text-neutral-800;
+alert.info,
+info {
+  @apply bg-info text-info-contrast border-info-muted;
 }
-alert-list alert.warning {
-  @apply bg-warning border-warning-muted text-neutral-800;
+alert.warning,
+warning {
+  @apply bg-warn text-warn-contrast border-warn-muted;
+}
+alert.success,
+success {
+  @apply bg-success text-success-contrast border-success-muted;
 }

package/src/base/organisms.css

@@ -1,30 +1,3 @@
-/* Alert styles */
-alert-list {
-  @apply top-4 right-4 w-80;
-}
-alert,
-error,
-info,
-warning,
-success {
-  @apply px-4 py-2 border rounded select-none cursor-pointer;
-}
-alert.error {
-  @apply bg-error text-error border-error;
-}
-alert.info,
-info {
-  @apply bg-info text-info border-info;
-}
-alert.warning,
-warning {
-  @apply bg-warn text-warn border-warn;
-}
-alert.success,
-success {
-  @apply bg-pass text-pass border-pass;
-}
-
 input-select,
 drop-down {
   @apply overflow-visible cursor-pointer;

package/src/rokkit/alert.css

@@ -0,0 +1,4 @@
+/* Styles for 'alert-list' class */
+.rokkit alert-list {
+  @apply top-12 right-8 w-80;
+}

package/src/rokkit/input.css

@@ -0,0 +1,36 @@
+/* Styles for 'input-field' class */
+.rokkit input-field field {
+  @apply p-2px box-border border border-neutral-muted rounded;
+}
+.rokkit input-field input,
+.rokkit input-field textarea,
+.rokkit input-field select {
+  @apply border-0 rounded-sm;
+}
+.rokkit checkbox {
+  @apply outline-none;
+}
+.rokkit input-field > label {
+  @apply text-secondary-600;
+}
+.rokkit input-field field > label {
+  @apply w-full h-full flex items-center text-secondary-600 uppercase text-xs;
+}
+.rokkit input-field:not(.disabled) field:focus-within {
+  @apply border-neutral-base bg-gradient-to-r from-primary to-secondary;
+}
+.rokkit input-field.disabled label {
+  @apply text-neutral-500;
+}
+/* .rokkit input-field.disabled field:focus-within {
+  @apply bg-gradient-to-r from-neutral-subtle to-neutral-subtle;
+} */
+.rokkit input-field > span {
+  @apply border-r border-neutral-muted bg-neutral-base px-1 h-full aspect-square;
+}
+.rokkit input-field message {
+  @apply px-2 py-1 bg-neutral-base rounded;
+}
+.rokkit input-field.fail {
+  @apply bg-error rounded px-2;
+}

package/src/rokkit/molecules.css

@@ -1,40 +1,3 @@
-/* Styles for 'input-field' class */
-.rokkit input-field field {
-  @apply p-2px box-border border border-neutral-muted rounded;
-}
-.rokkit input-field input,
-.rokkit input-field textarea,
-.rokkit input-field select {
-  @apply border-0 rounded-sm;
-}
-.rokkit checkbox {
-  @apply outline-none;
-}
-.rokkit input-field > label {
-  @apply text-secondary-600;
-}
-.rokkit input-field field > label {
-  @apply w-full h-full flex items-center text-secondary-600 uppercase text-xs;
-}
-.rokkit input-field:not(.disabled) field:focus-within {
-  @apply border-neutral-base bg-gradient-to-r from-primary to-secondary;
-}
-.rokkit input-field.disabled label {
-  @apply text-neutral-500;
-}
-/* .rokkit input-field.disabled field:focus-within {
-  @apply bg-gradient-to-r from-neutral-subtle to-neutral-subtle;
-} */
-.rokkit input-field > span {
-  @apply border-r border-neutral-muted bg-neutral-base px-1 h-full aspect-square;
-}
-.rokkit input-field message {
-  @apply px-2 py-1 bg-neutral-base rounded;
-}
-.rokkit input-field.fail {
-  @apply bg-error rounded px-2;
-}
-
 /* Styles for 'input-range' class */
 .rokkit input-range range-track {
   @apply h-2 mt-2 relative;
@@ -109,11 +72,6 @@
   @apply text-secondary;
 }
 
-/* Styles for 'alert-list' class */
-.rokkit alert-list {
-  @apply top-4 right-4 w-80;
-}
-
 /* Pill styles */
 .rokkit .pill {
   @apply rounded-full bg-neutral-inset border-neutral-subtle border px-2 py-1 flex-grow-0;

package/src/rokkit.css

@@ -1,6 +1,8 @@
 @import './base.css';
 
 @import './rokkit/atoms.css';
+@import './rokkit/alert.css';
+@import './rokkit/input.css';
 @import './rokkit/molecules.css';
 @import './rokkit/organisms.css';
 @import './rokkit/layout.css';