thepaperpilot/Super-Auto-Coots
1
0
Fork 0
mirror of https://github.com/thepaperpilot/Super-Auto-Coots.git synced 2025-02-16 09:31:40 +00:00
Code Issues Releases Activity Actions

Update frozen display

Browse source
This commit is contained in:
thepaperpilot 2023-02-23 23:24:17 -06:00
parent d7e16b6afe
commit 649b6ec1dc
3 changed files with 16 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
index.html
View file

@ -47,6 +47,7 @@
<link rel="prefetch" href="presence_small.png" />
<link rel="prefetch" href="wins_small.png" />
<link rel="prefetch" href="money_small.png" />
<link rel="prefetch" href="Freeze icon.png" />
<title>Profectus</title>
<meta name="description" content="A project made in Profectus"/>

BIN
public/Freeze icon.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 937 B

21
src/data/CharacterSlot.vue
View file

@ -71,6 +71,9 @@
<img :src="star" />
<span>{{ character?.presence }}</span>
</span>
<span class="frozen" v-if="character != null && frozen">
<img :src="lock" />
</span>
<span class="level-display" v-if="character != null">
<img :src="level1_0" v-if="character.exp === 1" />
<img :src="level1_1" v-if="character.exp === 2" />
@ -79,7 +82,6 @@
<img :src="level2_2" v-if="character.exp === 5" />
<img :src="level3" v-if="character.exp === 6" />
</span>
<div v-if="frozen" class="frozen" />
<Node v-if="id" :id="id" />
</div>
</Tooltip>
@ -94,6 +96,7 @@ import { coerceComponent } from "util/vue";
import { Component, ref, shallowRef, watch, watchEffect } from "vue";
import heart from "../../public/heart.png";
import star from "../../public/presence_v2.png";
import lock from "../../public/Freeze icon.png";
import level1_0 from "../../public/Lvl 1_0.png";
import level1_1 from "../../public/Lvl 1_1.png";
import level2_0 from "../../public/Lvl 2_0.png";
@ -290,13 +293,19 @@ watchEffect(() => {
.frozen {
position: absolute;
background: skyblue;
top: 0;
left: 0;
right: 0;
bottom: 0;
opacity: 0.5;
transform: rotate(45deg);
transform: translate(-50%, -50%);
left: 0;
}
.frozen img {
position: absolute;
z-index: -1;
width: 10vmin;
height: 10vmin;
image-rendering: pixelated;
transform: translate(-50%, -50%);
}
@keyframes bouncingMoveIndicator {