| commit | 9a3d85fa0b69e2aac9e494b2f282a8b6a197a9e3 | [log] [tgz] |
|---|---|---|
| author | Peter Marshall <[email protected]> | Wed Aug 12 14:38:00 2020 |
| committer | Commit Bot <[email protected]> | Mon Aug 24 07:58:42 2020 |
| tree | 30b1890b05a531beb0dd340cf56f427fd4355747 | |
| parent | aeac448bc192ab9eff6296b056cb3f953c9baf79 [diff] [blame] |
css: Use :focus-visible instead of our custom data-keyboard-focus https://developer.mozilla.org/en-US/docs/Web/CSS/:focus-visible :focus-visible is basically the exact same functionality as the custom data-keyboard-focus attribute that devtools maintains. This CL converts all of our uses of data-keyboard-focus in CSS to use :focus-visible. This has no intended behaviour change although it's possible there are small differences in our implementation vs. the web platform one, so this might cause some regression with focus styles for keyboard interaction. I tested a few of these manually to verify they still do the same thing. The CSS linter was unhappy about the ordering of some rules due to specificity-ordering checks, so there is some re-ordering too. A follow-up CL will remove our implementation of data-keyboard-focus. Change-Id: Ifc273f7d82e16ea07e24ed2d1faa6f794a12501d Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2352236 Commit-Queue: Peter Marshall <[email protected]> Reviewed-by: Jack Franklin <[email protected]> Reviewed-by: Kalon Hinds <[email protected]> Reviewed-by: Jack Lynch <[email protected]> Reviewed-by: Brandon Goddard <[email protected]>
diff --git a/front_end/sources/watchExpressionsSidebarPane.css b/front_end/sources/watchExpressionsSidebarPane.css index a53f73a..4e8c64e 100644 --- a/front_end/sources/watchExpressionsSidebarPane.css +++ b/front_end/sources/watchExpressionsSidebarPane.css
@@ -101,7 +101,7 @@ background-color: #f0f0f0; } -.watch-expression-header:focus[data-keyboard-focus="true"] { +.watch-expression-header:focus-visible { background: var(--focus-bg-color); }