feat(Badge): Padding and default size (#67)

heydoctor · Aug 30, 2019 · bf2d745 · bf2d745
1 parent 1a2884a
commit bf2d745
Show file tree

Hide file tree

Showing 3 changed files with 10 additions and 9 deletions.
diff --git a/src/Badge/Badge.mdx b/src/Badge/Badge.mdx
@@ -23,6 +23,7 @@ Documentation and examples for badges, our small count and labeling component.
   <Badge variant="success" ml={2}>I'm So Successful</Badge>
   <Badge variant="danger" ml={2}>I'm So Dangerous</Badge>
   <Badge variant="warning" ml={2}>💁‍♀️ Caution</Badge>
+  <Badge variant="grey" ml={2}>Grey</Badge>
 </Playground>
 
 ### Sizes

diff --git a/src/Badge/__snapshots__/Badge.spec.js.snap b/src/Badge/__snapshots__/Badge.spec.js.snap
@@ -7,9 +7,9 @@ exports[`Badge 1`] = `
   font-weight: bold;
   background-color: #CADCFF;
   color: #0958F3;
-  font-size: 14px;
-  border-radius: 14px;
-  padding: 5px 10px;
+  font-size: 12px;
+  border-radius: 12px;
+  padding: 4px 8px;
 }
 
 <span

diff --git a/src/theme.js b/src/theme.js
@@ -265,18 +265,18 @@ export default (overrides = {}) => {
       },
       Badge: {
         sm: {
+          fontSize: 10,
+          borderRadius: 10,
+          padding: '4px 8px',
+        },
+        md: {
           fontSize: 12,
           borderRadius: 12,
           padding: '4px 8px',
         },
-        md: {
+        lg: {
           fontSize: 14,
           borderRadius: 14,
-          padding: '5px 10px',
-        },
-        lg: {
-          fontSize: 16,
-          borderRadius: 16,
           padding: '6px 12px',
         },
       },