DevTools: Make labeled checkbox a web component

Source/devtools/front_end/elements/elementsPanel.css

Index: Source/devtools/front_end/elements/elementsPanel.css
diff --git a/Source/devtools/front_end/elements/elementsPanel.css b/Source/devtools/front_end/elements/elementsPanel.css
index b9337801727d833ac01aeacdc975bd9148ea927a..d407bc9ea73eb536f6d29c78f3bb730706abe91f 100644
--- a/Source/devtools/front_end/elements/elementsPanel.css
+++ b/Source/devtools/front_end/elements/elementsPanel.css
@@ -715,10 +715,13 @@ li.child-editing .styles-clipboard-only {
 }
 
 label.checkbox-with-label {
-    display: flex;
     -webkit-user-select: none;
 }
 
+label.checkbox-with-label > .dt-checkbox-text {
+    margin-top: 1px;
+}
+
 .events-pane .section:not(:first-of-type) {
     border-top: 1px solid rgb(231, 231, 231);
 }