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

fix overflow of node info sidebar

Browse Source
This commit is contained in:
liamcottle
2024-03-14 19:56:19 +13:00
parent 957a2858a2
commit 2bb03b85f3
1 changed files with 157 additions and 153 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
src/public/index.html
View File

@ -273,7 +273,7 @@
leave-to-class="-translate-x-full"> leave-to-class="-translate-x-full">
<div v-show="selectedNode != null" class="fixed top-0 left-0 bottom-0"> <div v-show="selectedNode != null" class="fixed top-0 left-0 bottom-0">
<div v-if="selectedNode != null" class="w-screen max-w-md overflow-hidden"> <div v-if="selectedNode != null" class="w-screen max-w-md overflow-hidden">
<div class="flex h-full flex-col overflow-y-scroll bg-white shadow-xl"> <div class="flex h-full flex-col bg-white shadow-xl">
<!-- slideover header --> <!-- slideover header -->
<div class="p-2 border-b border-gray-200 shadow"> <div class="p-2 border-b border-gray-200 shadow">
@ -296,6 +296,8 @@
</div> </div>
</div> </div>
<div class="overflow-y-auto">
<div class="flex flex-col my-2"> <div class="flex flex-col my-2">
<div class="mx-auto"> <div class="mx-auto">
<img class="h-48 w-48 rounded object-contain" :src="`/images/devices/${selectedNode.hardware_model_name}.png`" alt="" onerror="if(this.src != 'https://placehold.co/512x512?text=No+Image') this.src = 'https://placehold.co/512x512?text=No+Image';"> <img class="h-48 w-48 rounded object-contain" :src="`/images/devices/${selectedNode.hardware_model_name}.png`" alt="" onerror="if(this.src != 'https://placehold.co/512x512?text=No+Image') this.src = 'https://placehold.co/512x512?text=No+Image';">
@ -305,7 +307,7 @@
<!-- details --> <!-- details -->
<div> <div>
<div class="bg-gray-200 p-2 font-semibold">Details</div> <div class="bg-gray-200 p-2 font-semibold">Details</div>
<ul role="list" class="flex-1 divide-y divide-gray-200 overflow-y-auto"> <ul role="list" class="flex-1 divide-y divide-gray-200">
<li> <li>
<div class="relative flex items-center"> <div class="relative flex items-center">
@ -365,7 +367,7 @@
<!-- telemetry --> <!-- telemetry -->
<div> <div>
<div class="bg-gray-200 p-2 font-semibold">Telemetry</div> <div class="bg-gray-200 p-2 font-semibold">Telemetry</div>
<ul role="list" class="flex-1 divide-y divide-gray-200 overflow-y-auto"> <ul role="list" class="flex-1 divide-y divide-gray-200">
<li> <li>
<div class="relative flex items-center"> <div class="relative flex items-center">
@ -452,7 +454,7 @@
<!-- other --> <!-- other -->
<div> <div>
<div class="bg-gray-200 p-2 font-semibold">Other</div> <div class="bg-gray-200 p-2 font-semibold">Other</div>
<ul role="list" class="flex-1 divide-y divide-gray-200 overflow-y-auto"> <ul role="list" class="flex-1 divide-y divide-gray-200">
<li> <li>
<div class="relative flex items-center"> <div class="relative flex items-center">
@ -510,6 +512,8 @@
</div> </div>
</div> </div>
</div>
</div> </div>
</div> </div>
</transition> </transition>