chore(react): change the design of the chip in the nav-bar item

wso2 · Jul 15, 2024 · 5350ac5 · 5350ac5
1 parent e676428
commit 5350ac5
Show file tree

Hide file tree

Showing 3 changed files with 4 additions and 5 deletions.
diff --git a/packages/react/src/components/NavbarItem/navbar-item.scss b/packages/react/src/components/NavbarItem/navbar-item.scss
@@ -58,10 +58,7 @@
   }
 
   .oxygen-chip {
-    text-transform: uppercase;
-    font-weight: 500;
-    font-size: 0.6rem;
-    height: 18px;
+    font-size: 10px;
 
     .oxygen-navbar-item-chip-label {
       padding-left: 10px;

diff --git a/packages/react/src/models/theme.ts b/packages/react/src/models/theme.ts
@@ -135,6 +135,7 @@ interface CustomTheme {
         'experimental-border-color'?: string;
         'experimental-text-color'?: string;
         'font-weight'?: string;
+        'letter-spacing'?: string;
         'line-height'?: string;
         'new-background'?: string;
         'new-border-color'?: string;

diff --git a/packages/react/src/theme/default-theme.ts b/packages/react/src/theme/default-theme.ts
@@ -181,7 +181,7 @@ export const generateDefaultThemeOptions = (baseTheme: Theme): RecursivePartial<
         'beta-border-color': '#488DB4',
         'beta-text-color': 'linear-gradient(93deg, #488DB4 0%, #1F3D4E 100%)',
         border: '1px solid',
-        'border-radius': '8px',
+        'border-radius': '6px',
         'coming-soon-background': 'linear-gradient(131deg, rgba(140, 140, 140, 0.40) 0%, rgba(64, 64, 64, 0.40) 100%)',
         'coming-soon-border-color': '#868686',
         'coming-soon-text-color': 'linear-gradient(93deg, #868686 0%, #202020 100%)',
@@ -192,6 +192,7 @@ export const generateDefaultThemeOptions = (baseTheme: Theme): RecursivePartial<
         'experimental-border-color': '#8C3999',
         'experimental-text-color': 'linear-gradient(93deg, #8C3999 0%, #2F1333 100%)',
         'font-weight': '900',
+        'letter-spacing': '0.4px',
         'line-height': '20px',
         'new-background': 'linear-gradient(131deg, rgba(117, 237, 161, 0.40) 28.46%, rgba(52, 146, 86, 0.40) 119.09%)',
         'new-border-color': '#349256',