X-Git-Url: https://git-public.kairo.at/?p=themes.git;a=blobdiff_plain;f=LCARStrek%2Fbrowser%2Fcustomizableui%2FpanelUIOverlay.css;h=47670532ada4c1ccc0e5b6fae2f2934bffe781fa;hp=199a6a74e0517f7d73db642ea4d9ba36b1db1241;hb=b1db19fed8bd91ff36a19724e9c7dc7545f70f9e;hpb=d0e580f1de074380b155cbc73ef4ee2c04db6be9

diff --git a/LCARStrek/browser/customizableui/panelUIOverlay.css b/LCARStrek/browser/customizableui/panelUIOverlay.css
index 199a6a74..47670532 100644
--- a/LCARStrek/browser/customizableui/panelUIOverlay.css
+++ b/LCARStrek/browser/customizableui/panelUIOverlay.css
@@ -15,13 +15,26 @@
   width: 64px;
   height: 64px;
   position: absolute;
-  animation: moveX 3.05s linear 0s infinite alternate,
-             moveY 3.4s linear 0s infinite alternate;
+  transition: transform 1s ease-out;
+  animation: whimsyMoveX 3.05s linear 0s infinite alternate,
+             whimsyMoveY 3.4s linear 0s infinite alternate;
+}
+
+#PanelUI-popup #PanelUI-contents:active:empty::before {
+  animation: whimsyMoveX 3.05s linear 0s infinite alternate,
+             whimsyMoveY 3.4s linear 0s infinite alternate,
+             whimsyRotate 1s linear 0s infinite normal;
 }
 
 #PanelUI-popup #PanelUI-contents:-moz-locale-dir(rtl):empty::before {
-  animation: moveXRTL 3.05s linear 0s infinite alternate,
-             moveY 3.4s linear 0s infinite alternate;
+  animation: whimsyMoveXRTL 3.05s linear 0s infinite alternate,
+             whimsyMoveY 3.4s linear 0s infinite alternate;
+}
+
+#PanelUI-popup #PanelUI-contents:-moz-locale-dir(rtl):active:empty::before {
+  animation: whimsyMoveXRTL 3.05s linear 0s infinite alternate,
+             whimsyMoveY 3.4s linear 0s infinite alternate,
+             whimsyRotate 1s linear 0s infinite normal;
 }
 
 #PanelUI-popup #PanelUI-contents:empty:hover::before {
@@ -38,19 +51,25 @@
   }
 }
 
-@keyframes moveX {
+@keyframes whimsyMoveX {
   /* These values are adjusted for the padding on the panel. */
   from { margin-left: -9px; } to { margin-left: calc(100% - 55px); }
 }
-@keyframes moveXRTL {
+
+@keyframes whimsyMoveXRTL {
   /* These values are adjusted for the padding on the panel. */
   from { margin-right: -9px; } to { margin-right: calc(100% - 55px); }
 }
-@keyframes moveY {
+
+@keyframes whimsyMoveY {
   /* These values are adjusted for the padding and height of the panel. */
   from { margin-top: -.5em; } to { margin-top: calc(64px - .5em); }
 }
 
+@keyframes whimsyRotate {
+  to { transform: perspective(5000px) rotateY(360deg); }
+}
+
 #customization-panelHolder {
   border-radius: 4px;
 }