ctmesh/map
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix background colors in traceroute window
Some checks failed
Build Docker containers / Build (push) Failing after 10s
Details

Browse Source
This commit is contained in:
Matt
2025-04-16 00:43:50 -04:00
parent 8497053aed
commit 6b7149905a
1 changed files with 4 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
webapp/frontend/src/components/TracerouteInfo.vue
View File

@ -64,7 +64,7 @@ import { getNodeColor, getNodeTextColor, findNodeById, findNodeMarkerById } from
</div> </div>
<div class="my-auto relative flex flex-none items-center justify-center"> <div class="my-auto relative flex flex-none items-center justify-center">
<div> <div>
<div class="flex rounded-full h-12 w-12 text-white shadow-sm" :class="[ `bg-[${getNodeColor(state.selectedTraceRoute.to)}]`, `text-[${getNodeTextColor(state.selectedTraceRoute.to)}]` ]"> <div class="flex rounded-full h-12 w-12 text-white shadow-sm" :style="{backgroundColor: getNodeColor(state.selectedTraceRoute.to)}" :class="[ `text-[${getNodeTextColor(state.selectedTraceRoute.to)}]` ]">
<div class="mx-auto my-auto drop-shadow-sm">{{ findNodeById(state.selectedTraceRoute.to)?.short_name ?? "?" }}</div> <div class="mx-auto my-auto drop-shadow-sm">{{ findNodeById(state.selectedTraceRoute.to)?.short_name ?? "?" }}</div>
</div> </div>
</div> </div>
@ -83,7 +83,7 @@ import { getNodeColor, getNodeTextColor, findNodeById, findNodeMarkerById } from
</div> </div>
<div class="my-auto relative flex flex-none items-center justify-center"> <div class="my-auto relative flex flex-none items-center justify-center">
<div> <div>
<div class="flex rounded-full h-12 w-12 text-white shadow" :class="[ `bg-[${getNodeColor(route)}]`, `text-[${getNodeTextColor(route)}]` ]"> <div class="flex rounded-full h-12 w-12 text-white shadow" :style="{backgroundColor: getNodeColor(route))}" :class="[ `text-[${getNodeTextColor(route)}]` ]">
<div class="mx-auto my-auto drop-shadow-sm">{{ findNodeById(route)?.short_name ?? "?" }}</div> <div class="mx-auto my-auto drop-shadow-sm">{{ findNodeById(route)?.short_name ?? "?" }}</div>
</div> </div>
</div> </div>
@ -102,7 +102,7 @@ import { getNodeColor, getNodeTextColor, findNodeById, findNodeMarkerById } from
</div> </div>
<div class="my-auto relative flex flex-none items-center justify-center"> <div class="my-auto relative flex flex-none items-center justify-center">
<div> <div>
<div class="flex rounded-full h-12 w-12 text-white shadow" :class="[ `bg-[${getNodeColor(state.selectedTraceRoute.from)}]`, `text-[${getNodeTextColor(state.selectedTraceRoute.from)}]` ]"> <div class="flex rounded-full h-12 w-12 text-white shadow" :style="{backgroundColor: getNodeColor(state.selectedTraceRoute.from)}" :class="[ `text-[${getNodeTextColor(state.selectedTraceRoute.from)}]` ]">
<div class="mx-auto my-auto drop-shadow-sm">{{ findNodeById(state.selectedTraceRoute.from)?.short_name ?? "?" }}</div> <div class="mx-auto my-auto drop-shadow-sm">{{ findNodeById(state.selectedTraceRoute.from)?.short_name ?? "?" }}</div>
</div> </div>
</div> </div>
@ -121,7 +121,7 @@ import { getNodeColor, getNodeTextColor, findNodeById, findNodeMarkerById } from
</div> </div>
<div class="my-auto relative flex flex-none items-center justify-center"> <div class="my-auto relative flex flex-none items-center justify-center">
<div> <div>
<div class="flex rounded-full h-12 w-12 text-white shadow" :class="[ `bg-[${getNodeColor(state.selectedTraceRoute.gateway_id)}]`, `text-[${getNodeTextColor(state.selectedTraceRoute.gateway_id)}]` ]"> <div class="flex rounded-full h-12 w-12 text-white shadow" :style="{backgroundColor: getNodeColor(state.selectedTraceRoute.gateway_id)}" :class="[ `text-[${getNodeTextColor(state.selectedTraceRoute.gateway_id)}]` ]">
<div class="mx-auto my-auto drop-shadow-sm">{{ findNodeById(state.selectedTraceRoute.gateway_id)?.short_name ?? "?" }}</div> <div class="mx-auto my-auto drop-shadow-sm">{{ findNodeById(state.selectedTraceRoute.gateway_id)?.short_name ?? "?" }}</div>
</div> </div>
</div> </div>