| OLD | NEW |
|---|
| 1 /* | 1 /* |
| 2 * Copyright 2017 The Chromium Authors. All rights reserved. | 2 * Copyright 2017 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 .audits2-view { | 7 .toolbar { |
| 8 max-width: 550px; | 8 border-bottom: 1px solid #ccc; |
| 9 min-width: 334px; | |
| 10 align-self: center; | |
| 11 margin: 30px 20px; | |
| 12 } | |
| 13 | |
| 14 .results-view { | |
| 15 display: none; | |
| 16 flex-wrap: nowrap; | |
| 17 justify-content: flex-start; | |
| 18 align-content: stretch; | |
| 19 align-items: stretch; | |
| 20 } | |
| 21 | |
| 22 .show-results .audits2-view { | |
| 23 display: none; | |
| 24 } | |
| 25 | |
| 26 .show-results .results-view { | |
| 27 display: flex; | |
| 28 flex: auto; | |
| 29 } | |
| 30 | |
| 31 .results-bar { | |
| 32 flex: none; | |
| 33 align-self: auto; | |
| 34 border-bottom: 1px solid #cccccc; | |
| 35 } | |
| 36 | |
| 37 .audits2-summary { | |
| 38 display: flex; | |
| 39 flex-direction: column; | |
| 40 flex-grow: 1; | |
| 41 padding: 6px; | |
| 42 line-height: 1.7; | |
| 43 align-self: center; | |
| 44 } | |
| 45 | |
| 46 .audits2-summary span { | |
| 47 color: #b7b7b7; | |
| 48 display: block; | |
| 49 overflow: hidden; | |
| 50 text-overflow: ellipsis; | |
| 51 white-space: nowrap; | |
| 52 } | |
| 53 | |
| 54 .audits2-summary span b { | |
| 55 font-weight: normal; | |
| 56 color: #636382; | |
| 57 } | |
| 58 | |
| 59 .audits2-summary span:first-child { | |
| 60 color: inherit; | |
| 61 font-size: 110%; | |
| 62 } | 9 } |
| 63 | 10 |
| 64 .audits2-logo { | 11 .audits2-logo { |
| 65 width: 100px; | 12 width: 210px; |
| 66 height: 110px; | 13 height: 200px; |
| 67 flex-shrink: 0; | 14 flex-shrink: 0; |
| 68 background-repeat: no-repeat; | 15 background-repeat: no-repeat; |
| 69 background-size: contain; | 16 background-size: contain; |
| 70 margin-top: 10px; | 17 margin-top: 10px; |
| 71 background-image: -webkit-image-set( | 18 background-image: url(Images/audits_logo.svg); |
| 72 url(Images/audits_logo.png) 1x, | |
| 73 url(Images/audits_logo_2x.png) 2x); | |
| 74 } | 19 } |
| 75 | 20 |
| 76 .audits2-logo-small { | 21 .audits2-landing-page { |
| 77 background-image: -webkit-image-set( | 22 display: flex; |
| 78 url(Images/audits_logo_bw.png) 1x, | 23 align-items: center; |
| 79 url(Images/audits_logo_bw_2x.png) 2x); | 24 justify-content: center; |
| 80 height: 41px; | |
| 81 width: 42px; | |
| 82 align-self: center; | |
| 83 margin: 0 0 0 20px; | |
| 84 flex-shrink: 0; | |
| 85 } | 25 } |
| 86 | 26 |
| 87 .report-container { | 27 |
| 88 flex: 1 1 auto; | 28 .audits2-landing-center { |
| 89 align-self: auto; | 29 display: flex; |
| 90 position: relative; | 30 align-items: center; |
| 91 overflow: auto; | 31 justify-content: center; |
| 32 max-width: 400px; |
| 33 margin: 50px; |
| 92 } | 34 } |
| 93 | 35 |
| 94 .audits2-form label { | 36 .audits2-landing-text { |
| 95 display: flex; | 37 color: #666; |
| 96 } | 38 } |
| 97 | 39 |
| 98 .audits2-form label div { | 40 .audits2-landing-bold-text { |
| 99 display: inline; | 41 font-weight: bold; |
| 100 } | |
| 101 | |
| 102 button.audit-btn { | |
| 103 display: inline-block; | |
| 104 color: white; | |
| 105 text-shadow: none; | |
| 106 padding: 6px 10px; | |
| 107 background-color: #4285f4 !important; | |
| 108 background-image: unset !important; | |
| 109 font-size: 11px; | |
| 110 box-shadow: none !important; | |
| 111 } | |
| 112 | |
| 113 button.audit-btn:hover { | |
| 114 background-color: hsla(217, 89%, 58%, 1) !important; | |
| 115 color: white !important; | |
| 116 } | |
| 117 | |
| 118 button.run-audit { | |
| 119 margin-top: 12px; | |
| 120 } | |
| 121 button.run-audit.started { | |
| 122 background-color: #ffffff !important; | |
| 123 color: gray; | |
| 124 } | |
| 125 | |
| 126 button.run-audit.started:hover { | |
| 127 background-color: #eee !important; | |
| 128 color: gray !important; | |
| 129 } | |
| 130 | |
| 131 button.new-audit { | |
| 132 align-self: center; | |
| 133 margin-right: 20px; | |
| 134 } | |
| 135 | |
| 136 .audits2-status .icon { | |
| 137 width: 16px; | |
| 138 height: 16px; | |
| 139 margin-top: 10px; | |
| 140 margin-right: 4px; | |
| 141 animation: spinner-animation 1200ms linear infinite; | |
| 142 transform-origin: 50% 50%; | |
| 143 padding: 1px; | |
| 144 } | |
| 145 | |
| 146 .audits2-status .icon::before { | |
| 147 display: inline-block; | |
| 148 border: 1px solid #1565C0; | |
| 149 border-radius: 7px; | |
| 150 width: 14px; | |
| 151 height: 14px; | |
| 152 content: ""; | |
| 153 position: absolute; | |
| 154 box-sizing: border-box; | |
| 155 } | |
| 156 | |
| 157 .audits2-status .icon::after { | |
| 158 display: inline-block; | |
| 159 width: 6px; | |
| 160 height: 7px; | |
| 161 background: white; | |
| 162 position: absolute; | |
| 163 content: ""; | |
| 164 } | |
| 165 | |
| 166 .audits2-status .icon.error, | |
| 167 .audits2-status .icon.error::before, | |
| 168 .audits2-status .icon.error::after { | |
| 169 display:none; | |
| 170 } | 42 } |
| 171 | 43 |
| 172 .lh-root { | 44 .lh-root { |
| 173 --report-menu-width: 0 !important; | 45 --report-menu-width: 0 !important; |
| 174 } | 46 } |
| 175 | 47 |
| 48 .audits2-landing-center button { |
| 49 margin-top: 20px; |
| 50 } |
| 176 | 51 |
| 177 @keyframes spinner-animation { | 52 .report-container { |
| 178 from { transform: rotate(0); } | 53 overflow: auto; |
| 179 to { transform: rotate(360deg); } | 54 position: relative; |
| 55 } |
| OLD | NEW |
|---|
Chromium Code Reviews
Issue 2851213005:
DevTools: brush up audits 2 launcher UI, allow multiple audit runs, introduce landing page. (Closed)
