show 2/3 logs and 1/3 graph

This commit is contained in:
gurkenhabicht 2025-06-12 23:09:24 +02:00
parent bb6bbfdffd
commit 5477f80e56
1 changed files with 37 additions and 33 deletions

View File

@ -23,10 +23,11 @@
aria-label="Toggle Theme">
<i class="bi bi-sun"></i>
</button>
<div class="container-fluid px-4 py-3 pb-5">
<div class="row g-4">
<!-- Agent List -->
<div class="col-12 col-md-6">
<div class="col-12 col-md-6 pb-4">
<!-- <h3>Agents</h3> -->
<div class="table-responsive">
<div id="agentList"
@ -38,10 +39,11 @@
</div>
<!-- Right Column: Logs and Graph -->
<div class="col-12 col-md-6 d-flex flex-column">
<!-- Logs -->
<div class="mb-3">
<!-- <h3>Logs</h3> -->
<!-- <div class="col-12 col-md-6 d-flex flex-column"> -->
<!-- Right Column: Logs and Graph -->
<div class="col-12 col-md-6 d-flex flex-column" style="height: calc(100vh - 120px);">
<!-- Logs (2/3 of height) -->
<div class="d-flex flex-column" style="flex: 2 1 0; min-height: 0;">
<form id="log-filter-form"
hx-get="/logs"
hx-target="#logs-container"
@ -62,17 +64,19 @@
<label class="btn btn-outline-primary" for="debug">Debug</label>
</div>
</form>
<div id="logs-container" class="border" style="overflow-y: auto; min-height: 240px; max-height: 320px;">
<div id="logs-container" class="border flex-grow-1" style="overflow-y: auto;">
<!-- Logs will load here -->
</div>
</div>
<!-- Graph -->
<div>
<!-- <h3>Graph</h3> -->
<div class="border" id="cyto-graph" style="min-height: 320px;"></div>
<!-- Graph (1/3 of height) -->
<div class="d-flex flex-column mt-3" style="flex: 1 1 0; min-height: 0;">
<div class="border flex-grow-1" id="cyto-graph" style="overflow-y: auto;">
<!-- Graph content -->
</div>
</div>
</div>
</div>
</div>