mirror of
https://github.com/thepaperpilot/Super-Auto-Coots.git
synced 2024-11-22 00:21:33 +00:00
Minor graphic tweaks
This commit is contained in:
parent
11a877484e
commit
b4a62b3b20
2 changed files with 13 additions and 5 deletions
|
@ -220,7 +220,7 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
.waiting {
|
.waiting {
|
||||||
font-size: 4vmin;
|
font-size: 2vmin;
|
||||||
height: 8vmin;
|
height: 8vmin;
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
|
@ -260,6 +260,7 @@
|
||||||
background: var(--background);
|
background: var(--background);
|
||||||
filter: drop-shadow(2px 4px 6px black);
|
filter: drop-shadow(2px 4px 6px black);
|
||||||
text-shadow: -1px 1px 0 var(--raised-background), 1px 1px 0 var(--raised-background), 1px -1px 0 var(--raised-background), -1px -1px 0 var(--raised-background);
|
text-shadow: -1px 1px 0 var(--raised-background), 1px 1px 0 var(--raised-background), 1px -1px 0 var(--raised-background), -1px -1px 0 var(--raised-background);
|
||||||
|
z-index: 1;
|
||||||
}
|
}
|
||||||
|
|
||||||
.stream-details {
|
.stream-details {
|
||||||
|
@ -338,12 +339,19 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
.character-transition-enter-from {
|
.character-transition-enter-from {
|
||||||
transform: translateY(100%);
|
transform: translateX(-100%);
|
||||||
}
|
}
|
||||||
.character-transition-leave-to {
|
.character-transition-leave-to {
|
||||||
|
transform: translateX(100%);
|
||||||
|
}
|
||||||
|
.streamer-transition-enter-from {
|
||||||
|
transform: translateY(100%);
|
||||||
|
}
|
||||||
|
.streamer-transition-leave-to {
|
||||||
transform: translateY(-100%);
|
transform: translateY(-100%);
|
||||||
}
|
}
|
||||||
.character-trensition-active {
|
.character-trensition-active,
|
||||||
|
.streamer-transition-active {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -995,7 +995,7 @@ export const main = createLayer("main", function (this: BaseLayer) {
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<Row class="streamers-container">
|
<Row class="streamers-container">
|
||||||
<TransitionGroup name="character-transition">
|
<TransitionGroup name="streamer-transition">
|
||||||
{battle.value.streamers
|
{battle.value.streamers
|
||||||
.slice()
|
.slice()
|
||||||
.reverse()
|
.reverse()
|
||||||
|
@ -1056,7 +1056,7 @@ export const main = createLayer("main", function (this: BaseLayer) {
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<Row class="streamers-container">
|
<Row class="streamers-container">
|
||||||
<TransitionGroup name="character-transition">
|
<TransitionGroup name="streamer-transition">
|
||||||
{battle.value.enemyStreamers.map((streamer, i) => (
|
{battle.value.enemyStreamers.map((streamer, i) => (
|
||||||
<CharacterSlot
|
<CharacterSlot
|
||||||
key={i}
|
key={i}
|
||||||
|
|
Loading…
Reference in a new issue