| OLD | NEW |
| 1 /* Copyright 2015 The Chromium Authors. All rights reserved. | 1 /* Copyright 2015 The Chromium Authors. All rights reserved. |
| 2 * Use of this source code is governed by a BSD-style license that can be | 2 * Use of this source code is governed by a BSD-style license that can be |
| 3 * found in the LICENSE file. */ | 3 * found in the LICENSE file. */ |
| 4 | 4 |
| 5 #item { | 5 #item { |
| 6 @apply(--layout-center); | 6 @apply(--layout-center); |
| 7 @apply(--layout-horizontal); | 7 @apply(--layout-horizontal); |
| 8 color: rgb(80, 80, 80); | 8 color: rgb(80, 80, 80); |
| 9 cursor: pointer; | 9 cursor: pointer; |
| 10 font-size: 77.8%; | 10 font-size: 77.8%; |
| 11 height: 30px; | 11 height: 30px; |
| 12 position: relative; | 12 position: relative; |
| 13 } | 13 } |
| 14 | 14 |
| 15 #item:hover { | 15 #item:hover { |
| 16 background-color: rgb(237, 237, 237); | 16 background-color: rgb(237, 237, 237); |
| 17 color: rgb(20, 20, 20); | 17 color: rgb(20, 20, 20); |
| 18 } | 18 } |
| 19 | 19 |
| 20 paper-ripple { | 20 paper-ripple { |
| 21 /* Allowing the ripple to capture pointer events prevents a focus rectangle | 21 /* Allowing the ripple to capture pointer events prevents a focus rectangle |
| 22 * for showing up for clicks, while still allowing it with tab-navigation. | 22 * for showing up for clicks, while still allowing it with tab-navigation. |
| 23 * This undoes a paper-ripple bugfix aimed at non-Chrome browsers. | 23 * This undoes a paper-ripple bugfix aimed at non-Chrome browsers. |
| 24 * TODO(tsergeant): Improve focus in viewer-bookmark so this can be removed | 24 * TODO(tsergeant): Improve focus in viewer-bookmark so this can be removed |
| 25 * (https://crbug.com/5448190). | 25 * (https://crbug.com/5448190). */ |
| 26 */ | |
| 27 pointer-events: auto; | 26 pointer-events: auto; |
| 28 } | 27 } |
| 29 | 28 |
| 30 #title { | 29 #title { |
| 31 overflow: hidden; | 30 overflow: hidden; |
| 32 text-overflow: ellipsis; | 31 text-overflow: ellipsis; |
| 33 white-space: nowrap; | 32 white-space: nowrap; |
| 34 } | 33 } |
| 35 | 34 |
| 36 #expand { | 35 #expand { |
| 37 --iron-icon-height: 16px; | 36 --iron-icon-height: 16px; |
| 38 --iron-icon-width: 16px; | 37 --iron-icon-width: 16px; |
| 39 --paper-icon-button-ink-color: var(--paper-grey-900); | 38 --paper-icon-button-ink-color: var(--paper-grey-900); |
| 40 height: 28px; | 39 height: 28px; |
| 41 min-width: 28px; | 40 min-width: 28px; |
| 42 padding: 6px; | 41 padding: 6px; |
| 43 transition: transform 150ms; | 42 transition: transform 150ms; |
| 44 width: 28px; | 43 width: 28px; |
| 45 } | 44 } |
| 46 | 45 |
| 47 :host-context([dir=rtl]) #expand { | 46 :host-context([dir=rtl]) #expand { |
| 48 transform: rotate(180deg); | 47 transform: rotate(180deg); |
| 49 } | 48 } |
| 50 | 49 |
| 51 :host([children-shown]) #expand { | 50 :host([children-shown]) #expand { |
| 52 transform: rotate(90deg); | 51 transform: rotate(90deg); |
| 53 } | 52 } |
| OLD | NEW |