-- found in the LICENSE file.
-->
-<polymer-element name="kb-row" attributes="align">
+<polymer-element name="kb-row" attributes="align weight">
<template>
<style>
- :host {
- text-align: center;
- margin-right: 0.25em;
- margin-top: 0.25em;
- }
- :host :last-of-type {
- margin-bottom: 0.25em;
- }
+ :host {
+ text-align: center;
+ margin-right: 0.25em;
+ margin-top: 0.25em;
+ }
+ :host :last-of-type {
+ margin-bottom: 0.25em;
+ }
+
+ :host:nth-child(1)>:not(.dark):not(.active) {
+ -webkit-box-shadow: inset 0px 1px #6f6f6f, inset 0px -1px #565656;
+ background-image: -webkit-linear-gradient(#636363, #5b5b5b);
+ background-size: cover;
+ border-bottom-color: #4a4a4a;
+ border-top-color: #878787;
+ }
+
+ :host:nth-child(2)>:not(.dark):not(.active) {
+ -webkit-box-shadow: inset 0px 1px #666666, inset 0px -1px #4c4c4c;
+ background-image: -webkit-linear-gradient(#5a5a5a, #515151);
+ background-size: cover;
+ border-bottom-color: #414141;
+ border-top-color: #7f7f7f;
+ }
+
+ :host:nth-child(3)>:not(.dark):not(.active) {
+ -webkit-box-shadow: inset 0px 1px #5d5d5d, inset 0px -1px #444444;
+ background-image: -webkit-linear-gradient(#505050, #494949);
+ background-size: cover;
+ border-bottom-color: #3a3a3a;
+ border-top-color: #787878;
+ }
+
+ :host:nth-child(4)>:not(.dark):not(.active) {
+ -webkit-box-shadow: inset 0px 1px #565656, inset 0px -1px #434343;
+ background-image: -webkit-linear-gradient(#484848, #474747);
+ background-size: cover;
+ border-bottom-color: #393939;
+ border-top-color: #717171;
+ }
+
+ :host>:not(.dark):not(.active) {
+ -webkit-box-shadow: inset 0px 1px #565656, inset 0px -1px #434343;
+ background-image: -webkit-linear-gradient(#484848, #474747);
+ background-size: cover;
+ border-bottom-color: #393939;
+ border-top-color: #717171;
+ }
+
+ :host:nth-child(2) :not([invert])::part(hint) {
+ color: #2C2C2C;
+ }
+
+ :host:nth-child(3) :not([invert])::part(hint) {
+ color: #272727;
+ }
+
+ :host:nth-child(4) :not([invert])::part(hint) {
+ color: #232323;
+ }
</style>
<content select="*"></content>
</template>
<script>
Polymer('kb-row', {
align: RowAlignment.STRETCH,
+ weight: DEFAULT_KEY_WEIGHT_Y,
});
</script>
</polymer-element>