@idds/styles 1.0.47 → 1.0.49

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@idds/styles",
-  "version": "1.0.47",
+  "version": "1.0.49",
   "description": "Shared CSS styles and colors for INA Digital Design System",
   "type": "module",
   "main": "./src/index.css",

package/src/colors/brands/bgn.css

@@ -11,6 +11,7 @@
   --ina-primary-700: #1d4ed8;
   --ina-primary-800: #1e40af;
   --ina-primary-900: #1e3a8a;
+  --ina-primary-primary: #005494;
 
   /* Brand-specific colors */
   --ina-bgn-brand-primary: #005494 !important;

package/src/colors/brands/bkn.css

@@ -12,6 +12,7 @@
   --ina-primary-700: #a2123c;
   --ina-primary-800: #871436;
   --ina-primary-900: #53041a;
+  --ina-primary-primary: #de1d5e;
 
   /* Secondary Colors - Blue theme */
   --ina-secondary-25: #f2f9fd;

package/src/colors/brands/inagov.css

@@ -12,6 +12,7 @@
   --ina-primary-700: #083575;
   --ina-primary-800: #022a5b;
   --ina-primary-900: #041225;
+  --ina-primary-primary: #629cef;
 
   /* Secondary Colors - Orange/Peach theme */
   --ina-secondary-25: #ffffff;

package/src/colors/brands/inaku.css

@@ -12,6 +12,7 @@
   --ina-primary-700: #020f1f;
   --ina-primary-800: #020b17;
   --ina-primary-900: #01080f;
+  --ina-primary-primary: #06264d;
 
   /* Accent Colors - Gray Blue theme */
   --ina-accent-100: #ffffff !important;

package/src/colors/brands/inapas.css

@@ -12,6 +12,7 @@
   --ina-primary-700: #680000;
   --ina-primary-800: #290404;
   --ina-primary-900: #140202;
+  --ina-primary-primary: #cc1515;
 
   /* Accent Colors - Green theme */
   --ina-accent-100: #f6fef9 !important;

package/src/colors/brands/lan.css

@@ -12,6 +12,7 @@
   --ina-primary-700: #1e446e;
   --ina-primary-800: #1e3a5c;
   --ina-primary-900: #14263d;
+  --ina-primary-primary: #2663a3;
 
   /* Secondary Colors - Yellow/Orange theme */
   --ina-secondary-25: #fffdeb;

package/src/colors/brands/pan-rb.css

@@ -12,6 +12,7 @@
   --ina-primary-700: #8f2527;
   --ina-primary-800: #772526;
   --ina-primary-900: #400f10;
+  --ina-primary-primary: #b42b2d;
 
   /* Secondary Colors - Grey/Purple-brown theme */
   --ina-secondary-25: #f8f7f8;

package/src/components/stepper.css

@@ -9,6 +9,7 @@
   align-items: center;
   justify-content: space-between;
   width: 100%;
+  min-height: 54px;
 }
 .ina-stepper--vertical .ina-stepper__separator {
   position: relative;
@@ -41,7 +42,7 @@
 
   .ina-stepper--horizontal-responsive .ina-stepper__separator {
     width: 2px;
-    height: 2rem;
+    min-height: 72px;
     margin: 0;
     flex-grow: 0;
     align-self: flex-start;
@@ -51,6 +52,11 @@
     left: 12px;
     bottom: 0;
   }
+  .ina-stepper--horizontal-responsive .ina-stepper__label {
+    position: absolute;
+    left: 2rem;
+    top: 0.125rem;
+  }
 
   .ina-stepper--horizontal-responsive .ina-stepper__item:last-child {
     margin-bottom: 0;
@@ -80,8 +86,7 @@
   max-height: 24px;
   overflow: visible;
 }
-.ina-stepper--vertical .ina-stepper__separator,
-.ina-stepper--horizontal-responsive .ina-stepper__separator {
+.ina-stepper--vertical .ina-stepper__separator {
   min-height: 72px;
 }
 
@@ -134,8 +139,7 @@
   position: absolute;
   top: 2rem;
 }
-.ina-stepper--vertical .ina-stepper__label,
-.ina-stepper--horizontal-responsive .ina-stepper__label {
+.ina-stepper--vertical .ina-stepper__label {
   position: absolute;
   left: 2rem;
   top: 0.25rem;
@@ -192,9 +196,9 @@
   background-color: var(--ina-positive-50);
 }
 
-.ina-stepper__item--completed .ina-stepper__label {
+/* .ina-stepper__item--completed .ina-stepper__label {
   color: var(--ina-positive-600);
-}
+} */
 
 /* Inactive State (default) */
 .ina-stepper__item:not(.ina-stepper__item--active):not(
@@ -220,9 +224,9 @@
   background-color: var(--ina-negative-50);
 }
 
-.ina-stepper__item--error .ina-stepper__label {
+/* .ina-stepper__item--error .ina-stepper__label {
   color: var(--ina-negative-500);
-}
+} */
 
 .ina-stepper__item--clickable {
   cursor: pointer;

package/src/tailwind/css/bgn.css

@@ -15,6 +15,7 @@
   --color-primary-700: var(--ina-primary-700);
   --color-primary-800: var(--ina-primary-800);
   --color-primary-900: var(--ina-primary-900);
+  --color-primary-primary: var(--ina-primary-primary);
 
   /* Brand-specific colors */
   --color-bgn-brand-primary: var(--ina-bgn-brand-primary);

package/src/tailwind/css/bkn.css

@@ -16,6 +16,7 @@
   --color-primary-700: var(--ina-primary-700);
   --color-primary-800: var(--ina-primary-800);
   --color-primary-900: var(--ina-primary-900);
+  --color-primary-primary: var(--ina-primary-primary);
 
   /* Secondary shades */
   --color-secondary-25: var(--ina-secondary-25);
@@ -34,4 +35,3 @@
   --color-bkn-brand-hover: var(--ina-bkn-brand-hover);
   --color-bkn-neutral-hover: var(--ina-bkn-neutral-hover);
 }
-

package/src/tailwind/css/idds.css

@@ -228,4 +228,3 @@
   --color-white: var(--ina-white);
   --color-black: var(--ina-black);
 }
-

package/src/tailwind/css/inagov.css

@@ -16,6 +16,7 @@
   --color-primary-700: var(--ina-primary-700);
   --color-primary-800: var(--ina-primary-800);
   --color-primary-900: var(--ina-primary-900);
+  --color-primary-primary: var(--ina-primary-primary);
 
   /* Secondary/Accent colors */
   --color-accent-100: var(--ina-accent-100);
@@ -30,4 +31,3 @@
   --color-brand-hover: var(--ina-brand-hover);
   --color-neutral-hover: var(--ina-neutral-hover);
 }
-

package/src/tailwind/css/inaku.css

@@ -16,6 +16,7 @@
   --color-primary-700: var(--ina-primary-700);
   --color-primary-800: var(--ina-primary-800);
   --color-primary-900: var(--ina-primary-900);
+  --color-primary-primary: var(--ina-primary-primary);
 
   /* Secondary/Accent colors */
   --color-accent-100: var(--ina-accent-100);
@@ -30,4 +31,3 @@
   --color-inaku-brand-hover: var(--ina-inaku-brand-hover);
   --color-inaku-neutral-hover: var(--ina-inaku-neutral-hover);
 }
-

package/src/tailwind/css/inapas.css

@@ -16,6 +16,7 @@
   --color-primary-700: var(--ina-primary-700);
   --color-primary-800: var(--ina-primary-800);
   --color-primary-900: var(--ina-primary-900);
+  --color-primary-primary: var(--ina-primary-primary);
 
   /* Accent colors */
   --color-accent-100: var(--ina-accent-100);
@@ -30,4 +31,3 @@
   --color-inapas-brand-hover: var(--ina-inapas-brand-hover);
   --color-inapas-neutral-hover: var(--ina-inapas-neutral-hover);
 }
-

package/src/tailwind/css/lan.css

@@ -16,6 +16,7 @@
   --color-primary-700: var(--ina-primary-700);
   --color-primary-800: var(--ina-primary-800);
   --color-primary-900: var(--ina-primary-900);
+  --color-primary-primary: var(--ina-primary-primary);
 
   /* Secondary shades */
   --color-secondary-25: var(--ina-secondary-25);
@@ -40,4 +41,3 @@
   --color-lan-brand-hover: var(--ina-lan-brand-hover);
   --color-lan-neutral-hover: var(--ina-lan-neutral-hover);
 }
-

package/src/tailwind/css/pan-rb.css

@@ -15,6 +15,7 @@
   --color-primary-700: var(--ina-primary-700);
   --color-primary-800: var(--ina-primary-800);
   --color-primary-900: var(--ina-primary-900);
+  --color-primary-primary: var(--ina-primary-primary);
 
   /* Secondary shades */
   --color-secondary-25: var(--ina-secondary-25);
@@ -32,4 +33,3 @@
   /* Accent colors */
   --color-accent-yellow: var(--ina-accent-yellow);
 }
-

package/src/tailwind/ts/bgn.ts

@@ -15,6 +15,7 @@ const bgnColorTokens: Record<string, string> = {
   'primary-700': 'var(--ina-primary-700)',
   'primary-800': 'var(--ina-primary-800)',
   'primary-900': 'var(--ina-primary-900)',
+  'primary-primary': 'var(--ina-primary-primary)',
 };
 
 export default bgnColorTokens;

package/src/tailwind/ts/bkn.ts

@@ -16,6 +16,7 @@ const bknColorTokens: Record<string, string> = {
   'primary-700': 'var(--ina-primary-700)',
   'primary-800': 'var(--ina-primary-800)',
   'primary-900': 'var(--ina-primary-900)',
+  'primary-primary': 'var(--ina-primary-primary)',
 
   // Secondary shades
   'secondary-25': 'var(--ina-secondary-25)',

package/src/tailwind/ts/default.ts

@@ -0,0 +1,35 @@
+/**
+ * Default Color Tokens for Tailwind CSS v3
+ * Default Theme
+ */
+
+const defaultColorTokens: Record<string, string> = {
+  // Primary shades
+  'primary-25': 'var(--ina-neutral-25)',
+  'primary-50': 'var(--ina-neutral-50)',
+  'primary-100': 'var(--ina-neutral-100)',
+  'primary-200': 'var(--ina-neutral-200)',
+  'primary-300': 'var(--ina-neutral-300)',
+  'primary-400': 'var(--ina-neutral-400)',
+  'primary-500': 'var(--ina-neutral-500)',
+  'primary-600': 'var(--ina-neutral-600)',
+  'primary-700': 'var(--ina-neutral-700)',
+  'primary-800': 'var(--ina-neutral-800)',
+  'primary-900': 'var(--ina-neutral-900)',
+  'primary-primary': 'var(--ina-neutral-900)',
+
+  // Secondary shades
+  'secondary-25': 'var(--ina-secondary-25)',
+  'secondary-50': 'var(--ina-secondary-50)',
+  'secondary-100': 'var(--ina-secondary-100)',
+  'secondary-200': 'var(--ina-secondary-200)',
+  'secondary-300': 'var(--ina-secondary-300)',
+  'secondary-400': 'var(--ina-secondary-400)',
+  'secondary-500': 'var(--ina-secondary-500)',
+  'secondary-600': 'var(--ina-secondary-600)',
+  'secondary-700': 'var(--ina-secondary-700)',
+  'secondary-800': 'var(--ina-secondary-800)',
+  'secondary-900': 'var(--ina-secondary-900)',
+};
+
+export default defaultColorTokens;

package/src/tailwind/ts/inagov.ts

@@ -16,6 +16,7 @@ const inagovColorTokens: Record<string, string> = {
   'primary-700': 'var(--ina-primary-700)',
   'primary-800': 'var(--ina-primary-800)',
   'primary-900': 'var(--ina-primary-900)',
+  'primary-primary': 'var(--ina-primary-primary)',
 
   // Secondary/Accent colors
   'accent-100': 'var(--ina-accent-100)',

package/src/tailwind/ts/inaku.ts

@@ -16,6 +16,7 @@ const inakuColorTokens: Record<string, string> = {
   'primary-700': 'var(--ina-primary-700)',
   'primary-800': 'var(--ina-primary-800)',
   'primary-900': 'var(--ina-primary-900)',
+  'primary-primary': 'var(--ina-primary-primary)',
 
   // Secondary/Accent colors
   'accent-100': 'var(--ina-accent-100)',

package/src/tailwind/ts/inapas.ts

@@ -16,6 +16,7 @@ const inapasColorTokens: Record<string, string> = {
   'primary-700': 'var(--ina-primary-700)',
   'primary-800': 'var(--ina-primary-800)',
   'primary-900': 'var(--ina-primary-900)',
+  'primary-primary': 'var(--ina-primary-primary)',
 
   // Accent colors
   'accent-100': 'var(--ina-accent-100)',

package/src/tailwind/ts/lan.ts

@@ -16,6 +16,7 @@ const lanColorTokens: Record<string, string> = {
   'primary-700': 'var(--ina-primary-700)',
   'primary-800': 'var(--ina-primary-800)',
   'primary-900': 'var(--ina-primary-900)',
+  'primary-primary': 'var(--ina-primary-primary)',
 
   // Secondary shades
   'secondary-25': 'var(--ina-secondary-25)',

package/src/tailwind/ts/pan-rb.ts

@@ -15,6 +15,7 @@ const panrbColorTokens: Record<string, string> = {
   'primary-700': 'var(--ina-primary-700)',
   'primary-800': 'var(--ina-primary-800)',
   'primary-900': 'var(--ina-primary-900)',
+  'primary-primary': 'var(--ina-primary-primary)',
 
   // Secondary shades
   'secondary-25': 'var(--ina-secondary-25)',