X-Git-Url: https://git-public.kairo.at/?a=blobdiff_plain;f=LCARStrek%2Fbrowser%2Fdevtools%2Fruleview.css;h=00ee6f91eee0f7a7d02114aebdf72b96496be193;hb=d74db93877c7a404babddcf7b0523fa2b1f6f2bf;hp=df694709e25536b55c0edf0d701a1701ee5feec3;hpb=9168a62c02f1b9fe7953f2fba5f32305980ac1a3;p=themes.git

diff --git a/LCARStrek/browser/devtools/ruleview.css b/LCARStrek/browser/devtools/ruleview.css
index df694709..00ee6f91 100644
--- a/LCARStrek/browser/devtools/ruleview.css
+++ b/LCARStrek/browser/devtools/ruleview.css
@@ -2,13 +2,19 @@
  * 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: #402800;
+}
+
 .ruleview {
   height: 100%;
 }
 
 .ruleview-rule-source {
   -moz-padding-start: 5px;
-  text-align: right;
+  text-align: end;
   float: right;
   -moz-user-select: none;
 }
@@ -44,8 +50,8 @@
 }
 
 /* User agent styles are not editable, display them differently */
-.theme-dark .ruleview-rule[uneditable=true] {
-  background: #A09090; /* Tab Toolbar */
+.ruleview-rule[uneditable=true] {
+  background: var(--theme-toolbar-background);
 }
 
 .ruleview-rule[uneditable=true] :focus {
@@ -53,7 +59,7 @@
 }
 
 .ruleview-rule[uneditable=true] .theme-link {
-  color: #336699; /* Blue - Grey */
+  color: var(--theme-text-blue);
 }
 
 .ruleview-rule[uneditable=true] .ruleview-enableproperty {
@@ -65,9 +71,9 @@
   cursor: default;
 }
 
-
 .ruleview-rule[uneditable=true] .ruleview-namecontainer > .ruleview-propertyname,
-.ruleview-rule[uneditable=true] .ruleview-propertycontainer > .ruleview-propertyvalue {
+.ruleview-rule[uneditable=true] .ruleview-propertyvaluecontainer >
+.ruleview-propertyvalue {
   border-bottom-color: transparent;
 }
 
@@ -90,7 +96,7 @@
   height: 12px;
 }
 
-@media (min-resolution: 2dppx) {
+@media (min-resolution: 1.25dppx) {
   .ruleview-warning {
     background-image: url("alerticon-warning@2x.png");
   }
@@ -125,7 +131,7 @@
 }
 
 .ruleview-namecontainer,
-.ruleview-propertycontainer,
+.ruleview-propertyvaluecontainer,
 .ruleview-propertyname,
 .ruleview-propertyvalue {
   text-decoration: inherit;
@@ -173,7 +179,7 @@
   background-size: 1em;
 }
 
-@media (min-resolution: 2dppx) {
+@media (min-resolution: 1.25dppx) {
   .ruleview-bezierswatch {
     background: url("chrome://browser/skin/devtools/cubic-bezier-swatch@2x.png");
     background-size: 1em;
@@ -194,21 +200,25 @@
   clear: right;
 }
 
-.ruleview-property  > * {
+.ruleview-propertycontainer > * {
   vertical-align: middle;
 }
 
 .ruleview-property[dirty] {
-  border-left-color: #9C9CFF; /* Green */
+  border-left-color: var(--theme-highlight-green);
+}
+
+.ruleview-highlight {
+  background-color: var(--rule-highlight-background-color);
 }
 
 .ruleview-namecontainer > .ruleview-propertyname,
-.ruleview-propertycontainer > .ruleview-propertyvalue {
+.ruleview-propertyvaluecontainer > .ruleview-propertyvalue {
   border-bottom: 1px dashed transparent;
 }
 
 .ruleview-namecontainer:hover > .ruleview-propertyname,
-.ruleview-propertycontainer:hover > .ruleview-propertyvalue {
+.ruleview-propertyvaluecontainer:hover > .ruleview-propertyvalue {
   border-bottom-color: #008484;
 }
 
@@ -219,3 +229,19 @@
 .ruleview-selector-separator, .ruleview-selector-unmatched {
   color: #8050B0;
 }
+
+.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;
+}