Index: lib/src/paper-button/paper-button.html |
diff --git a/lib/src/paper-button/paper-button.html b/lib/src/paper-button/paper-button.html |
index 1fe1c93bb90b94eae8f0561f83cfeb94bb4e03c6..2e4c4b202a16bce9a2a7254f63222e93d6c8f3d1 100644 |
--- a/lib/src/paper-button/paper-button.html |
+++ b/lib/src/paper-button/paper-button.html |
@@ -15,8 +15,7 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN |
<link rel="import" href="../iron-flex-layout/iron-flex-layout.html"> |
<!-- |
- |
-Material Design: <a href="http://www.google.com/design/spec/components/buttons.html">Buttons</a> |
+Material design: [Buttons](https://www.google.com/design/spec/components/buttons.html) |
`paper-button` is a button. When the user touches the button, a ripple effect emanates |
from the point of contact. It may be flat or raised. A raised button is styled with a |
@@ -76,9 +75,9 @@ Custom property | Description | Default |
--> |
<dom-module id="paper-button"> |
- <template> |
+ <template strip-whitespace> |
- <style> |
+ <style include="paper-material"> |
:host { |
display: inline-block; |
position: relative; |
@@ -102,12 +101,12 @@ Custom property | Description | Default |
@apply(--paper-button); |
} |
- :host([raised]) .keyboard-focus { |
+ :host([raised].keyboard-focus) { |
font-weight: bold; |
@apply(--paper-button-raised-keyboard-focus); |
} |
- :host(:not([raised])) .keyboard-focus { |
+ :host(:not([raised]).keyboard-focus) { |
font-weight: bold; |
@apply(--paper-button-flat-keyboard-focus); |
} |
@@ -121,30 +120,15 @@ Custom property | Description | Default |
@apply(--paper-button-disabled); |
} |
- :host([noink]) paper-ripple { |
- display: none; |
- } |
- |
paper-ripple { |
color: var(--paper-button-ink-color); |
} |
- paper-material { |
- border-radius: inherit; |
- @apply(--layout-fit); |
- } |
- |
- .content > ::content * { |
+ :host > ::content * { |
text-transform: inherit; |
} |
</style> |
- |
- <paper-ripple></paper-ripple> |
- |
- <paper-material class$="[[_computeContentClass(receivedFocusFromKeyboard)]]" elevation="[[_elevation]]" animated></paper-material> |
- |
<content></content> |
- |
</template> |
</dom-module> |
@@ -170,18 +154,10 @@ Custom property | Description | Default |
_calculateElevation: function() { |
if (!this.raised) { |
- this._elevation = 0; |
+ this.elevation = 0; |
} else { |
Polymer.PaperButtonBehaviorImpl._calculateElevation.apply(this); |
} |
- }, |
- |
- _computeContentClass: function(receivedFocusFromKeyboard) { |
- var className = 'content '; |
- if (receivedFocusFromKeyboard) { |
- className += ' keyboard-focus'; |
- } |
- return className; |
} |
}); |
</script> |