michael@0: /* This Source Code Form is subject to the terms of the Mozilla Public
michael@0:  * License, v. 2.0. If a copy of the MPL was not distributed with this
michael@0:  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
michael@0: 
michael@0: .ruleview {
michael@0:   height: 100%;
michael@0: }
michael@0: 
michael@0: .ruleview-rule-source {
michael@0:   -moz-padding-start: 5px;
michael@0:   cursor: pointer;
michael@0:   text-align: right;
michael@0:   float: right;
michael@0:   -moz-user-select: none;
michael@0: }
michael@0: 
michael@0: .ruleview-header {
michael@0:   border-top-width: 1px;
michael@0:   border-bottom-width: 1px;
michael@0:   border-top-style: solid;
michael@0:   border-bottom-style: solid;
michael@0:   padding: 1px 4px;
michael@0:   -moz-user-select: none;
michael@0:   word-wrap: break-word;
michael@0: %ifndef XP_MACOSX
michael@0:   margin-top: 4px;
michael@0: %endif
michael@0: }
michael@0: 
michael@0: .ruleview-rule-pseudo-element {
michael@0:   padding-left:20px;
michael@0:   border-left: solid 10px;
michael@0: }
michael@0: 
michael@0: .ruleview-rule-source:hover {
michael@0:   text-decoration: underline;
michael@0: }
michael@0: 
michael@0: .ruleview-rule,
michael@0: #noResults {
michael@0:   padding: 2px 4px;
michael@0: }
michael@0: 
michael@0: #noResults {
michael@0:   font: message-box;
michael@0:   color: GrayText;
michael@0: }
michael@0: 
michael@0: .ruleview-rule + .ruleview-rule {
michael@0:   border-top-width: 1px;
michael@0:   border-top-style: dotted;
michael@0: }
michael@0: 
michael@0: .ruleview-warning {
michael@0:   background: url("chrome://browser/skin/devtools/alerticon-warning.png");
michael@0:   -moz-margin-start: 5px;
michael@0:   display: inline-block;
michael@0:   vertical-align: top;
michael@0:   width: 13px;
michael@0:   height: 12px;
michael@0: }
michael@0: 
michael@0: .ruleview-ruleopen {
michael@0:   -moz-padding-end: 5px;
michael@0: }
michael@0: 
michael@0: .ruleview-ruleclose {
michael@0:   cursor: text;
michael@0:   padding-right: 20px;
michael@0: }
michael@0: 
michael@0: .ruleview-propertylist {
michael@0:   list-style: none;
michael@0:   padding: 0;
michael@0:   margin: 0;
michael@0: }
michael@0: 
michael@0: .ruleview-rule:not(:hover) .ruleview-enableproperty {
michael@0:   visibility: hidden;
michael@0: }
michael@0: 
michael@0: .ruleview-expander {
michael@0:   display: inline-block;
michael@0: }
michael@0: 
michael@0: .ruleview-newproperty {
michael@0:   /* (enable checkbox width: 12px) + (expander width: 15px) */
michael@0:   -moz-margin-start: 27px;
michael@0: }
michael@0: 
michael@0: .ruleview-namecontainer,
michael@0: .ruleview-propertycontainer,
michael@0: .ruleview-propertyname,
michael@0: .ruleview-propertyvalue {
michael@0:   text-decoration: inherit;
michael@0: }
michael@0: 
michael@0: .ruleview-computedlist {
michael@0:   list-style: none;
michael@0:   padding: 0;
michael@0: }
michael@0: 
michael@0: .ruleview-computed {
michael@0:   -moz-margin-start: 35px;
michael@0: }
michael@0: 
michael@0: .ruleview-colorswatch {
michael@0:   border-radius: 50%;
michael@0:   width: 1em;
michael@0:   height: 1em;
michael@0:   vertical-align: text-top;
michael@0:   -moz-margin-end: 5px;
michael@0: }
michael@0: 
michael@0: .ruleview-overridden {
michael@0:   text-decoration: line-through;
michael@0: }
michael@0: 
michael@0: .theme-light .ruleview-overridden {
michael@0:   -moz-text-decoration-color: #667380; /*  Content (Text) - Dark Grey */
michael@0: }
michael@0: 
michael@0: .styleinspector-propertyeditor {
michael@0:   border: 1px solid #CCC;
michael@0:   padding: 0;
michael@0: }
michael@0: 
michael@0: .ruleview-property {
michael@0:   border-left: 3px solid transparent;
michael@0:   clear: right;
michael@0: }
michael@0: 
michael@0: .ruleview-property  > * {
michael@0:   vertical-align: middle;
michael@0: }
michael@0: 
michael@0: .theme-dark .ruleview-property[dirty] {
michael@0:   border-left-color: #70bf53; /* Green */
michael@0: }
michael@0: 
michael@0: .theme-light .ruleview-property[dirty] {
michael@0:   border-left-color: #2cbb0f; /* Green */
michael@0: }
michael@0: 
michael@0: .ruleview-namecontainer > .ruleview-propertyname,
michael@0: .ruleview-propertycontainer > .ruleview-propertyvalue {
michael@0:   border-bottom: 1px dashed transparent;
michael@0: }
michael@0: 
michael@0: .ruleview-namecontainer:hover > .ruleview-propertyname,
michael@0: .ruleview-propertycontainer:hover > .ruleview-propertyvalue {
michael@0:   border-bottom-color: hsl(0,0%,50%);
michael@0: }
michael@0: 
michael@0: .ruleview-selector {
michael@0:   word-wrap: break-word;
michael@0: }
michael@0: 
michael@0: .ruleview-selector-separator, .ruleview-selector-unmatched {
michael@0:   color: #888;
michael@0: }