LCARStrek/browser/devtools/ruleview.css

   1 /* This Source Code Form is subject to the terms of the Mozilla Public
   2  * License, v. 2.0. If a copy of the MPL was not distributed with this
   3  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
   4
   5 .ruleview {
   6   height: 100%;
   7 }
   8
   9 .ruleview-rule-source {
  10   -moz-padding-start: 5px;
  11   cursor: pointer;
  12   text-align: right;
  13   float: right;
  14   -moz-user-select: none;
  15 }
  16
  17 .ruleview-header {
  18   border-top-width: 1px;
  19   border-bottom-width: 1px;
  20   border-top-style: solid;
  21   border-bottom-style: solid;
  22   padding: 1px 4px;
  23   margin-top: 4px;
  24   -moz-user-select: none;
  25   word-wrap: break-word;
  26 }
  27
  28 .ruleview-rule-source:hover {
  29   text-decoration: underline;
  30 }
  31
  32 .ruleview-rule,
  33 #noResults {
  34   padding: 2px 4px;
  35 }
  36
  37 #noResults {
  38   font: message-box;
  39   color: #8050B0;
  40 }
  41
  42 .ruleview-rule + .ruleview-rule {
  43   border-top-width: 1px;
  44   border-top-style: dotted;
  45 }
  46
  47 .ruleview-warning {
  48   background: url("alerticon-warning.png");
  49   -moz-margin-start: 5px;
  50   display: inline-block;
  51   vertical-align: top;
  52   width: 13px;
  53   height: 12px;
  54 }
  55
  56 @media (min-resolution: 2dppx) {
  57   .ruleview-warning {
  58     background-image: url("alerticon-warning@2x.png");
  59   }
  60 }
  61
  62 .ruleview-ruleopen {
  63   -moz-padding-end: 5px;
  64 }
  65
  66 .ruleview-ruleclose {
  67   cursor: text;
  68   padding-right: 20px;
  69 }
  70
  71 .ruleview-propertylist {
  72   list-style: none;
  73   padding: 0;
  74   margin: 0;
  75 }
  76
  77 .ruleview-rule:not(:hover) .ruleview-enableproperty {
  78   visibility: hidden;
  79 }
  80
  81 .ruleview-expander {
  82   display: inline-block;
  83 }
  84
  85 .ruleview-newproperty {
  86   /* (enable checkbox width: 12px) + (expander width: 15px) */
  87   -moz-margin-start: 27px;
  88 }
  89
  90 .ruleview-namecontainer,
  91 .ruleview-propertycontainer,
  92 .ruleview-propertyname,
  93 .ruleview-propertyvalue {
  94   text-decoration: inherit;
  95 }
  96
  97 .ruleview-computedlist {
  98   list-style: none;
  99   padding: 0;
 100 }
 101
 102 .ruleview-computed {
 103   -moz-margin-start: 35px;
 104 }
 105
 106 .ruleview-colorswatch {
 107   border-radius: 50%;
 108   width: 1em;
 109   height: 1em;
 110   vertical-align: text-top;
 111   -moz-margin-end: 5px;
 112   display: inline-block;
 113   position: relative;
 114 }
 115
 116 .ruleview-colorswatch::before {
 117   content: '';
 118   background-color: #9C9CFF;
 119   background-image: linear-gradient(45deg, #A09090 25%, transparent 25%, transparent 75%, #A09090 75%, #A09090),
 120                     linear-gradient(45deg, #A09090 25%, transparent 25%, transparent 75%, #A09090 75%, #A09090);
 121   background-size: 12px 12px;
 122   background-position: 0 0, 6px 6px;
 123   position: absolute;
 124   border-radius: 50%;
 125   top: 0;
 126   left: 0;
 127   right: 0;
 128   bottom: 0;
 129   z-index: -1;
 130 }
 131
 132 .ruleview-overridden {
 133   text-decoration: line-through;
 134 }
 135
 136 .styleinspector-propertyeditor {
 137   border: 1px solid #A09090;
 138   padding: 0;
 139 }
 140
 141 .ruleview-property {
 142   border-left: 3px solid transparent;
 143   clear: right;
 144 }
 145
 146 .ruleview-property  > * {
 147   vertical-align: middle;
 148 }
 149
 150 .ruleview-property[dirty] {
 151   border-left-color: #9C9CFF; /* Green */
 152 }
 153
 154 .ruleview-namecontainer > .ruleview-propertyname,
 155 .ruleview-propertycontainer > .ruleview-propertyvalue {
 156   border-bottom: 1px dashed transparent;
 157 }
 158
 159 .ruleview-namecontainer:hover > .ruleview-propertyname,
 160 .ruleview-propertycontainer:hover > .ruleview-propertyvalue {
 161   border-bottom-color: #008484;
 162 }
 163
 164 .ruleview-selector {
 165   word-wrap: break-word;
 166 }
 167
 168 .ruleview-selector-separator, .ruleview-selector-unmatched {
 169   color: #8050B0;
 170 }