Merge pull request #174 from US-CBP/TagCodeFixes

tagUpdate
US-CBP · Aug 7, 2024 · ed57a5d · ed57a5d
2 parents 4335a64 + abb1a67
commit ed57a5d
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 6 deletions.
diff --git a/packages/web-components/src/components/cbp-tag/cbp-tag.scss b/packages/web-components/src/components/cbp-tag/cbp-tag.scss
@@ -27,32 +27,33 @@ cbp-tag {
   padding: 0 var(--cbp-space-3x);
   text-align: center;
   font-weight: var(--cbp-font-weight-medium);
+  font-size: var(--cbp-font-size-subhead);
   line-height: var(--cbp-space-7x);
   max-width: 100%;
   overflow: hidden;
   white-space: nowrap;
 
   &[color=warning] {
     --cbp-tag-color: var(--cbp-color-text-darker);
-    --cbp-tag-color-dark: var(--cbp-color-info-darker);
+    --cbp-tag-color-dark: var(--cbp-color-text-darker);
 
     --cbp-tag-color-background: var(--cbp-color-warning-base);
     --cbp-tag-color-background-dark: var(--cbp-color-warning-light);
   }
 
   &[color=success] {
     --cbp-tag-color: var(--cbp-color-success-lighter);
-    --cbp-tag-color-dark: var(-cbp-color-success-darker);
+    --cbp-tag-color-dark: var(--cbp-color-success-dark);
 
-    --cbp-tag-color-background: var(--cbp-color-info-dark);
-    --cbp-tag-color-background-dark: var(--cbp-color-success-light);
+    --cbp-tag-color-background: var(--cbp-color-success-dark);
+    --cbp-tag-color-background-dark: var(--cbp-color-success-lighter);
   }
 
   &[color=danger] {
     --cbp-tag-color: var(--cbp-color-text-lightest);
     --cbp-tag-color-dark: var(--cbp-color-text-darkest);
 
-    --cbp-tag-color-background: var(--cbp-color-danger-base);
+    --cbp-tag-color-background: var(--cbp-color-danger-dark);
     --cbp-tag-color-background-dark: var(--cbp-color-danger-light);
   }
 }
diff --git a/packages/web-components/src/components/cbp-tag/cbp-tag.stories.tsx b/packages/web-components/src/components/cbp-tag/cbp-tag.stories.tsx
@@ -44,7 +44,7 @@ const Template = ({ label, color, withIcon, context, sx }) => {
       ${context && context != 'light-inverts' ? `context=${context}` : ''}
       ${sx ? `sx=${JSON.stringify(sx)}` : ''}
     >
-      ${Icon ? `<cbp-icon name="${Icon}" sx='{"margin-right":"var(--cbp-space-2x)"}'></cbp-icon>` : ''}
+      ${Icon ? `<cbp-icon name="${Icon}" sx='{"margin-right":"var(--cbp-space-1x)"}'></cbp-icon>` : ''}
       ${label}
     </cbp-tag>
   `;