mirrors/termscp
1
0
Fork 0
mirror of https://github.com/veeso/termscp.git synced 2026-06-13 03:59:37 +02:00
Code Issues Packages Projects Releases Wiki Activity

fix(site): hero selected-row contrast (latte) + mobile row truncation

Browse Source
This commit is contained in:
Christian Visintin
2026-06-07 22:04:25 +02:00
parent 0cc7362bd9
commit 2153164484
1 changed files with 7 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
site/src/components/ExplorerHero.astro
View File

@@ -30,24 +30,25 @@ const remote = [
<div>
<div class="border-b border-line bg-mantle px-3 py-1.5 text-xs text-teal">{t("hero.local")}</div>
{local.map((r) => (
<div class={`flex justify-between px-3 py-0.5 text-sm ${r.kind === "dir" ? "text-blue" : "text-text"}`}>
<span>{r.name}</span><span class="text-overlay">{r.size}</span>
<div class={`flex justify-between gap-2 px-3 py-0.5 text-sm ${r.kind === "dir" ? "text-blue" : "text-text"}`}>
<span class="truncate min-w-0">{r.name}</span><span class="text-overlay shrink-0">{r.size}</span>
</div>
))}
</div>
<div class="border-l border-line">
<div class="border-b border-line bg-mantle px-3 py-1.5 text-xs text-mauve">{t("hero.remote")}</div>
{remote.map((r) => (
<div class={`flex justify-between px-3 py-0.5 text-sm ${
r.kind === "sel" ? "bg-blue text-crust font-bold" : r.kind === "dir" ? "text-blue" : "text-text"
<div class={`flex justify-between gap-2 px-3 py-0.5 text-sm ${
r.kind === "sel" ? "bg-blue text-base font-bold" : r.kind === "dir" ? "text-blue" : "text-text"
}`}>
<span>{r.name}</span>
<span class={r.kind === "sel" ? "text-crust" : "text-overlay"}>{r.size}</span>
<span class="truncate min-w-0">{r.name}</span>
<span class={`shrink-0 ${r.kind === "sel" ? "text-base" : "text-overlay"}`}>{r.size}</span>
</div>
))}
</div>
</div>
<div class="flex justify-between border-t border-line bg-crust px-3 py-1.5 text-xs text-overlay">
{/* set:html is safe: hero.status is author-controlled i18n content, never user input. Do not interpolate untrusted data here. */}
<span set:html={t("hero.status").replace(/(↹|↑↓|↵|SPACE)/g, '<span class="text-yellow">$1</span>')}></span>
<span>4 files · 1.2 GB</span>
</div>