From f4d833cb09758beb62a65ad4011d16bdb81b33ff Mon Sep 17 00:00:00 2001
From: Alexander Tseung <alextsg@gmail.com>
Date: Tue, 29 May 2018 14:33:29 -0700
Subject: Change btn-secondary styles to btn-default. Make btn-secondary red
 warning style buttons

---
 ui/app/css/itcss/components/buttons.scss | 49 ++++++++++++++++----------------
 1 file changed, 25 insertions(+), 24 deletions(-)

(limited to 'ui/app/css/itcss')

diff --git a/ui/app/css/itcss/components/buttons.scss b/ui/app/css/itcss/components/buttons.scss
index 4cbed6093..f93daec04 100644
--- a/ui/app/css/itcss/components/buttons.scss
+++ b/ui/app/css/itcss/components/buttons.scss
@@ -2,10 +2,10 @@
   Buttons
  */
 
+.btn-default,
 .btn-primary,
-.btn-primary--lg,
-.btn-secondary,
-.btn-secondary--lg {
+.btn-secondary {
+  height: 44px;
   background: $white;
   display: flex;
   justify-content: center;
@@ -20,10 +20,16 @@
   width: 100%;
   text-transform: uppercase;
   outline: none;
+
+  &--disabled,
+  &[disabled] {
+    cursor: auto;
+    opacity: .5;
+    pointer-events: none;
+  }
 }
 
-.btn-primary,
-.btn-primary--lg {
+.btn-primary {
   color: $curious-blue;
   border: 2px solid $spindle;
 
@@ -35,17 +41,23 @@
   &:hover {
     border-color: $curious-blue;
   }
+}
 
-  &--disabled,
-  &[disabled] {
-    cursor: auto;
-    opacity: .5;
-    pointer-events: none;
+.btn-secondary {
+  color: $monzo;
+  border: 2px solid lighten($monzo, 40%);
+
+  &:active {
+    background: lighten($monzo, 55%);
+    border-color: $monzo;
+  }
+
+  &:hover {
+    border-color: $monzo;
   }
 }
 
-.btn-secondary,
-.btn-secondary--lg {
+.btn-default {
   color: $scorpion;
   border: 2px solid $dusty-gray;
 
@@ -57,20 +69,9 @@
   &:hover {
     border-color: $scorpion;
   }
-
-  &--disabled,
-  &[disabled] {
-    cursor: auto;
-    opacity: .5;
-    pointer-events: none;
-  }
-}
-
-.btn-primary, .btn-secondary {
-  height: 44px;
 }
 
-.btn-primary--lg, .btn-secondary--lg {
+.btn--large {
   height: 54px;
 }
 
-- 
cgit