Add active animation to primary/secondary buttons

inspec · Sep 21, 2016 · 527867b · 527867b
1 parent e1c2e04
commit 527867b
Showing 1 changed file with 7 additions and 0 deletions.
diff --git a/www/source/stylesheets/_buttons.scss b/www/source/stylesheets/_buttons.scss
@@ -3,13 +3,20 @@
   text-transform: uppercase;
   border-radius: 0;
   box-shadow: 3px 3px 0 0 $off-white;
+  transition: all 0.3s ease;
 
   &.primary {
     color: $inspec-grey;
     background: $white;
     border: 1px solid $inspec-blue;
   }
 
+  &.primary:active,
+  &.secondary:active {
+    transform: translateX(2px) translateY(2px);
+    box-shadow: 0 0 0 0 $off-white;
+  }
+
   &.transparent {
     color: $inspec-grey;
     background: transparent;