Files
react-native-devtools-frontend/front_end/elements/computedStyleSidebarPane.css
T
Erik Luo 94efa87349 DevTools: give visual signal when filters are active
- Non-empty text filters retain their blue outline even when not
  focused.
- Searching the the StylesSidebarPane no longer highlights the
  toolbar yellow, just the selector/prop matches.

Screenshots:
https://imgur.com/a/suybNVy
https://imgur.com/a/s0R04ar

Bug: 808159
Change-Id: I7dc5b89ca96ca181e767bd271cd648bee4cb0ca1
Reviewed-on: https://chromium-review.googlesource.com/1060574
Reviewed-by: Andrey Lushnikov <lushnikov@chromium.org>
Commit-Queue: Erik Luo <luoe@chromium.org>
Cr-Original-Commit-Position: refs/heads/master@{#571967}
Cr-Mirrored-From: https://chromium.googlesource.com/chromium/src
Cr-Mirrored-Commit: 3078ce545f4c4ea7b39d3b3466f12ea330c6e6d8
2018-07-02 19:32:06 +00:00

35 lines
752 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.
*/
.computed-properties {
-webkit-user-select: text;
flex-shrink: 0;
}
.styles-sidebar-pane-toolbar {
border-bottom: 1px solid #eee;
flex-shrink: 0;
}
.styles-sidebar-pane-filter-box {
flex: auto;
display: flex;
}
.styles-sidebar-pane-filter-box > input {
outline: none !important;
border: none;
width: 100%;
background: white;
padding-left: 4px;
margin: 3px;
}
.styles-sidebar-pane-filter-box > input:focus,
.styles-sidebar-pane-filter-box > input:not(:placeholder-shown) {
box-shadow: var(--focus-ring-active-shadow);
}