Button: update primary button to Cambio

Cambly · Jan 9, 2024 · 76302c2 · 76302c2
1 parent 4230052
commit 76302c2
Show file tree

Hide file tree

Showing 6 changed files with 6 additions and 7 deletions.
diff --git a/packages/syntax-core/src/Button/Button.module.css b/packages/syntax-core/src/Button/Button.module.css
@@ -4,6 +4,7 @@
   flex-direction: row;
   align-items: center;
   justify-content: center;
+  border-radius: 999px;
 }
 
 .buttonGap {
@@ -55,21 +56,18 @@
   min-width: 52px;
   height: 32px;
   padding: 0 12px;
-  border-radius: 8px;
 }
 
 .md {
   min-width: 72px;
   height: 40px;
   padding: 0 16px;
-  border-radius: 12px;
 }
 
 .lg {
   min-width: 88px;
   height: 48px;
   padding: 0 20px;
-  border-radius: 16px;
 }
 
 .icon {

diff --git a/packages/syntax-core/src/Button/Button.tsx b/packages/syntax-core/src/Button/Button.tsx
@@ -153,9 +153,7 @@ const Button = forwardRef<HTMLButtonElement, ButtonProps>(
               size={textVariant[size]}
               color={foregroundTypographyColor(color)}
             >
-              <span style={{ fontWeight: 500 }}>
-                {loading ? loadingText : text}
-              </span>
+              {loading ? loadingText : text}
             </Typography>
           </Box>
         )}

diff --git a/packages/syntax-core/src/colors/backgroundColor.ts b/packages/syntax-core/src/colors/backgroundColor.ts
@@ -14,6 +14,7 @@ export default function backgroundColor(color: (typeof Color)[number]): string {
     case "tertiary":
     case "destructive-tertiary":
       return styles.whiteBackgroundColor;
+    case "primary":
     case "branded":
       return styles.yellow700BackgroundColor;
     case "inverse":

diff --git a/packages/syntax-core/src/colors/foregroundColor.ts b/packages/syntax-core/src/colors/foregroundColor.ts
@@ -9,6 +9,7 @@ export default function foregroundColor(color: (typeof Color)[number]): string {
     case "destructive-secondary":
     case "destructive-tertiary":
       return styles.destructive700Color;
+    case "primary":
     case "branded":
       return styles.gray900Color;
     case "inverse":

diff --git a/packages/syntax-core/src/colors/foregroundTypographyColor.ts b/packages/syntax-core/src/colors/foregroundTypographyColor.ts
@@ -10,6 +10,7 @@ export default function foregroundTypographyColor(
     case "destructive-secondary":
     case "destructive-tertiary":
       return "destructive-primary";
+    case "primary":
     case "branded":
       return "gray900";
     case "inverse":

diff --git a/packages/syntax-design-tokens/tokens/color/base.json b/packages/syntax-design-tokens/tokens/color/base.json
@@ -82,7 +82,7 @@
         "100": { "value": "#FDF5D9" },
         "200": { "value": "#FBE8A3" },
         "300": { "value": "#F8D663" },
-        "700": { "value": "#FFC929" },
+        "700": { "value": "#ffe14c" },
         "800": { "value": "#765F1C" },
         "900": { "value": "#3B3009" }
       },