thepaperpilot/Planar-Pioneers
1
0
Fork 0
mirror of https://github.com/thepaperpilot/Planar-Pioneers.git synced 2024-11-22 00:21:31 +00:00
Code Issues Releases Activity Actions

Add influences display to planes

Browse source
This commit is contained in:
thepaperpilot 2023-04-30 16:05:57 -05:00
parent d3520ed9a2
commit 5dabc5826c
2 changed files with 27 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
src/data/main.css
View file

@ -8,12 +8,16 @@
width: 100%;
}
.nav-segment {
.nav-segment:not(:last-child) {
border-right: solid 1px var(--outline);
padding-right: 10px;
margin-right: 10px;
}
.nav-segment .tooltip-container {
display: inline;
}
.affected-node {
filter: drop-shadow(0px 0px 20px var(--accent1));
}

23
src/data/planes.tsx
View file

@ -39,6 +39,7 @@ import {
import type { ResourceState, Resources, PortalState } from "./projEntry";
import { getColor, getName, sfc32 } from "./utils";
import { useToast } from "vue-toastification";
import TooltipVue from "features/tooltips/Tooltip.vue";
const toast = useToast();
@ -624,13 +625,33 @@ export function createPlane(
showNotif,
display: jsx(() => (
<>
<StickyVue class="nav-container">
<StickyVue class="nav-container" style="z-index: 5">
<span class="nav-segment">
<h2>{name}</h2>
</span>
<span class="nav-segment">
<h3>{tier}-tier</h3>
</span>
{influences.length === 0 ? null : (
<span class="nav-segment">
<TooltipVue
display={influences
.map(influence => {
const description =
influenceTypes[influence.type].description;
if (typeof description === "function") {
return description(influence);
}
return description;
})
.join("<br/>")}
direction={Direction.Down}
style={"width: 300px"}
>
<h3>{influences.length} influences</h3>
</TooltipVue>
</span>
)}
<span class="nav-segment">
<button
class="button"