Ghost version

themes/zebra/assets/css/button.css

@@ -0,0 +1,60 @@
+.author img {
+  position: relative;
+  width: 120px;
+  left: inherit;
+  transform: inherit;
+  margin-right: 40px;
+}
+
+/* Component styles */
+a.read {
+  display: block;
+  max-width: 250px;
+  margin: 20px auto;
+  -webkit-appearance: none;
+  -moz-appearance: none;
+  appearance: none;
+  border: none;
+  border-radius: 4px;
+  box-shadow: inset 1px 1px 1px rgba(255, 255, 255, 0.3), 0 1px 1.5px rgba(0, 0, 0, 0.15), 0 1px 1px rgba(0, 0, 0, 0.2);
+  font-family: 'Roboto',sans-serif;
+  font-weight: 400;
+  text-transform: uppercase;
+  color: #bcdffb;
+  width: inherit;
+}
+
+.button.read {
+  height: 100%;
+  padding: 1em;
+  position: relative;
+  width: 100%;
+}
+
+.button.styl-material {
+  -webkit-transition: 200ms background cubic-bezier(0.4, 0, 0.2, 1);
+  transition: 200ms background cubic-bezier(0.4, 0, 0.2, 1);
+  background: #2196F3;
+}
+
+.button.styl-material:hover,
+.button.styl-material:focus {
+  outline: none;
+  background: #2b9bf4;
+}
+
+.ripple-obj {
+  height: 100%;
+  pointer-events: none;
+  position: absolute;
+  top: 0;
+  left: 0;
+  z-index: 0;
+  width: 100%;
+  fill: #0c7cd5;
+}
+
+.ripple-obj use {
+  opacity: 0;
+}
+