refactor(ui): mobil yerleşimi iyileştir ve taşmayı düzelt

- AppLayout başlığının mobil uyumluluğunu yeniden düzenle
- İkon tabanlı butonlar kullanarak mobil alan tasarrufu sağla
- TimerPage'de taşan metinler için truncate sınıfları ekle
- Torrent bilgileri için daha iyi duyarlı düzen yapısı oluştur
This commit is contained in:
2026-01-02 21:32:00 +03:00
parent 81e9fa8783
commit 07c9589a03
2 changed files with 50 additions and 49 deletions

View File

@@ -292,34 +292,36 @@ export const TimerPage = () => {
className="rounded-lg border border-slate-200 bg-white px-3 py-2"
>
<div className="flex items-start justify-between gap-3">
<div>
<div className="min-w-0 flex-1">
<div
className="text-sm font-semibold text-slate-900"
className="truncate text-sm font-semibold text-slate-900"
title={torrent.name}
>
{torrent.name}
</div>
<div className="text-xs text-slate-500">
<div className="truncate text-xs text-slate-500">
{formatBytes(torrent.size)} {trackerLabel(torrent.tracker)}
</div>
</div>
<div className="text-right text-xs text-slate-600">
<div className="w-24 flex-shrink-0 text-right text-xs text-slate-600">
<div className="font-semibold text-slate-900">
{formatCountdown(remainingSeconds)}
</div>
<div>Kural: {formatDuration(rule.seedLimitSeconds)}</div>
</div>
</div>
<div className="mt-2 flex flex-wrap gap-2 text-xs text-slate-600">
<span>Hash: {torrent.hash.slice(0, 12)}...</span>
<span>
<div className="mt-2 grid grid-cols-2 gap-2 text-xs text-slate-600">
<div className="truncate">
Hash: {torrent.hash.slice(0, 12)}...
</div>
<div className="truncate">
Etiket:{" "}
{(torrent.tags || torrent.category || "-")
.split(",")
.map((tag) => tag.trim())
.filter(Boolean)
.join(", ") || "-"}
</span>
</div>
</div>
</div>
))}