1 files changed, 28 insertions, 6 deletions

diff --git a/paper/bootswatch.less b/paper/bootswatch.less
index 1d32ced7..88569de7 100644
--- a/paper/bootswatch.less
+++ b/paper/bootswatch.less
@@ -40,9 +40,6 @@
 
 #btn(@class,@bg) {
   .btn-@{class} {
-    background-size: 200% 200%;
-    background-position: 50%;
-
     &:focus {
       background-color: @bg;
     }
@@ -53,9 +50,6 @@
     }
 
     &:active {
-      background-color: darken(@bg, 12%);
-      #gradient > .radial(darken(@bg, 12%) 10%, @bg 11%);
-      background-size: 1000% 1000%;
       .box-shadow(2px 2px 4px rgba(0,0,0,.4));
     }
   }
@@ -74,6 +68,7 @@
   border: none;
   .box-shadow(1px 1px 4px rgba(0,0,0,.4));
   .transition(all 0.4s);
+  .ripple();
 
   &-link {
     border-radius: @btn-border-radius-base;
@@ -621,3 +616,30 @@ input[type="checkbox"],
   }
 }
 
+// Effects =================================================================
+
+.ripple {
+  position: relative;
+
+  &:after {
+    content: "";
+    display: block;
+    position: absolute;
+    width: 100%;
+    height: 100%;
+    top: 0;
+    left: 0;
+    #gradient > .radial(#000 10%, transparent 10.01%);
+    background-size: 1000% 1000%;
+    background-position: 50%;
+    opacity: 0;
+    pointer-events: none;
+    transition: background .5s, opacity 1s;
+  }
+
+  &:active:after {
+    background-size: 0% 0%;
+    opacity: .2;
+    transition: 0s;
+  }
+}
\ No newline at end of file