mirror of
https://github.com/thepaperpilot/Super-Auto-Coots.git
synced 2025-02-16 09:31:40 +00:00
Tooltips on stats
This commit is contained in:
parent
f4f565729c
commit
7367d34d0d
3 changed files with 27 additions and 19 deletions
|
@ -21,13 +21,6 @@
|
|||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div>
|
||||
<a href="https://forums.moddingtree.com/" target="_blank">
|
||||
<Tooltip display="Forums" :direction="Direction.Down" yoffset="5px">
|
||||
<span class="material-icons">forum</span>
|
||||
</Tooltip>
|
||||
</a>
|
||||
</div>
|
||||
<div @click="info?.open()">
|
||||
<Tooltip display="Info" :direction="Direction.Down" class="info">
|
||||
<span class="material-icons">info</span>
|
||||
|
|
|
@ -115,7 +115,7 @@
|
|||
border-width: 0.5vmin 0.5vmin 0.75vmin 3.5vmin;
|
||||
}
|
||||
|
||||
.resource-box:not(:last-child) {
|
||||
.tooltip-container:not(:last-child) > .resource-box {
|
||||
margin-right: 1vmin !important;
|
||||
}
|
||||
|
||||
|
|
|
@ -73,6 +73,7 @@ import type { AbilityTypes, BattleOutcome, Character, CharacterInfo, StreamTypes
|
|||
import victoryParticles from "./victory.json";
|
||||
import spellParticles from "./spellparticles.json";
|
||||
import Node from "components/Node.vue";
|
||||
import { Direction } from "util/common";
|
||||
|
||||
const streamTypeToBG: Record<StreamTypes, string> = {
|
||||
"Game Show": gameshow,
|
||||
|
@ -1196,8 +1197,12 @@ export const main = createLayer("main", function (this: BaseLayer) {
|
|||
<div class="stream-details" style="left: 1vmin">
|
||||
<span>{nickname.value} (YOU)</span>
|
||||
<div class="stats">
|
||||
<div class="resource-box lives">{lives.value}</div>
|
||||
<div class="resource-box wins">{wins.value}/5</div>
|
||||
<Tooltip display="Lives" direction={Direction.Down}>
|
||||
<div class="resource-box lives">{lives.value}</div>
|
||||
</Tooltip>
|
||||
<Tooltip display="Wins" direction={Direction.Down}>
|
||||
<div class="resource-box wins">{wins.value}/5</div>
|
||||
</Tooltip>
|
||||
<div class="view-counter">
|
||||
{formatWhole(views.value)} Views
|
||||
</div>
|
||||
|
@ -1256,12 +1261,16 @@ export const main = createLayer("main", function (this: BaseLayer) {
|
|||
<div class="stream-details" style="right: 1vmin">
|
||||
<span>{battle.value.enemyNickname}</span>
|
||||
<div class="stats" style="margin-right: 0">
|
||||
<div class="resource-box lives">
|
||||
{battle.value.enemyLives}
|
||||
</div>
|
||||
<div class="resource-box wins">
|
||||
{battle.value.enemyWins}/5
|
||||
</div>
|
||||
<Tooltip display="Lives" direction={Direction.Down}>
|
||||
<div class="resource-box lives">
|
||||
{battle.value.enemyLives}
|
||||
</div>
|
||||
</Tooltip>
|
||||
<Tooltip display="Wins" direction={Direction.Down}>
|
||||
<div class="resource-box wins">
|
||||
{battle.value.enemyWins}/5
|
||||
</div>
|
||||
</Tooltip>
|
||||
<div class="view-counter">
|
||||
{formatWhole(enemyViews.value)} Views
|
||||
</div>
|
||||
|
@ -1346,9 +1355,15 @@ export const main = createLayer("main", function (this: BaseLayer) {
|
|||
/>
|
||||
<h2 class="team-nickname">{nickname.value}</h2>
|
||||
<Row class="manager-header">
|
||||
<div class="resource-box moguls">{gold.value}</div>
|
||||
<div class="resource-box lives">{lives.value}</div>
|
||||
<div class="resource-box wins">{wins.value}/5</div>
|
||||
<Tooltip display="Moguls" direction={Direction.Down}>
|
||||
<div class="resource-box moguls">{gold.value}</div>
|
||||
</Tooltip>
|
||||
<Tooltip display="Lives" direction={Direction.Down}>
|
||||
<div class="resource-box lives">{lives.value}</div>
|
||||
</Tooltip>
|
||||
<Tooltip display="Wins" direction={Direction.Down}>
|
||||
<div class="resource-box wins">{wins.value}/5</div>
|
||||
</Tooltip>
|
||||
<div style="flex-grow: 1" />
|
||||
{findingMatch.value ? (
|
||||
<div class="waiting">Finding opposing team...</div>
|
||||
|
|
Loading…
Add table
Reference in a new issue