@fintricity-public/style-guide - npm Package Compare versions

Comparing version 0.0.32 to 0.0.33

index.js

@@ -5,2 +5,3 @@ // PRIMARY COLOURS
 export const TIFFANY_BLUE = '#00b3c0'
+export const TIFFANY_BLUE_HOVER = '#01CEDD'
 export const PALE_MINT = '#a7f4e6'
@@ -37,2 +38,3 @@
 export const LINE_HEIGHT_SMALLER = '20px'
+export const LINE_HEIGHT_SMALLEST = '17px'
 
@@ -59,2 +61,5 @@ // TEXT ALIGN
 
+// BORDER RADIUS
+export const BORDER_RADIUS = '4px'
+
 // PADDING
@@ -71,2 +76,3 @@ export const PADDING_LARGER = '90px'
 export const LETTER_SPACING_SMALLER = '0.1px'
+export const LETTER_SPACING_SMALLEST = '0.5px'
 
@@ -161,3 +167,71 @@ // FONT FAMILY
     }
+  },
+  button: {
+    height: '60px',
+    width: '300px',
+    borderRadius: BORDER_RADIUS,
+    backgroundColor: TIFFANY_BLUE,
+    color: WHITE,
+    fontFamily: FONT_FAMILY,
+    fontSize: FONT_SMALL,
+    fontWeight: 500,
+    letterSpacing: LETTER_SPACING_SMALLEST,
+    lineHeight: LINE_HEIGHT_SMALLEST,
+    textAlign: TEXT_ALIGN_CENTER,
+    ':focus': {
+      border: '2px solid ' + TIFFANY_BLUE,
+      backgroundColor: TIFFANY_BLUE_HOVER
+    },
+    ':active': {
+      box-shadow: 'inset 0 0 7px 0 rgba(0,0,0,0.4)'
+    }
+  },
+  buttonSecondary: {
+    height: '60px',
+    width: '300px',
+    borderRadius: BORDER_RADIUS,
+    backgroundColor: TIFFANY_BLUE,
+    color: TIFFANY_BLUE,
+    fontFamily: FONT_FAMILY,
+    fontSize: FONT_SMALL,
+    fontWeight: 500,
+    letterSpacing: LETTER_SPACING_SMALLEST,
+    lineHeight: LINE_HEIGHT_SMALLEST,
+    textAlign: TEXT_ALIGN_CENTER,
+    ':focus': {
+      border: '2px solid ' + TIFFANY_BLUE,
+      backgroundColor: WHITE
+    },
+    ':active': {
+      border: '2px solid ' + TIFFANY_BLUE,
+      backgroundColor: MERCURY,
+      boxShadow: 'inset 0 0 7px 0 rgba(0,0,0,0.4), 0 2px 4px 0 rgba(0,0,0,0.5)'
+    }
+  },
+  table: {
+    color: STEEL,
+    fontSize: FONT_SMALLER,
+    lineHeight: LINE_HEIGHT_SMALL,
+    thead: {
+      tr: {
+        backgroundColor: ULTRA_MARINE
+      }
+    },
+    tbody: {
+      tr: {
+        ':nth-child(odd)': {
+          backgroundColor: WHITE
+        },
+        ':nth-child(even)': {
+          backgroundColor: 'rgba(220,231,231,0.2)'
+        },
+        td: {
+          ':first': {
+            color: TIFFANY_BLUE,
+            fontWeight: FONT_WEIGHT_LARGE
+          }
+        }
+      }
+    }
   }
 }

package.json

 {
   "name": "@fintricity-public/style-guide",
   "description": "UI Tools by Fintricity",
-  "version": "0.0.32",
+  "version": "0.0.33",
   "author": "Jack Prior <[e-mail]>",
@@ -6,0 +6,0 @@ "repository": {

No alert changes

Improved metrics

Total package byte prevSize

6165

increased by42.58%

Lines of code

218

increased by50.34%

No dependency changes