Bug 1294059 - Remove devtools/client/styleeditor/styleeditor.css and merge with devtools/client/themes/styleeditor.css. r=ntim
MozReview-Commit-ID: LtK7KbytFvK
--- a/devtools/client/jar.mn
+++ b/devtools/client/jar.mn
@@ -19,17 +19,16 @@ devtools.jar:
content/netmonitor/netmonitor-view.js (netmonitor/netmonitor-view.js)
content/webconsole/webconsole.xul (webconsole/webconsole.xul)
* content/scratchpad/scratchpad.xul (scratchpad/scratchpad.xul)
content/scratchpad/scratchpad.js (scratchpad/scratchpad.js)
content/shared/splitview.css (shared/splitview.css)
content/shared/theme-switching.js (shared/theme-switching.js)
content/shared/frame-script-utils.js (shared/frame-script-utils.js)
content/styleeditor/styleeditor.xul (styleeditor/styleeditor.xul)
- content/styleeditor/styleeditor.css (styleeditor/styleeditor.css)
content/storage/storage.xul (storage/storage.xul)
content/inspector/fonts/fonts.js (inspector/fonts/fonts.js)
content/inspector/layout/layout.js (inspector/layout/layout.js)
content/inspector/markup/markup.xhtml (inspector/markup/markup.xhtml)
content/animationinspector/animation-controller.js (animationinspector/animation-controller.js)
content/animationinspector/animation-panel.js (animationinspector/animation-panel.js)
content/animationinspector/animation-inspector.xhtml (animationinspector/animation-inspector.xhtml)
content/sourceeditor/codemirror/addon/comment/comment.js (sourceeditor/codemirror/addon/comment/comment.js)
deleted file mode 100644
--- a/devtools/client/styleeditor/styleeditor.css
+++ /dev/null
@@ -1,133 +0,0 @@
-/* vim:set ts=2 sw=2 sts=2 et: */
-/* This Source Code Form is subject to the terms of the Mozilla Public
- * License, v. 2.0. If a copy of the MPL was not distributed with this
- * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
-
-#style-editor-chrome {
- -moz-box-flex: 1;
-}
-
-.stylesheet-error-message {
- display: none;
-}
-
-li.error > .stylesheet-info > .stylesheet-more > .stylesheet-error-message {
- display: block;
-}
-
-.devtools-toolbar > spacer {
- -moz-box-flex: 1;
-}
-
-.splitview-nav > li,
-.stylesheet-info,
-.stylesheet-more {
- display: -moz-box;
-}
-
-.stylesheet-details-container {
- -moz-box-flex: 1;
-}
-
-.stylesheet-media-container {
- overflow-y: auto;
-}
-
-.media-rule-label {
- display: flex;
-}
-
-.media-rule-condition {
- flex: 1;
- overflow: hidden;
-}
-
-.splitview-nav > li {
- -moz-box-orient: horizontal;
-}
-
-.splitview-nav > li > hgroup {
- display: -moz-box;
- -moz-box-orient: vertical;
- -moz-box-flex: 1;
-}
-
-.stylesheet-info > h1 {
- -moz-box-flex: 1;
-}
-
-.stylesheet-name > label {
- display: inline;
- cursor: pointer;
-}
-
-.splitview-nav > li > hgroup.stylesheet-info {
- -moz-box-pack: center;
-}
-
-.stylesheet-name {
- white-space: nowrap;
-}
-
-li.unsaved > hgroup > h1 > .stylesheet-name:before {
- content: "*";
-}
-
-li.linked-file-error .stylesheet-linked-file {
- text-decoration: line-through;
-}
-
-li.linked-file-error .stylesheet-linked-file:after {
- content: " ✘";
-}
-
-li.linked-file-error .stylesheet-rule-count {
- visibility: hidden;
-}
-
-.stylesheet-linked-file:not(:empty):before {
- content: " ↳ ";
-}
-
-.stylesheet-enabled {
- display: -moz-box;
- cursor: pointer;
-}
-
-.stylesheet-saveButton {
- display: none;
- margin-top: 0px;
- margin-bottom: 0px;
-}
-
-.stylesheet-rule-count,
-li.splitview-active > hgroup > .stylesheet-more > h3 > .stylesheet-saveButton,
-li:hover > hgroup > .stylesheet-more > h3 > .stylesheet-saveButton {
- display: -moz-box;
-}
-
-.stylesheet-more > spacer {
- -moz-box-flex: 1;
-}
-
-/* portrait mode */
-@media (max-width: 550px) {
- li.splitview-active > hgroup > .stylesheet-more > .stylesheet-rule-count,
- li:hover > hgroup > .stylesheet-more > .stylesheet-rule-count {
- display: none;
- }
-
- .stylesheet-more {
- -moz-box-flex: 1;
- -moz-box-pack: end;
- }
-
- .splitview-nav > li > hgroup.stylesheet-info {
- -moz-box-orient: horizontal;
- -moz-box-flex: 1;
- }
-
- .stylesheet-more > spacer {
- -moz-box-flex: 0;
- }
-}
--- a/devtools/client/styleeditor/styleeditor.xul
+++ b/devtools/client/styleeditor/styleeditor.xul
@@ -13,17 +13,16 @@
%csscoverageDTD;
]>
<?xml-stylesheet href="chrome://global/skin/global.css" type="text/css"?>
<?xml-stylesheet href="chrome://devtools/content/shared/widgets/widgets.css" type="text/css"?>
<?xml-stylesheet href="chrome://devtools/content/shared/splitview.css" type="text/css"?>
<?xml-stylesheet href="chrome://devtools/skin/widgets.css" type="text/css"?>
<?xml-stylesheet href="chrome://devtools/skin/splitview.css" type="text/css"?>
-<?xml-stylesheet href="chrome://devtools/content/styleeditor/styleeditor.css" type="text/css"?>
<?xml-stylesheet href="chrome://devtools/skin/styleeditor.css" type="text/css"?>
<?xul-overlay href="chrome://global/content/editMenuOverlay.xul"?>
<xul:window xmlns:xul="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
xmlns="http://www.w3.org/1999/xhtml"
id="style-editor-chrome-window">
<script type="application/javascript;version=1.8"
--- a/devtools/client/themes/styleeditor.css
+++ b/devtools/client/themes/styleeditor.css
@@ -1,28 +1,79 @@
/* vim:set ts=2 sw=2 sts=2 et: */
/* This Source Code Form is subject to the terms of the Mozilla Public
* License, v. 2.0. If a copy of the MPL was not distributed with this
* file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+#style-editor-chrome {
+ -moz-box-flex: 1;
+}
+
+.splitview-nav > li,
+.stylesheet-info,
+.stylesheet-more,
+.stylesheet-rule-count,
+li.splitview-active > hgroup > .stylesheet-more > h3 > .stylesheet-saveButton,
+li:hover > hgroup > .stylesheet-more > h3 > .stylesheet-saveButton {
+ display: -moz-box;
+}
+
+.devtools-toolbar > spacer {
+ -moz-box-flex: 1;
+}
+
.style-editor-newButton {
list-style-image: url(images/add.svg);
}
.style-editor-importButton {
list-style-image: url(images/import.svg);
}
+.stylesheet-details-container {
+ -moz-box-flex: 1;
+}
+
+.stylesheet-media-container {
+ overflow-y: auto;
+}
+
+.stylesheet-error-message {
+ display: none;
+}
+
+li.error > .stylesheet-info > .stylesheet-more > .stylesheet-error-message {
+ display: block;
+}
+
.stylesheet-title,
.stylesheet-name {
text-decoration: none;
}
.stylesheet-name {
font-size: 13px;
+ white-space: nowrap;
+}
+
+.stylesheet-name > label {
+ display: inline;
+ cursor: pointer;
+}
+
+.stylesheet-info > h1 {
+ -moz-box-flex: 1;
+}
+
+.splitview-nav > li > hgroup.stylesheet-info {
+ -moz-box-pack: center;
+}
+
+.stylesheet-more > spacer {
+ -moz-box-flex: 1;
}
.theme-dark .stylesheet-title,
.theme-dark .stylesheet-name {
color: var(--theme-selection-color);
}
.theme-dark .stylesheet-rule-count,
@@ -38,32 +89,45 @@
.theme-light .stylesheet-rule-count,
.theme-light .stylesheet-linked-file,
.theme-light .stylesheet-saveButton {
color: var(--theme-body-color);
}
.stylesheet-saveButton {
+ display: none;
+ margin-top: 0px;
+ margin-bottom: 0px;
text-decoration: underline;
cursor: pointer;
}
.splitview-active .stylesheet-title,
.splitview-active .stylesheet-name,
.theme-light .splitview-active .stylesheet-rule-count,
.theme-light .splitview-active .stylesheet-linked-file,
.theme-light .splitview-active .stylesheet-saveButton {
color: var(--theme-selection-color);
}
.splitview-nav:focus {
outline: 0; /* focus ring is on the stylesheet name */
}
+.splitview-nav > li {
+ -moz-box-orient: horizontal;
+}
+
+.splitview-nav > li > hgroup {
+ display: -moz-box;
+ -moz-box-orient: vertical;
+ -moz-box-flex: 1;
+}
+
.splitview-nav > li.unsaved > hgroup .stylesheet-name {
font-style: italic;
}
.splitview-nav:-moz-locale-dir(ltr) > li.unsaved > hgroup .stylesheet-name:before,
.splitview-nav:-moz-locale-dir(rtl) > li.unsaved > hgroup .stylesheet-name:after {
font-style: italic;
}
@@ -82,16 +146,17 @@
border-bottom-color: #cddae5; /* Grey */
}
.theme-dark .media-rule-label {
border-bottom-color: #303b47; /* Grey */
}
.media-rule-label {
+ display: flex;
padding: 4px;
cursor: pointer;
border-bottom: 1px solid;
}
.media-responsive-mode-toggle {
color: var(--theme-highlight-blue);
text-decoration: underline;
@@ -100,17 +165,24 @@
.media-rule-line {
padding-inline-start: 4px;
}
.media-condition-unmatched {
opacity: 0.4;
}
+.media-rule-condition {
+ flex: 1;
+ overflow: hidden;
+}
+
.stylesheet-enabled {
+ display: -moz-box;
+ cursor: pointer;
padding: 8px 0;
margin: 0 8px;
background-image: url(images/itemToggle.svg);
background-repeat: no-repeat;
background-clip: content-box;
background-position: center;
background-size: 16px;
width: 24px;
@@ -133,20 +205,34 @@
}
.stylesheet-linked-file:not(:empty){
margin-inline-end: 0.4em;
}
.stylesheet-linked-file:not(:empty):before {
margin-inline-start: 0.4em;
+ content: " ↳ ";
+}
+
+li.unsaved > hgroup > h1 > .stylesheet-name:before {
+ content: "*";
+}
+
+li.linked-file-error .stylesheet-linked-file {
+ text-decoration: line-through;
}
li.linked-file-error .stylesheet-linked-file:after {
font-size: 110%;
+ content: " ✘";
+}
+
+li.linked-file-error .stylesheet-rule-count {
+ visibility: hidden;
}
.stylesheet-more > h3 {
font-size: 11px;
margin-inline-end: 2px;
}
.devtools-searchinput,
@@ -171,16 +257,21 @@ h3 {
@media (max-width: 700px) {
.stylesheet-sidebar {
width: 150px;
}
}
/* portrait mode */
@media (max-width: 550px) {
+ li.splitview-active > hgroup > .stylesheet-more > .stylesheet-rule-count,
+ li:hover > hgroup > .stylesheet-more > .stylesheet-rule-count {
+ display: none;
+ }
+
.splitview-nav {
box-shadow: none;
}
.splitview-nav > li.splitview-active {
background-size: 0 0, 0 0, auto;
}
@@ -191,21 +282,32 @@ h3 {
}
.disabled > .stylesheet-enabled {
background-position: -24px 0;
}
.splitview-nav > li > hgroup.stylesheet-info {
-moz-box-align: baseline;
+ -moz-box-orient: horizontal;
+ -moz-box-flex: 1;
}
.stylesheet-sidebar {
width: 180px;
}
+
+ .stylesheet-more {
+ -moz-box-flex: 1;
+ -moz-box-pack: end;
+ }
+
+ .stylesheet-more > spacer {
+ -moz-box-flex: 0;
+ }
}
/* CSS coverage */
.csscoverage-report {
background-color: var(--theme-toolbar-background);
-moz-box-orient: horizontal;
}