mirror of
https://github.com/react/react-native-devtools-frontend.git
synced 2026-10-17 20:14:58 +08:00
Joey Arhar
5b7f7733d4
Currently in the websocket message viewer, sent text messages have a green background, received text messages have a white background, and binary messages are yellow on yellow. This patch removes all of these interesting colors and replaces them with data grid striping to look more like the other datagrids in devtools. Screenshots: http://crbug.com/963949#c2 Bug: 963949 Change-Id: I0403a8c67a36e5ad0bd006d59e60fc02d371d7ae Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1614036 Reviewed-by: Erik Luo <luoe@chromium.org> Commit-Queue: Joey Arhar <jarhar@chromium.org> Cr-Original-Commit-Position: refs/heads/master@{#660948} Cr-Mirrored-From: https://chromium.googlesource.com/chromium/src Cr-Mirrored-Commit: b7376e9a27a05101c607526f4c4441e582cbeb86
53 lines
1.1 KiB
CSS
53 lines
1.1 KiB
CSS
/*
|
|
* Copyright (c) 2014 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.
|
|
*/
|
|
|
|
.websocket-frame-view {
|
|
-webkit-user-select: text;
|
|
}
|
|
|
|
.websocket-frame-view .data-grid {
|
|
flex: auto;
|
|
border: none;
|
|
}
|
|
|
|
.websocket-frame-view .data-grid .data {
|
|
background-image: none;
|
|
}
|
|
|
|
.websocket-frame-view .data-grid tr.selected {
|
|
background-color: #def;
|
|
}
|
|
|
|
.websocket-frame-view .data-grid td,
|
|
.websocket-frame-view .data-grid th {
|
|
border-left-color: #ccc;
|
|
}
|
|
|
|
.websocket-frame-view-row-send td:first-child::before {
|
|
content: "\2B06";
|
|
color: #080;
|
|
padding-right: 4px;
|
|
}
|
|
|
|
.websocket-frame-view-row-receive td:first-child::before {
|
|
content: "\2B07";
|
|
color: #E65100;
|
|
padding-right: 4px;
|
|
}
|
|
|
|
.data-grid:focus .websocket-frame-view-row-send.selected td:first-child::before,
|
|
.data-grid:focus .websocket-frame-view-row-receive.selected td:first-child::before {
|
|
color: white;
|
|
}
|
|
|
|
.websocket-frame-view-row-error {
|
|
color: rgb(182, 0, 0);
|
|
}
|
|
|
|
.websocket-frame-view .toolbar {
|
|
border-bottom: var(--divider-border);
|
|
}
|