From 8fd1c0c9e5636a25050b31afc160019226b52980 Mon Sep 17 00:00:00 2001
From: Jonathan Garbee <jonathan@garbee.me>
Date: Tue, 2 Aug 2016 09:42:44 -0400
Subject: [PATCH] fix(button): Use only before psuedo element

Let Tooltips have control over the after psuedo element so they will inter-operate with buttons.
---
 packages/mdl-button/mdl-button.scss | 22 +++++-----------------
 1 file changed, 5 insertions(+), 17 deletions(-)

diff --git a/packages/mdl-button/mdl-button.scss b/packages/mdl-button/mdl-button.scss
index 0737702b1..7d41b38fe 100644
--- a/packages/mdl-button/mdl-button.scss
+++ b/packages/mdl-button/mdl-button.scss
@@ -40,8 +40,8 @@
   box-sizing: border-box;
   -webkit-appearance: none;
 
-  &::before,
-  &::after {
+  /* postcss-bem-linter: ignore */
+  &::before {
     position: absolute;
     top: 0;
     left: 0;
@@ -49,12 +49,8 @@
     height: 100%;
     transition: opacity 120ms cubic-bezier(0, 0, .2, 1);
     border-radius: inherit;
-    content: "";
-  }
-
-  /* postcss-bem-linter: ignore */
-  &::before {
     background: currentColor;
+    content: "";
     opacity: 0;
   }
 
@@ -62,16 +58,8 @@
     opacity: .12;
   }
 
-  &::after {
-    width: 100%;
-    height: 100%;
-    background: black;
-    opacity: 0;
-    overflow: hidden;
-  }
-
-  &:active::after {
-    opacity: .06;
+  &:active::before {
+    opacity: .18;
   }
 
   &:active {