OLD | NEW |
1 /* Copyright 2013 The Chromium Authors. All rights reserved. | 1 /* Copyright 2013 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 .extension-error-list-heading { |
| 6 align-content: flex-start; |
| 7 display: flex; |
| 8 flex-direction: row; |
| 9 justify-content: space-between; |
| 10 padding: 3px; |
| 11 } |
| 12 |
| 13 .extension-error-list-heading span { |
| 14 font-weight: bold; |
| 15 } |
| 16 |
5 .extension-error-list a { | 17 .extension-error-list a { |
6 cursor: pointer; | 18 cursor: pointer; |
7 } | 19 } |
8 | 20 |
9 .extension-error-list-contents { | 21 .extension-error-list-contents { |
10 -webkit-transition: max-height 150ms; | 22 -webkit-padding-start: 0; |
| 23 cursor: pointer; |
11 list-style-type: none; | 24 list-style-type: none; |
12 overflow-y: hidden; | 25 margin-bottom: 0; |
| 26 margin-top: 0; |
13 } | 27 } |
14 | 28 |
15 .extension-error-list-contents.active { | 29 #no-errors-span { |
16 max-height: 200px; | 30 -webkit-margin-start: 10px; |
17 } | |
18 | |
19 .extension-error-list-contents, | |
20 .extension-error-list-contents.deactivating { | |
21 /* Simply toggling .active on and off doesn't transition both ways as it | |
22 * changes the display type of some li elements. To fix this, .deactivating | |
23 * is added while the list is closing to change only the max-height. */ | |
24 max-height: 50px; | |
25 } | 31 } |
26 | 32 |
27 .extension-error-list-contents.scrollable { | 33 .extension-error-list-contents.scrollable { |
28 overflow-y: auto; | 34 overflow-y: auto; |
29 } | 35 } |
30 | 36 |
31 /* These next three rules hide all except for the most recent three entries in | 37 .extension-error-list-contents .extension-error-metadata:hover { |
32 * the list, unless the list is active. */ | 38 background-color: #eee; |
33 .extension-error-list-contents li { | |
34 display: none; | |
35 } | |
36 .extension-error-list-contents.active li, | |
37 .extension-error-list ul li:nth-last-child(-n + 3) { | |
38 display: initial; | |
39 } | 39 } |
40 | 40 |
41 .extension-error-list-contents { | 41 .extension-error-list-contents |
42 -webkit-padding-start: 20px; | 42 .extension-error-metadata.extension-error-active { |
43 } | 43 background-color: rgba(0, 100, 255, 0.1); |
44 | |
45 .extension-error-list-show-more { | |
46 text-align: center; | |
47 width: 100%; | |
48 } | |
49 | |
50 .extension-error-list-show-more button { | |
51 width: auto; | |
52 } | 44 } |
53 | 45 |
54 .extension-error-metadata { | 46 .extension-error-metadata { |
55 -webkit-padding-end: 1px; | 47 -webkit-padding-end: 1px; |
| 48 -webkit-padding-start: 3px; |
56 display: flex; | 49 display: flex; |
57 flex-direction: row; | 50 flex-direction: row; |
58 margin-bottom: 1px; | |
59 margin-top: 1px; | |
60 } | 51 } |
61 | 52 |
62 .extension-error-icon { | 53 .extension-error-icon { |
63 -webkit-margin-end: 3px; | 54 -webkit-margin-end: 3px; |
64 -webkit-margin-start: 3px; | |
65 height: 15px; | 55 height: 15px; |
66 vertical-align: middle; | |
67 width: 15px; | 56 width: 15px; |
68 } | 57 } |
69 | 58 |
70 .extension-error-message { | 59 .extension-error-message { |
| 60 -webkit-margin-end: 15px; |
71 flex: 1; | 61 flex: 1; |
| 62 margin-bottom: 0; |
| 63 margin-top: 0; |
72 overflow: hidden; | 64 overflow: hidden; |
73 text-overflow: ellipsis; | 65 } |
74 vertical-align: middle; | 66 |
75 white-space: nowrap; | 67 .extension-error-metadata { |
| 68 align-items: center; |
| 69 display: flex; |
| 70 } |
| 71 |
| 72 .extension-error-metadata > .error-delete-button { |
| 73 background: url(chrome://theme/IDR_CLOSE_DIALOG) center no-repeat; |
| 74 height: 14px; |
| 75 opacity: 0.6; |
| 76 width: 14px; |
| 77 } |
| 78 |
| 79 .extension-error-metadata > .error-delete-button:hover { |
| 80 opacity: 0.8; |
| 81 } |
| 82 |
| 83 .extension-error-metadata > .error-delete-button:active { |
| 84 opacity: 1.0; |
76 } | 85 } |
77 | 86 |
78 .extension-error-severity-info .extension-error-message { | 87 .extension-error-severity-info .extension-error-message { |
79 color: #333; | 88 color: #333; |
80 } | 89 } |
81 .extension-error-severity-info .extension-error-icon { | 90 .extension-error-severity-info .extension-error-icon, |
| 91 .extension-error-info-icon { |
82 content: url(extension_error_severity_info.png); | 92 content: url(extension_error_severity_info.png); |
83 } | 93 } |
84 | 94 |
85 .extension-error-severity-warning .extension-error-message { | 95 .extension-error-severity-warning .extension-error-message { |
86 color: rgba(250, 145, 0, 255); | 96 color: rgba(250, 145, 0, 255); |
87 } | 97 } |
88 .extension-error-severity-warning .extension-error-icon { | 98 .extension-error-severity-warning .extension-error-icon, |
| 99 .extension-error-warning-icon { |
89 content: url(extension_error_severity_warning.png); | 100 content: url(extension_error_severity_warning.png); |
90 } | 101 } |
91 | 102 |
92 .extension-error-severity-fatal .extension-error-message { | 103 .extension-error-severity-fatal .extension-error-message { |
93 color: rgba(200, 50, 50, 255); | 104 color: rgba(200, 50, 50, 255); |
94 } | 105 } |
95 .extension-error-severity-fatal .extension-error-icon { | 106 .extension-error-severity-fatal .extension-error-icon, |
| 107 .extension-error-fatal-icon { |
96 content: url(extension_error_severity_fatal.png); | 108 content: url(extension_error_severity_fatal.png); |
97 } | 109 } |
OLD | NEW |