From 5f8de423f190bbb79a62f804151bc24824fa32d8 Mon Sep 17 00:00:00 2001 From: "Matt A. Tobin" Date: Fri, 2 Feb 2018 04:16:08 -0500 Subject: Add m-esr52 at 52.6.0 --- devtools/client/themes/styleeditor.css | 445 +++++++++++++++++++++++++++++++++ 1 file changed, 445 insertions(+) create mode 100644 devtools/client/themes/styleeditor.css (limited to 'devtools/client/themes/styleeditor.css') diff --git a/devtools/client/themes/styleeditor.css b/devtools/client/themes/styleeditor.css new file mode 100644 index 000000000..db70a340a --- /dev/null +++ b/devtools/client/themes/styleeditor.css @@ -0,0 +1,445 @@ +/* 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, +.theme-dark .stylesheet-linked-file, +.theme-dark .stylesheet-saveButton { + color: var(--theme-body-color-alt); +} + +.theme-light .stylesheet-title, +.theme-light .stylesheet-name { + color: var(--theme-body-color-alt); +} + +.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; +} + +.splitview-nav.empty > p { + padding: 0 10px; +} + +.stylesheet-sidebar { + max-width: 400px; + min-width: 100px; + border-color: var(--theme-splitter-color); +} + +.theme-light .media-rule-label { + 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; +} + +.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/item-toggle.svg); + background-repeat: no-repeat; + background-clip: content-box; + background-position: center; + background-size: 16px; + width: 24px; + height: 40px; + filter: var(--icon-filter); +} + +.disabled > .stylesheet-enabled { + opacity: 0.3; +} + +/* Invert the toggle icon in the active row for light theme */ +.theme-light .splitview-nav > li.splitview-active .stylesheet-enabled { + filter: invert(1); +} + +.splitview-nav > li > .stylesheet-enabled:focus, +.splitview-nav > li:hover > .stylesheet-enabled { + outline: 0; +} + +.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, +.devtools-filterinput { + max-width: 25ex; + font-size: 11px; +} + +.placeholder a { + text-decoration: underline; +} + +h1, +h2, +h3 { + font-size: inherit; + font-weight: normal; + margin: 0; + padding: 0; +} + +@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; + } + + .stylesheet-enabled { + padding: 0; + background-position: 0 0; + height: 24px; + } + + .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; +} + +.csscoverage-report-container { + height: 100vh; + padding: 0 10px; + overflow-x: hidden; + overflow-y: auto; + -moz-box-flex: 1; +} + +.csscoverage-report-content { + margin: 20px auto; + -moz-column-width: 300px; + font-size: 13px; + -moz-user-select: text; +} + +.csscoverage-report-summary, +.csscoverage-report-unused, +.csscoverage-report-optimize { + display: inline-block; +} + +.csscoverage-report-unused, +.csscoverage-report-optimize { + flex: 1; + min-width: 0; +} + +@media (max-width: 950px) { + .csscoverage-report-content { + display: block; + } + + .csscoverage-report-summary { + display: block; + text-align: center; + } +} + +.csscoverage-report h1 { + font-size: 120%; +} + +.csscoverage-report h2 { + font-size: 110%; +} + +.csscoverage-report h1, +.csscoverage-report h2, +.csscoverage-report h3 { + font-weight: bold; + margin: 10px 0; +} + +.csscoverage-report code, +.csscoverage-report textarea { + font-family: var(--monospace-font-family); + font-size: inherit; +} + +.csscoverage-list:after { + content: ', '; +} + +.csscoverage-list:last-child:after { + display: none; +} + +.csscoverage-report textarea { + width: 100%; + height: 100px; +} + +.csscoverage-report a { + cursor: pointer; + text-decoration: underline; +} + +.csscoverage-report > .csscoverage-toolbar { + border: none; + margin: 0; + padding: 0; +} + +.csscoverage-report > .csscoverage-toolbarbutton { + min-width: 4em; + min-height: 100vh; + margin: 0; + padding: 0; + border-radius: 0; + border-top: none; + border-bottom: none; + border-inline-start: none; +} + +.csscoverage-report .pie-table-chart-container { + -moz-box-orient: vertical; + text-align: start; +} + +.chart-colored-blob[name="Used Preload"] { + fill: var(--theme-highlight-pink); + background: var(--theme-highlight-pink); +} + +.chart-colored-blob[name=Used] { + fill: var(--theme-highlight-green); + background: var(--theme-highlight-green); +} + +.chart-colored-blob[name=Unused] { + fill: var(--theme-highlight-lightorange); + background: var(--theme-highlight-lightorange); +} + +/* Undo 'largest' customization */ +.theme-dark .pie-chart-slice[largest] { + stroke-width: 1px; + stroke: rgba(0,0,0,0.2); +} + +.theme-light .pie-chart-slice[largest] { + stroke-width: 1px; + stroke: rgba(255,255,255,0.8); +} + +.csscoverage-report .pie-chart-slice { + cursor: default; +} + +.csscoverage-report-chart { + margin: 0 20px; +} -- cgit v1.2.3