Add visual online/offline status dot indicator for Rapidgator links

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Sucukdeluxe
2026-03-04 00:23:20 +01:00
co-authored by Claude Opus 4.6
parent 662c903bf3
commit 5574b50d20
5 changed files with 39 additions and 5 deletions
+4 -1
View File
@@ -3029,7 +3029,10 @@ const PackageCard = memo(function PackageCard({ pkg, items, packageSpeed, isFirs
</div>
{!collapsed && items.map((item) => (
<div key={item.id} className={`item-row${selectedIds.has(item.id) ? " item-selected" : ""}`} onClick={(e) => { e.stopPropagation(); onSelect(item.id, e.ctrlKey); }} onMouseDown={(e) => { e.stopPropagation(); onSelectMouseDown(item.id, e); }} onMouseEnter={() => onSelectMouseEnter(item.id)} onContextMenu={(e) => { e.preventDefault(); e.stopPropagation(); onContextMenu(pkg.id, item.id, e.clientX, e.clientY); }}>
<span className="pkg-col pkg-col-name item-indent" title={item.fileName}>{item.fileName}</span>
<span className="pkg-col pkg-col-name item-indent" title={item.fileName}>
{item.onlineStatus && <span className={`link-status-dot ${item.onlineStatus}`} title={item.onlineStatus === "online" ? "Online" : item.onlineStatus === "offline" ? "Offline" : "Wird geprüft..."} />}
{item.fileName}
</span>
<span className="pkg-col pkg-col-size">{(() => {
const total = item.totalBytes || item.downloadedBytes || 0;
const dl = item.downloadedBytes || 0;
+27
View File
@@ -1315,6 +1315,33 @@ td {
padding-left: 32px;
}
.link-status-dot {
display: inline-block;
width: 8px;
height: 8px;
border-radius: 50%;
margin-right: 6px;
flex-shrink: 0;
vertical-align: middle;
}
.link-status-dot.online {
background: #22c55e;
box-shadow: 0 0 4px #22c55e80;
}
.link-status-dot.offline {
background: #ef4444;
box-shadow: 0 0 4px #ef444480;
}
.link-status-dot.checking {
background: #f59e0b;
box-shadow: 0 0 4px #f59e0b80;
animation: pulse-dot 1s ease-in-out infinite;
}
@keyframes pulse-dot {
0%, 100% { opacity: 1; }
50% { opacity: 0.4; }
}
.item-remove {
background: none;
border: none;