@cuby-ui/core 0.0.30 → 0.0.31

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cuby-ui/core",
-  "version": "0.0.30",
+  "version": "0.0.31",
   "peerDependencies": {
     "@angular/common": ">=15.0.0",
     "@angular/core": ">=15.0.0",

package/styles/mixins/inputs.scss

@@ -61,7 +61,7 @@
     }
 
     &._with-error {
-      border-color: colors.$cui-error-500;
+      border-color: colors.$cui-danger;
 
       &:focus-within {
         @include shadows.cui-shadow-error-focused();

package/styles/theme.scss

@@ -49,16 +49,35 @@
   --cui-orange-800: #8E3605;
 
   --cui-red-50: #FFEEEE;
+  --cui-red-100: #FFC8C8;
+  --cui-red-200: #FFA2A2;
+  --cui-red-300: #FF7C7C;
+  --cui-red-400: #FC5555;
   --cui-red-500: #D92D20;
   --cui-red-600: #B82E2E;
+  --cui-red-700: #961F1F;
+  --cui-red-800: #741313;
   --cui-red-900: #520909;
 
   --cui-light-blue-50: #F0F9FF;
+  --cui-light-blue-100: #E5F5FF;
+  --cui-light-blue-200: #C4E7FF;
+  --cui-light-blue-300: #98D6FF;
+  --cui-light-blue-400: #6DC4FF;
   --cui-light-blue-500: #2EABFF;
   --cui-light-blue-600: #0099FF;
-
+  --cui-light-blue-700: #0068AD;
+  --cui-light-blue-800: #005085;
+  --cui-light-blue-900: #00375C;
+
+  --cui-blue-50: #F0F7FF;
+  --cui-blue-100: #E8F1FF;
+  --cui-blue-200: #BED9FF;
+  --cui-blue-300: #94C0FF;
+  --cui-blue-400: #4190FF;
   --cui-blue-500: #4190FF;
   --cui-blue-600: #1570EF;
+  --cui-blue-700: #0354C6;
   --cui-blue-800: #00429D;
   --cui-blue-900: #002B67;
 
@@ -79,7 +98,9 @@
   --cui-success-700: var(--cui-green-700);
   --cui-success-900: var(--cui-green-900);
 
-  --cui-error-500: var(--cui-red-500);
+  --cui-danger: var(--cui-red-500);
+
+  // TODO: DELETE
   --cui-error-600: var(--cui-red-600);
   --cui-error-900: var(--cui-red-900);
 
@@ -100,4 +121,6 @@
   --cui-base-400: var(--cui-slate-400);
   --cui-base-500: var(--cui-slate-300);
   --cui-base-900: var(--cui-slate-200);
+
+  --cui-danger: var(--cui-red-400);
 }

package/styles/variables/colors.scss

@@ -44,16 +44,28 @@ $cui-yellow-900: var(--cui-yellow-900);
 $cui-orange-800: var(--cui-orange-800);
 
 $cui-red-50: var(--cui-red-50);
+$cui-red-100: var(--cui-red-100);
+$cui-red-200: var(--cui-red-200);
+$cui-red-300: var(--cui-red-300);
+$cui-red-400: var(--cui-red-400);
 $cui-red-500: var(--cui-red-500);
 $cui-red-600: var(--cui-red-600);
+$cui-red-700: var(--cui-red-700);
+$cui-red-800: var(--cui-red-800);
 $cui-red-900: var(--cui-red-900);
 
 $cui-light-blue-50: var(--cui-light-blue-50);
 $cui-light-blue-500: var(--cui-light-blue-500);
 $cui-light-blue-600: var(--cui-light-blue-600);
 
+$cui-blue-50: var(--cui-blue-50);
+$cui-blue-100: var(--cui-blue-100);
+$cui-blue-200: var(--cui-blue-200);
+$cui-blue-300: var(--cui-blue-300);
+$cui-blue-400: var(--cui-blue-400);
 $cui-blue-500: var(--cui-blue-500);
 $cui-blue-600: var(--cui-blue-600);
+$cui-blue-700: var(--cui-blue-700);
 $cui-blue-800: var(--cui-blue-800);
 $cui-blue-900: var(--cui-blue-900);
 
@@ -75,7 +87,9 @@ $cui-success-600: var(--cui-success-600);
 $cui-success-700: var(--cui-success-700);
 $cui-success-900: var(--cui-success-900);
 
-$cui-error-500: var(--cui-error-500);
+$cui-danger: var(--cui-danger);
+
+// TODO: DELETE
 $cui-error-600: var(--cui-error-600);
 $cui-error-900: var(--cui-error-900);