mirror of
https://github.com/react/react-native-devtools-frontend.git
synced 2026-10-13 01:54:52 +08:00
Reason: - EmptyWidget elements should not be headers as they do not meet the criteria (https://www.w3.org/TR/WCAG20-TECHS/G141.html) - Marking a non-header as a header will impede SR accessibility for the affected tools Changes: - Replacing <h2> tag from UI.EmptyWidget with <div> - Removing <h2> tag from _showPreview(...) function with <div> in BackgroundServiceView.js (supposed to mimic UI.EmptyWidget element) - Adding 'empty-bold-text' css in emptyWidget.css that mimics <h2> styling and adding the class to the <div> tags to retain h2 styling Examples of UI.EmptyWidget use cases: https://imgur.com/a/qpJeB2Y BackgroundServiceView.js unique case: https://imgur.com/cAW8Nu0 Change-Id: Iff3356f12b3dd1906141de4cfe9980b7b1d9c929 Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1693808 Reviewed-by: Joel Einbinder <einbinder@chromium.org> Commit-Queue: Michael Liao <michael.liao@microsoft.com> Cr-Original-Commit-Position: refs/heads/master@{#678026} Cr-Mirrored-From: https://chromium.googlesource.com/chromium/src Cr-Mirrored-Commit: 58d8c299b23fad86a6fe7e2b489f9cdded704011
34 lines
638 B
CSS
34 lines
638 B
CSS
/*
|
|
* Copyright (c) 2015 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.
|
|
*/
|
|
|
|
.empty-bold-text {
|
|
display: block;
|
|
font-size: 1.5em;
|
|
margin: .83em 0 .83em;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.empty-view {
|
|
color: hsla(0, 0%, 43%, 1);
|
|
padding: 30px;
|
|
display: flex;
|
|
align-items: center;
|
|
flex-direction: column;
|
|
min-width: 70px;
|
|
}
|
|
|
|
.empty-view-scroller {
|
|
justify-content: center;
|
|
overflow: auto;
|
|
}
|
|
|
|
.empty-view p {
|
|
white-space: initial;
|
|
line-height: 18px;
|
|
max-width: 300px;
|
|
flex-shrink: 0;
|
|
}
|