Bug 1404801 - Part 3: Avoid applying old animationinspector.css in inspector.xhtml. r=gl
authorDaisuke Akatsuka <dakatsuka@mozilla.com>
Thu, 26 Oct 2017 16:55:41 +0900
changeset 688127 c53b1e78bd886f9e3f7e3d645928a3d42e6e948b
parent 688126 d0e460f14cae081458466becb14e38d9a7728bd3
child 688128 8fc606ab71ed553099c710e627bcf07c987dc452
push id86669
push userhikezoe@mozilla.com
push dateSat, 28 Oct 2017 10:13:18 +0000
reviewersgl
bugs1404801
milestone58.0a1
Bug 1404801 - Part 3: Avoid applying old animationinspector.css in inspector.xhtml. r=gl Accompanied by React-ify, although we will change the CSS as well, the selector may be conflicted if old animationinspector.css is in inspector.xhtml. Therefore, we will make the CSS to impact within only animation-inspector.xhtml. MozReview-Commit-ID: HnYDaasssf4
devtools/client/inspector/inspector.xhtml
devtools/client/themes/animationinspector.css
devtools/client/themes/inspector.css
--- a/devtools/client/inspector/inspector.xhtml
+++ b/devtools/client/inspector/inspector.xhtml
@@ -10,17 +10,16 @@
 
   <link rel="stylesheet" href="chrome://devtools/skin/widgets.css"/>
   <link rel="stylesheet" href="chrome://devtools/skin/inspector.css"/>
   <link rel="stylesheet" href="chrome://devtools/skin/rules.css"/>
   <link rel="stylesheet" href="chrome://devtools/skin/computed.css"/>
   <link rel="stylesheet" href="chrome://devtools/skin/fonts.css"/>
   <link rel="stylesheet" href="chrome://devtools/skin/boxmodel.css"/>
   <link rel="stylesheet" href="chrome://devtools/skin/layout.css"/>
-  <link rel="stylesheet" href="chrome://devtools/skin/animationinspector.css"/>
   <link rel="stylesheet" href="resource://devtools/client/shared/components/tabs/Tabs.css"/>
   <link rel="stylesheet" href="resource://devtools/client/shared/components/tabs/TabBar.css"/>
   <link rel="stylesheet" href="resource://devtools/client/inspector/components/InspectorTabPanel.css"/>
   <link rel="stylesheet" href="resource://devtools/client/shared/components/splitter/SplitBox.css"/>
   <link rel="stylesheet" href="resource://devtools/client/inspector/layout/components/Accordion.css"/>
   <link rel="stylesheet" href="resource://devtools/client/shared/components/reps/reps.css"/>
   <link rel="stylesheet" href="resource://devtools/client/shared/components/tree/TreeView.css"/>
 
--- a/devtools/client/themes/animationinspector.css
+++ b/devtools/client/themes/animationinspector.css
@@ -135,21 +135,16 @@ body {
 }
 
 [timeline] #timeline-toolbar {
   display: flex;
 }
 
 /* The main animations container */
 
-#sidebar-panel-animationinspector {
-  height: 100%;
-  width: 100%;
-}
-
 #players {
   height: calc(100% - var(--toolbar-height));
 }
 
 [empty] #players {
   display: none;
 }
 
--- a/devtools/client/themes/inspector.css
+++ b/devtools/client/themes/inspector.css
@@ -187,8 +187,14 @@ iframe {
   flex: 1;
   min-height: 0;
 }
 
 #markup-box > iframe {
   height: 100%;
   width: 100%;
 }
+
+/* Animation inspector */
+#sidebar-panel-animationinspector {
+  height: 100%;
+  width: 100%;
+}