Move drive capacity to top row of drive card

This commit is contained in:
Josh Holtrop 2026-04-13 22:04:27 -04:00
parent 23d7e79605
commit a282debfbd
2 changed files with 17 additions and 2 deletions

View File

@ -292,6 +292,22 @@
.subitem-value.warn { color: #fbbf24; } .subitem-value.warn { color: #fbbf24; }
.subitem-value.bad { color: #f87171; } .subitem-value.bad { color: #f87171; }
/* drive capacity chip (shown inline in card title) */
.card-capacity {
display: inline-block;
font-size: 0.7rem;
font-weight: 600;
color: #cbd5e1;
background: #0f1117;
border: 1px solid #1e2433;
padding: 0.1rem 0.4rem;
border-radius: 4px;
margin-left: 0.4rem;
text-transform: none;
letter-spacing: 0;
font-variant-numeric: tabular-nums;
}
/* drive type badge */ /* drive type badge */
.drive-type { .drive-type {
font-size: 0.6rem; font-size: 0.6rem;

View File

@ -171,9 +171,8 @@ if cgi.params.key?("content")
html << <<~HTML html << <<~HTML
<div class="card #{card_cls} span-2"> <div class="card #{card_cls} span-2">
<div class="card-header"> <div class="card-header">
<span class="card-title">#{title} <span class="drive-type #{dt}">#{dt.upcase}</span></span> <span class="card-title">#{title} <span class="card-capacity">#{capacity}</span> <span class="drive-type #{dt}">#{dt.upcase}</span></span>
</div> </div>
<div class="card-sub">#{capacity}</div>
#{stats_block} #{stats_block}
</div> </div>
HTML HTML