X-Git-Url: https://git-public.kairo.at/?p=themes.git;a=blobdiff_plain;f=LCARStrek%2Fbrowser%2Fdevtools%2Fanimationinspector.css;h=6cc0bdbdb17e7e169f2747050253c3e8dd70936b;hp=dd24562f2c447a6ffcc628ffe18a2ec165f00adf;hb=d74db93877c7a404babddcf7b0523fa2b1f6f2bf;hpb=a5cb6e534c9872ab3dc646ab44fa35b61775537d

diff --git a/LCARStrek/browser/devtools/animationinspector.css b/LCARStrek/browser/devtools/animationinspector.css
index dd24562f..6cc0bdbd 100644
--- a/LCARStrek/browser/devtools/animationinspector.css
+++ b/LCARStrek/browser/devtools/animationinspector.css
@@ -84,7 +84,7 @@ body {
   background-image: url("debugger-play.png");
 }
 
-@media (min-resolution: 2dppx) {
+@media (min-resolution: 1.25dppx) {
   #element-picker::before {
     background-image: url("chrome://browser/skin/devtools/command-pick@2x.png");
     background-size: 64px;
@@ -99,6 +99,36 @@ body {
   }
 }
 
+/* Animation target node gutter, contains a preview of the dom node */
+
+.animation-target {
+  background-color: var(--theme-toolbar-background);
+  padding: 1px 4px;
+  box-sizing: border-box;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.animation-target .attribute-name {
+  padding-left: 4px;
+}
+
+.animation-target .node-selector {
+  background: url("chrome://browser/skin/devtools/vview-open-inspector.png") no-repeat 0 0;
+  padding-left: 16px;
+  margin-right: 5px;
+  cursor: pointer;
+}
+
+.animation-target .node-selector:hover {
+  background-position: -32px 0;
+}
+
+.animation-target .node-selector:active {
+  background-position: -16px 0;
+}
+
 /* Animation title gutter, contains the name, duration, iteration */
 
 .animation-title {
@@ -156,7 +186,7 @@ body {
   background-image: url(rewind.png);
 }
 
-@media (min-resolution: 2dppx) {
+@media (min-resolution: 1.25dppx) {
   .timeline .toggle::before {
     background-image: url(debugger-pause@2x.png);
   }