| OLD | NEW |
| 1 /* | 1 /* |
| 2 * Copyright 2015 The Chromium Authors. All rights reserved. | 2 * Copyright 2015 The Chromium Authors. All rights reserved. |
| 3 * Use of this source code is governed by a BSD-style license that can be | 3 * Use of this source code is governed by a BSD-style license that can be |
| 4 * found in the LICENSE file. | 4 * found in the LICENSE file. |
| 5 */ | 5 */ |
| 6 | 6 |
| 7 .list-item { | 7 .list-item { |
| 8 padding: 0 8px 0 0; | 8 padding: 3px 8px 3px 20px; |
| 9 position: relative; | 9 position: relative; |
| 10 min-height: 18px; | 10 min-height: 18px; |
| 11 white-space: nowrap; | 11 line-height: 15px; |
| 12 line-height: 20px; | 12 display: flex; |
| 13 flex-wrap: wrap; |
| 13 } | 14 } |
| 14 | 15 |
| 15 .list-item:not(:last-child) { | 16 .list-item:not(.label) { |
| 16 border-bottom: 1px solid #eee; | 17 border-top: 1px solid #efefef; |
| 18 } |
| 19 |
| 20 .label + .list-item { |
| 21 border-top: 0; |
| 17 } | 22 } |
| 18 | 23 |
| 19 .list-item:not(.ignore-hover):hover { | 24 .list-item:not(.ignore-hover):hover { |
| 20 background-color: #eee; | 25 background-color: #eee; |
| 21 } | 26 } |
| 22 | 27 |
| 23 .list-item > .title { | 28 .list-item > .title, |
| 24 word-wrap: break-word; | 29 .list-item > .subtitle { |
| 25 white-space: normal; | 30 text-overflow: ellipsis; |
| 26 margin-left: 17px; | 31 overflow: hidden; |
| 32 white-space: nowrap; |
| 27 } | 33 } |
| 28 | 34 |
| 29 .list-item > .subtitle { | 35 .list-item > .subtitle { |
| 30 margin-left: 5px; | |
| 31 color: #888; | 36 color: #888; |
| 32 text-overflow: ellipsis; | 37 margin-left: auto; |
| 33 overflow: hidden; | 38 padding-left: 10px; |
| 34 float: right; | |
| 35 } | 39 } |
| 36 | 40 |
| 37 .list-item > .subtitle a { | 41 .list-item > .subtitle a { |
| 38 color: inherit; | 42 color: inherit; |
| 39 } | 43 } |
| 40 | 44 |
| 41 .list-item.label { | 45 .list-item.label::before { |
| 42 text-align: center; | 46 content: " "; |
| 47 width: 100%; |
| 48 border-top: 1px solid #d8d8d8; |
| 49 margin-top: 8px; |
| 50 position: absolute; |
| 51 z-index: -1; |
| 52 left: 0; |
| 43 } | 53 } |
| 44 | 54 |
| 45 .list-item.label .title, | 55 .list-item.label .title { |
| 46 .list-item.label .subtitle { | |
| 47 font-style: italic; | |
| 48 font-weight: bold; | 56 font-weight: bold; |
| 49 color: #999; | 57 color: #999; |
| 58 background-color: white; |
| 59 margin-left: -5px; |
| 60 padding: 0 5px; |
| 50 } | 61 } |
| 51 | 62 |
| 52 .list-item.dimmed { | 63 .list-item.dimmed { |
| 53 opacity: 0.6; | 64 opacity: 0.6; |
| 54 font-style: italic; | 65 font-style: italic; |
| 55 } | 66 } |
| 56 | 67 |
| 57 .list-item.selected::before { | 68 .list-item.selected::before { |
| 58 background-image: url(Images/smallIcons.png); | 69 background-image: url(Images/smallIcons.png); |
| 59 background-size: 190px 30px; | 70 background-size: 190px 30px; |
| 60 background-position: -180px 0; | 71 background-position: -180px 0; |
| 61 content: ""; | 72 content: ""; |
| 62 position: absolute; | 73 position: absolute; |
| 63 top: 5px; | 74 top: 5px; |
| 64 left: 4px; | 75 left: 4px; |
| 65 width: 10px; | 76 width: 10px; |
| 66 height: 10px; | 77 height: 10px; |
| 67 } | 78 } |
| 68 | 79 |
| 69 @media (-webkit-min-device-pixel-ratio: 1.1) { | 80 @media (-webkit-min-device-pixel-ratio: 1.1) { |
| 70 .list-item.selected::before { | 81 .list-item.selected::before { |
| 71 background-image: url(Images/smallIcons_2x.png); | 82 background-image: url(Images/smallIcons_2x.png); |
| 72 } | 83 } |
| 73 } /* media */ | 84 } /* media */ |
| OLD | NEW |