mirror of
https://github.com/react/react-native-devtools-frontend.git
synced 2026-10-07 04:26:32 +08:00
Adam Raine
3226e93291
Lighthouse users are sometimes unaware that auditing a page can clear potentially important resources: https://github.com/GoogleChrome/lighthouse/issues/772 Lighthouse will no longer clear resources in IndexedDB, WebSQL, or local storage when auditing a page. Since that change may affect performance scores, Lighthouse will display a top level warning in the report when data was found in any of those three locations. The warning tells the user they should audit in an incognito window. This CL adds an additional warning to the Lighthouse DevTools panel which conveys the same information. Preview: https://imgur.com/nN1ZfFR Bug: 806488 Change-Id: I64fd9e197868f690af0e0b89de52e0b7baa3f1fa Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2385182 Commit-Queue: Adam Raine <asraine@google.com> Reviewed-by: Connor Clark <cjamcl@chromium.org> Reviewed-by: Peter Marshall <petermarshall@chromium.org>
138 lines
2.4 KiB
CSS
138 lines
2.4 KiB
CSS
/*
|
|
* Copyright 2018 The Chromium Authors. All rights reserved.
|
|
* Use of this source code is governed by a BSD-style license that can be
|
|
* found in the LICENSE file.
|
|
*/
|
|
|
|
/* <3 */
|
|
|
|
.lighthouse-start-view {
|
|
font-family: Roboto, sans-serif;
|
|
font-size: var(--font-size);
|
|
line-height: 18px;
|
|
|
|
--color-blue: #0535c1;
|
|
|
|
/* for buttons */
|
|
--accent-color: var(--color-blue);
|
|
--accent-color-hover: #17b;
|
|
--color-bg: white;
|
|
--font-size: 14px;
|
|
--report-font-family: roboto, helvetica, arial, sans-serif;
|
|
}
|
|
|
|
.lighthouse-start-view header {
|
|
flex: 2 1;
|
|
padding: 16px;
|
|
display: grid;
|
|
justify-items: center;
|
|
}
|
|
|
|
.lighthouse-logo {
|
|
width: 75px;
|
|
height: 75px;
|
|
flex-shrink: 0;
|
|
background-repeat: no-repeat;
|
|
background-size: contain;
|
|
background-image: url(Images/lighthouse_logo.svg);
|
|
}
|
|
|
|
.lighthouse-start-view-text {
|
|
margin: 0 40px;
|
|
text-align: center;
|
|
}
|
|
|
|
.lighthouse-start-view form {
|
|
display: contents;
|
|
}
|
|
|
|
.lighthouse-form-section {
|
|
padding: 8px;
|
|
flex: 1 1;
|
|
}
|
|
|
|
.lighthouse-start-view.vbox .lighthouse-form-categories {
|
|
border-top: 1px solid #ebebeb;
|
|
border-bottom: 1px solid #ebebeb;
|
|
}
|
|
|
|
.lighthouse-form-section-label {
|
|
margin: 7px 0 7px;
|
|
font-weight: 500;
|
|
}
|
|
|
|
.lighthouse-form-section-label i span {
|
|
position: relative;
|
|
top: -2px;
|
|
}
|
|
|
|
.lighthouse-form-section-label span.largeicon-checkmark {
|
|
top: -4px;
|
|
}
|
|
|
|
.lighthouse-radio {
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
|
|
input[type="radio"]:focus {
|
|
outline-width: 2px;
|
|
}
|
|
|
|
.lighthouse-radio-text {
|
|
margin-left: 3px;
|
|
}
|
|
|
|
.lighthouse-start-button-container {
|
|
align-items: center;
|
|
}
|
|
|
|
.lighthouse-start-button-container button {
|
|
margin: 8px auto;
|
|
font-family: var(--report-font-family);
|
|
font-weight: 500;
|
|
font-size: var(--font-size);
|
|
}
|
|
|
|
.lighthouse-start-button-container button:disabled {
|
|
cursor: not-allowed;
|
|
}
|
|
|
|
.lighthouse-start-view .toolbar-dropdown-arrow {
|
|
display: none;
|
|
}
|
|
|
|
.lighthouse-launcher-row,
|
|
.lighthouse-radio {
|
|
margin-bottom: 6px;
|
|
}
|
|
|
|
.lighthouse-launcher-row:last-of-type,
|
|
.lighthouse-radio:last-of-type {
|
|
margin-bottom: 0;
|
|
}
|
|
|
|
.lighthouse-launcher-row .dimmed {
|
|
padding-left: 22px;
|
|
}
|
|
|
|
.lighthouse-help-text {
|
|
text-align: center;
|
|
color: red;
|
|
font-weight: bold;
|
|
padding-left: 10px;
|
|
}
|
|
|
|
.lighthouse-warning-text {
|
|
text-align: left;
|
|
color: darkorange;
|
|
font-weight: bold;
|
|
padding-left: 10px;
|
|
padding-top: 10px;
|
|
}
|
|
|
|
.lighthouse-warning-text::before {
|
|
content: '⚠';
|
|
margin-right: 10px;
|
|
}
|