changed transition of .action-menu and .damage-monitor elements from sliding to fading

This commit is contained in:
Tobias 2023-08-29 21:13:42 +02:00
parent 5977740c43
commit 5158ce2486

View File

@ -1,10 +1,10 @@
$fg: deeppink;
$fg-bright: lightpink;
$fg: deeppink; // #ff1493
$fg-bright: lightpink; // #ffb6c1
$fg-dark: #b3005f;
$bg: cyan;
$bg-bright: lightcyan;
$bg-dark: darkcyan;
$bg: cyan; // #00ffff
$bg-bright: lightcyan; // #e0ffff
$bg-dark: darkcyan; // #008b8b
@font-face {
font-family: "Electrolize";
@ -260,7 +260,10 @@ header.navbar {
}
.damage-dropdown,
.actions-dropdown { display: inline-block; }
.actions-dropdown {
display: inline-block;
position: relative;
}
.damage-monitor,
.actions-menu {
@ -272,16 +275,28 @@ header.navbar {
padding-top: 10px;
padding-bottom: 10px;
position: absolute;
top: calc(100% - 2px);
transition: transform .25s ease-in-out;
// top: calc(100% - 2px);
// transition: transform .25s ease-in-out;
z-index: 200;
right: 50%;
transform: translateX(50%);
opacity: 0%;
transition: opacity .2s ease-in-out, visibility .2s;
visibility: hidden;
}
.damage-monitor { left: calc(100vw - 1em); }
//.damage-monitor { left: calc(100vw - 1em); }
.actions-menu { left: calc(100vw + 3.5em); }
//.actions-menu { left: calc(100vw + 3.5em); }
.seen { transform: translateX(-100vw); }
//.seen { transform: translateX(-100vw); }
.seen {
visibility: visible;
opacity: 100%;
}
.damage-monitor {
button {