diff --git a/polygerrit-ui/app/elements/shared/gr-account-chip/gr-account-chip.html b/polygerrit-ui/app/elements/shared/gr-account-chip/gr-account-chip.html index 7f71c892cf..92a2518bdf 100644 --- a/polygerrit-ui/app/elements/shared/gr-account-chip/gr-account-chip.html +++ b/polygerrit-ui/app/elements/shared/gr-account-chip/gr-account-chip.html @@ -40,14 +40,8 @@ limitations under the License. :host([show-avatar]) .container { padding-left: 0; } - gr-button.remove:hover, - gr-button.remove:focus { - --gr-button: { - color: #333; - } - } gr-button.remove { - --gr-button: { + --gr-remove-button-style: { border: 0; color: var(--deemphasized-text-color); font-size: 1.7rem; @@ -59,6 +53,19 @@ limitations under the License. text-decoration: none; } } + + gr-button.remove:hover, + gr-button.remove:focus { + --gr-button: { + @apply --gr-remove-button-style; + color: #333; + } + } + gr-button.remove { + --gr-button: { + @apply --gr-remove-button-style; + } + } :host:focus { border-color: transparent; box-shadow: none; diff --git a/polygerrit-ui/app/elements/shared/gr-autocomplete/gr-autocomplete.html b/polygerrit-ui/app/elements/shared/gr-autocomplete/gr-autocomplete.html index b74e48c764..46877d79c1 100644 --- a/polygerrit-ui/app/elements/shared/gr-autocomplete/gr-autocomplete.html +++ b/polygerrit-ui/app/elements/shared/gr-autocomplete/gr-autocomplete.html @@ -76,14 +76,31 @@ limitations under the License. on-focus="_onInputFocus" on-blur="_onInputBlur" autocomplete="off"> - - + +
+ + +
+ + + { - assert.equal(getComputedStyle(element.$$('iron-icon')).display, - 'none'); - element.showSearchIcon = true; - assert.notEqual(getComputedStyle(element.$$('iron-icon')).display, - 'none'); + test('search icon shows with showSearchIcon property', done => { + flush(() => { + assert.equal(getComputedStyle(element.$$('iron-icon')).display, + 'none'); + element.showSearchIcon = true; + assert.notEqual(getComputedStyle(element.$$('iron-icon')).display, + 'none'); + done(); + }); }); test('vertical offset overridden by param if it exists', () => { diff --git a/polygerrit-ui/app/elements/shared/gr-button/gr-button.html b/polygerrit-ui/app/elements/shared/gr-button/gr-button.html index 754c3c0a3d..340297f180 100644 --- a/polygerrit-ui/app/elements/shared/gr-button/gr-button.html +++ b/polygerrit-ui/app/elements/shared/gr-button/gr-button.html @@ -39,6 +39,37 @@ limitations under the License. text-transform: none; } paper-button { + /* The next lines contains a copy of paper-button style. + Without a copy, the @apply works incorrectly with Polymer 2. + @apply is deprecated and is not recommended to use. It is expected + that @apply will be replaced with the ::part CSS pseudo-element. + After replacecment copied lines can be removed. + */ + @apply --layout-inline; + @apply --layout-center-center; + position: relative; + box-sizing: border-box; + min-width: 5.14em; + margin: 0 0.29em; + background: transparent; + -webkit-tap-highlight-color: rgba(0, 0, 0, 0); + -webkit-tap-highlight-color: transparent; + font: inherit; + text-transform: uppercase; + outline-width: 0; + border-radius: 3px; + -moz-user-select: none; + -ms-user-select: none; + -webkit-user-select: none; + user-select: none; + cursor: pointer; + z-index: 0; + padding: 0.7em 0.57em; + + @apply --paper-font-common-base; + @apply --paper-button; + /* End of copy*/ + /* paper-button sets this to anti-aliased, which appears different than bold font elsewhere on macOS. */ -webkit-font-smoothing: initial; diff --git a/polygerrit-ui/app/elements/shared/gr-linked-chip/gr-linked-chip.html b/polygerrit-ui/app/elements/shared/gr-linked-chip/gr-linked-chip.html index f6332f4e1a..a3e8576af3 100644 --- a/polygerrit-ui/app/elements/shared/gr-linked-chip/gr-linked-chip.html +++ b/polygerrit-ui/app/elements/shared/gr-linked-chip/gr-linked-chip.html @@ -37,14 +37,8 @@ limitations under the License. display: inline-flex; padding: 0 .5em; } - gr-button.remove:hover, - gr-button.remove:focus { - --gr-button: { - color: #333; - } - } gr-button.remove { - --gr-button: { + --gr-remove-button-style: { border: 0; color: var(--deemphasized-text-color); font-size: 1.7rem; @@ -56,6 +50,19 @@ limitations under the License. text-decoration: none; } } + + gr-button.remove:hover, + gr-button.remove:focus { + --gr-button: { + @apply --gr-remove-button-style; + color: #333; + } + } + gr-button.remove { + --gr-button: { + @apply --gr-remove-button-style; + } + } .transparentBackground, gr-button.transparentBackground { background-color: transparent; diff --git a/polygerrit-ui/app/styles/gr-voting-styles.html b/polygerrit-ui/app/styles/gr-voting-styles.html index 3b1ee6476c..eec79be96c 100644 --- a/polygerrit-ui/app/styles/gr-voting-styles.html +++ b/polygerrit-ui/app/styles/gr-voting-styles.html @@ -23,6 +23,7 @@ limitations under the License. border: 1px solid rgba(0,0,0,.12); border-radius: 1em; box-shadow: none; + box-sizing: border-box; min-width: 3em; } }