fix: each collapsible section is now independent — proper div structure

This commit is contained in:
Manohar 2026-05-09 04:19:38 +00:00
parent dad5f9d337
commit ea6af0ea82

View file

@ -138,9 +138,12 @@
<button class="rbtn on" onclick="loadChart(8)" id="b8">8H</button>
<button class="rbtn" onclick="loadChart(24)" id="b24">24H</button>
<button class="rbtn" onclick="loadChart(72)" id="b72">3D</button>
</div><div class="collapse-body">
</div></div>
<div class="collapse-body"><div class="chart-wrap"><canvas id="pnl-chart"></canvas><div class="chart-empty" id="chart-empty">No history yet &#8212; populates after first poll cycle</div></div>
</div>
<span class="collapse-arrow">&#9660;</span>
</div>
<div class="collapse-body">
<div class="chart-wrap"><canvas id="pnl-chart"></canvas><div class="chart-empty" id="chart-empty">No history yet &#8212; populates after first poll cycle</div></div>
</div>
</div>
<div class="card collapsible" id="sec-pos" style="margin-bottom:16px">
<div class="card-head" onclick="toggleCard('sec-pos')"><span class="card-title">Option Positions</span><div class="live-badge"><span class="ldot"></span>Live</div><span class="collapse-arrow">&#9660;</span></div>
@ -148,14 +151,14 @@
<thead><tr><th>Symbol</th><th>Qty</th><th>LTP</th><th>Avg Cost</th><th>Unrealised</th><th>Realised</th><th>Total P&amp;L</th></tr></thead>
<tbody id="pos-body"><tr><td colspan="7" style="text-align:center;padding:36px;color:var(--text3)">Loading&#8230;</td></tr></tbody>
<tfoot id="pos-foot" style="display:none"><tr><td colspan="4">Portfolio Total</td><td id="f-u" class="mono">&#8212;</td><td id="f-r" class="mono">&#8212;</td><td id="f-t" class="mono">&#8212;</td></tr></tfoot>
</table>
</table></div>
</div>
<div class="card collapsible" id="sec-alrt" style="margin-bottom:16px">
<div class="card-head" onclick="toggleCard('sec-alrt')"><span class="card-title">Alert History</span><span class="collapse-arrow">&#9660;</span></div>
<div class="collapse-body"><table>
<thead><tr><th>Symbol</th><th>P&amp;L at Alert</th><th>Anchor</th><th>Move</th><th>LTP</th><th>Time (IST)</th></tr></thead>
<tbody id="alrt-body"><tr><td colspan="6" style="text-align:center;padding:28px;color:var(--text3)">No alerts yet</td></tr></tbody>
</table>
</table></div>
</div>
<div class="card collapsible" id="sec-cfg" style="margin-bottom:16px">
<div class="card-head" onclick="toggleCard('sec-cfg')">