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

add node icon to full details header and use long name for subtitle

Browse Source
This commit is contained in:
liamcottle
2024-08-28 01:42:44 +12:00
parent 0238baddb3
commit 7c93945d80
1 changed files with 12 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
src/public/index.html
View File

@ -581,12 +581,17 @@
<!-- slideover header --> <!-- slideover header -->
<div class="p-2 border-b border-gray-200 shadow"> <div class="p-2 border-b border-gray-200 shadow">
<div class="flex items-start justify-between"> <div class="flex">
<div> <div class="mr-2">
<div class="flex rounded-full h-12 w-12 text-white shadow" :class="[ `bg-[${getNodeColour(selectedNode.node_id)}]` ]">
<div class="mx-auto my-auto">{{ selectedNode.short_name }}</div>
</div>
</div>
<div class="mr-auto">
<h2 class="font-bold">Node Info</h2> <h2 class="font-bold">Node Info</h2>
<h3 class="text-sm">{{ selectedNode.long_name }}</h3> <h3 class="text-sm">{{ selectedNode.long_name }}</h3>
</div> </div>
<div class="my-auto ml-3 flex h-7 items-center"> <div class="my-auto ml-2 flex h-7 items-center">
<a href="javascript:void(0)" class="rounded-full" @click="selectedNode = null"> <a href="javascript:void(0)" class="rounded-full" @click="selectedNode = null">
<div class="bg-gray-100 hover:bg-gray-200 p-2 rounded-full"> <div class="bg-gray-100 hover:bg-gray-200 p-2 rounded-full">
<svg class="w-6 h-6" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"> <svg class="w-6 h-6" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
@ -2775,6 +2780,10 @@
celsiusToFahrenheit: function(celsius) { celsiusToFahrenheit: function(celsius) {
return (celsius * 9/5) + 32; return (celsius * 9/5) + 32;
}, },
getNodeColour(nodeId) {
// convert node id to a hex colour
return "#" + (nodeId & 0x00FFFFFF).toString(16).padStart(6, '0');
},
}, },
computed: { computed: {
searchedNodes() { searchedNodes() {