Merge "PolyGerrit stylistic fixes"
This commit is contained in:
commit
6808f277cb
@ -27,7 +27,7 @@ limitations under the License.
|
|||||||
display: flex;
|
display: flex;
|
||||||
}
|
}
|
||||||
:host([selected]) {
|
:host([selected]) {
|
||||||
background-color: #d8EdF9;
|
background-color: #ebf5fb;
|
||||||
}
|
}
|
||||||
.cell {
|
.cell {
|
||||||
border-bottom: 1px solid #eee;
|
border-bottom: 1px solid #eee;
|
||||||
|
@ -21,25 +21,28 @@ limitations under the License.
|
|||||||
<template>
|
<template>
|
||||||
<style>
|
<style>
|
||||||
:host {
|
:host {
|
||||||
display: inline;
|
display: inline-block;
|
||||||
}
|
}
|
||||||
.starButton {
|
.starButton {
|
||||||
font-size: .95em;
|
|
||||||
margin-right: .25em;
|
|
||||||
cursor: pointer;
|
|
||||||
background-color: transparent;
|
background-color: transparent;
|
||||||
border-color: transparent;
|
border-color: transparent;
|
||||||
|
cursor: pointer;
|
||||||
|
font-size: 1.2em;
|
||||||
|
vertical-align: -.2em;
|
||||||
|
margin-right: .25em;
|
||||||
|
width: 1.2em;
|
||||||
|
outline: none;
|
||||||
}
|
}
|
||||||
.star {
|
.starButton svg {
|
||||||
color: #fbc02d;
|
fill: #aab8c2;
|
||||||
}
|
}
|
||||||
.unstar {
|
.starButton-active svg {
|
||||||
color: #666;
|
fill: #ffac33;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
<button class="starButton" on-tap="_handleStarTap">
|
<button class$="[[_computeStarClass(change.starred)]]" on-tap="_handleStarTap">
|
||||||
<span class="star" hidden$="[[!change.starred]]">★</span>
|
<!-- Public Domain image from the Noun Project: https://thenounproject.com/search/?q=star&i=25969 -->
|
||||||
<span class="unstar" hidden$="[[change.starred]]">☆</span>
|
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" x="0px" y="0px" viewBox="0 0 100 100" enable-background="new 0 0 100 100" xml:space="preserve"><path d="M26.439,95.601c-5.608,2.949-9.286,0.276-8.216-5.968l4.5-26.237L3.662,44.816c-4.537-4.423-3.132-8.746,3.137-9.657 l26.343-3.829L44.923,7.46c2.804-5.682,7.35-5.682,10.154,0l11.78,23.87l26.343,3.829c6.27,0.911,7.674,5.234,3.138,9.657 L77.277,63.397l4.501,26.237c1.07,6.244-2.608,8.916-8.216,5.968L50,83.215L26.439,95.601z"></path></svg>
|
||||||
</button>
|
</button>
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
@ -58,6 +61,14 @@ limitations under the License.
|
|||||||
_xhrPromise: Object, // Used for testing.
|
_xhrPromise: Object, // Used for testing.
|
||||||
},
|
},
|
||||||
|
|
||||||
|
_computeStarClass: function(starred) {
|
||||||
|
var classes = ['starButton'];
|
||||||
|
if (starred) {
|
||||||
|
classes.push('starButton-active');
|
||||||
|
}
|
||||||
|
return classes.join(' ');
|
||||||
|
},
|
||||||
|
|
||||||
_handleStarTap: function() {
|
_handleStarTap: function() {
|
||||||
var method = this.change.starred ? 'DELETE' : 'PUT';
|
var method = this.change.starred ? 'DELETE' : 'PUT';
|
||||||
this.set('change.starred', !this.change.starred);
|
this.set('change.starred', !this.change.starred);
|
||||||
|
@ -43,6 +43,7 @@ limitations under the License.
|
|||||||
}
|
}
|
||||||
.canComment .lineNum {
|
.canComment .lineNum {
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
|
text-decoration: underline;
|
||||||
}
|
}
|
||||||
.canComment .lineNum:hover {
|
.canComment .lineNum:hover {
|
||||||
background-color: #ccc;
|
background-color: #ccc;
|
||||||
|
@ -57,6 +57,7 @@ limitations under the License.
|
|||||||
}
|
}
|
||||||
.message {
|
.message {
|
||||||
border: none;
|
border: none;
|
||||||
|
width: 100%;
|
||||||
}
|
}
|
||||||
.labelContainer:not(:first-of-type) {
|
.labelContainer:not(:first-of-type) {
|
||||||
margin-top: .5em;
|
margin-top: .5em;
|
||||||
|
@ -71,19 +71,16 @@ limitations under the License.
|
|||||||
server.restore();
|
server.restore();
|
||||||
});
|
});
|
||||||
|
|
||||||
function isVisible(el) {
|
|
||||||
assert.ok(el);
|
|
||||||
return getComputedStyle(el).getPropertyValue('display') != 'none';
|
|
||||||
}
|
|
||||||
|
|
||||||
test('star visibility states', function() {
|
test('star visibility states', function() {
|
||||||
element.set('change.starred', true);
|
element.set('change.starred', true);
|
||||||
assert.isTrue(isVisible(element.$$('.star')), 'star is visible');
|
assert.isTrue(element.$$('button').classList.contains('starButton'));
|
||||||
assert.isFalse(isVisible(element.$$('.unstar')), 'unstar is not visible');
|
assert.isTrue(
|
||||||
|
element.$$('button').classList.contains('starButton-active'));
|
||||||
|
|
||||||
element.set('change.starred', false);
|
element.set('change.starred', false);
|
||||||
assert.isTrue(isVisible(element.$$('.unstar')), 'unstar is visible');
|
assert.isTrue(element.$$('button').classList.contains('starButton'));
|
||||||
assert.isFalse(isVisible(element.$$('.star')), 'star is not visible');
|
assert.isFalse(
|
||||||
|
element.$$('button').classList.contains('starButton-active'));
|
||||||
});
|
});
|
||||||
|
|
||||||
test('starring', function(done) {
|
test('starring', function(done) {
|
||||||
|
Loading…
Reference in New Issue
Block a user