From 1d5f9f7aa7ac0bfe6a091b7c1395cafa33d52c43 Mon Sep 17 00:00:00 2001 From: Horst3180 Date: Wed, 19 Aug 2015 19:38:44 +0200 Subject: add firefox theme --- .../chrome/browser/devtools/ruleview.css | 264 +++++++++++++++++++++ 1 file changed, 264 insertions(+) create mode 100644 arc-firefox-theme/chrome/browser/devtools/ruleview.css (limited to 'arc-firefox-theme/chrome/browser/devtools/ruleview.css') diff --git a/arc-firefox-theme/chrome/browser/devtools/ruleview.css b/arc-firefox-theme/chrome/browser/devtools/ruleview.css new file mode 100644 index 0000000..8c2e3d1 --- /dev/null +++ b/arc-firefox-theme/chrome/browser/devtools/ruleview.css @@ -0,0 +1,264 @@ +/* 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/. */ + +/* CSS Variables specific to this panel that aren't defined by the themes */ +.theme-light { + --rule-highlight-background-color: #ffee99; +} + +.theme-dark { + --rule-highlight-background-color: #594724; +} + +.ruleview { + height: 100%; +} + +.ruleview-rule-source { + -moz-padding-start: 5px; + text-align: end; + float: right; + -moz-user-select: none; +} + +.ruleview-rule-source, +.ruleview-rule-source > label { + cursor: pointer; +} + +.ruleview-rule-source[unselectable], +.ruleview-rule-source[unselectable] > label { + cursor: default; +} + +.ruleview-rule-source:not([unselectable]):hover { + text-decoration: underline; +} + +.ruleview-header { + border-top-width: 1px; + border-bottom-width: 1px; + border-top-style: solid; + border-bottom-style: solid; + padding: 1px 4px; + -moz-user-select: none; + word-wrap: break-word; + margin-top: 4px; +} + +.ruleview-rule-pseudo-element { + padding-left:20px; + border-left: solid 10px; +} + +.ruleview-rule, +#noResults { + padding: 2px 4px; +} + +/* User agent styles are not editable, display them differently */ +.ruleview-rule[uneditable=true] { + background: var(--theme-tab-toolbar-background); +} + +.ruleview-rule[uneditable=true] :focus { + outline: none; +} + +.ruleview-rule[uneditable=true] .theme-link { + color: var(--theme-highlight-bluegrey); +} + +.ruleview-rule[uneditable=true] .ruleview-enableproperty { + visibility: hidden; +} + +.ruleview-rule[uneditable=true] .ruleview-swatch { + cursor: default; +} + +.ruleview-rule[uneditable=true] .ruleview-namecontainer > .ruleview-propertyname, +.ruleview-rule[uneditable=true] .ruleview-propertyvaluecontainer > +.ruleview-propertyvalue { + border-bottom-color: transparent; +} + +#noResults { + font: message-box; + color: GrayText; +} + +.ruleview-rule + .ruleview-rule { + border-top-width: 1px; + border-top-style: dotted; +} + +.ruleview-warning { + background-image: url(alerticon-warning.png); + background-size: 13px 12px; + -moz-margin-start: 5px; + display: inline-block; + vertical-align: top; + width: 13px; + height: 12px; +} + + +@media (min-resolution: 1.25dppx) { + .ruleview-warning { + background-image: url(alerticon-warning@2x.png); + } +} + +.ruleview-ruleopen { + -moz-padding-end: 5px; +} + +.ruleview-ruleclose { + cursor: text; + padding-right: 20px; +} + +.ruleview-propertylist { + list-style: none; + padding: 0; + margin: 0; +} + +.ruleview-rule:not(:hover) .ruleview-enableproperty { + visibility: hidden; +} + +.ruleview-expander { + display: inline-block; +} + +.ruleview-newproperty { + /* (enable checkbox width: 12px) + (expander width: 15px) */ + -moz-margin-start: 27px; +} + +.ruleview-namecontainer, +.ruleview-propertyvaluecontainer, +.ruleview-propertyname, +.ruleview-propertyvalue { + text-decoration: inherit; +} + +.ruleview-computedlist { + list-style: none; + padding: 0; +} + +.ruleview-computed { + -moz-margin-start: 35px; +} + +.ruleview-swatch { + cursor: pointer; + border-radius: 50%; + width: 1em; + height: 1em; + vertical-align: text-top; + -moz-margin-end: 5px; + display: inline-block; + position: relative; +} + +.ruleview-colorswatch::before { + content: ''; + background-color: #eee; + background-image: linear-gradient(45deg, #ccc 25%, transparent 25%, transparent 75%, #ccc 75%, #ccc), + linear-gradient(45deg, #ccc 25%, transparent 25%, transparent 75%, #ccc 75%, #ccc); + background-size: 12px 12px; + background-position: 0 0, 6px 6px; + position: absolute; + border-radius: 50%; + top: 0; + left: 0; + right: 0; + bottom: 0; + z-index: -1; +} + +.ruleview-bezierswatch { + background: url("chrome://browser/skin/devtools/cubic-bezier-swatch.png"); + background-size: 1em; +} + +.ruleview-filterswatch { + background: url("chrome://browser/skin/devtools/filter-swatch.svg"); + background-size: 1em; +} + +@media (min-resolution: 1.25dppx) { + .ruleview-bezierswatch { + background: url("chrome://browser/skin/devtools/cubic-bezier-swatch@2x.png"); + background-size: 1em; + } +} + +.ruleview-overridden { + text-decoration: line-through; +} + +.theme-light .ruleview-overridden { + text-decoration-color: var(--theme-content-color3); +} + +.styleinspector-propertyeditor { + border: 1px solid #CCC; + padding: 0; +} + +.ruleview-property { + border-left: 3px solid transparent; + clear: right; +} + +.ruleview-propertycontainer > * { + vertical-align: middle; +} + +.ruleview-property[dirty] { + border-left-color: var(--theme-highlight-green); +} + +.ruleview-highlight { + background-color: var(--rule-highlight-background-color); +} + +.ruleview-namecontainer > .ruleview-propertyname, +.ruleview-propertyvaluecontainer > .ruleview-propertyvalue { + border-bottom: 1px dashed transparent; +} + +.ruleview-namecontainer:hover > .ruleview-propertyname, +.ruleview-propertyvaluecontainer:hover > .ruleview-propertyvalue { + border-bottom-color: hsl(0,0%,50%); +} + +.ruleview-selector { + word-wrap: break-word; +} + +.ruleview-selector-separator, .ruleview-selector-unmatched { + color: #888; +} + +.ruleview-selectorhighlighter { + background: url("chrome://browser/skin/devtools/vview-open-inspector.png") no-repeat 0 0; + padding-left: 16px; + margin-left: 5px; + cursor: pointer; +} + +.ruleview-selectorhighlighter:hover { + background-position: -32px 0; +} + +.ruleview-selectorhighlighter:active, +.ruleview-selectorhighlighter.highlighted { + background-position: -16px 0; +} -- cgit v1.2.3