diff --git a/src/renderer-queue.ts b/src/renderer-queue.ts index d25fcb1..7bc23b7 100644 --- a/src/renderer-queue.ts +++ b/src/renderer-queue.ts @@ -185,12 +185,12 @@ function showQueueContextMenu(x: number, y: number, item: QueueItem): void { closeQueueContextMenu(); const menu = document.createElement('div'); - menu.className = 'queue-context-menu'; + menu.className = 'context-menu'; const makeItem = (label: string, onClick: () => void, disabled = false): HTMLElement => { const el = document.createElement('div'); el.textContent = label; - el.className = 'queue-context-menu-item' + (disabled ? ' disabled' : ''); + el.className = 'context-menu-item' + (disabled ? ' disabled' : ''); if (!disabled) { el.addEventListener('click', () => { try { onClick(); } finally { closeQueueContextMenu(); } @@ -201,7 +201,7 @@ function showQueueContextMenu(x: number, y: number, item: QueueItem): void { const makeSeparator = (): HTMLElement => { const sep = document.createElement('div'); - sep.className = 'queue-context-menu-separator'; + sep.className = 'context-menu-separator'; return sep; }; diff --git a/src/renderer-streamers.ts b/src/renderer-streamers.ts index f7ec521..1bcaa18 100644 --- a/src/renderer-streamers.ts +++ b/src/renderer-streamers.ts @@ -924,15 +924,7 @@ function showVodContextMenu(x: number, y: number, ctx: VodCardContext): void { closeVodContextMenu(); const menu = document.createElement('div'); - menu.className = 'vod-context-menu'; - menu.style.position = 'fixed'; - menu.style.zIndex = '9999'; - menu.style.background = 'var(--bg-card)'; - menu.style.border = '1px solid var(--border-soft)'; - menu.style.borderRadius = '6px'; - menu.style.boxShadow = '0 4px 12px rgba(0,0,0,0.4)'; - menu.style.padding = '4px'; - menu.style.minWidth = '200px'; + menu.className = 'context-menu'; const downloadedIds = new Set( Array.isArray(config.downloaded_vod_ids) @@ -944,13 +936,7 @@ function showVodContextMenu(x: number, y: number, ctx: VodCardContext): void { const makeItem = (label: string, onClick: () => void): HTMLElement => { const el = document.createElement('div'); el.textContent = label; - el.style.padding = '8px 12px'; - el.style.cursor = 'pointer'; - el.style.fontSize = '13px'; - el.style.color = 'var(--text)'; - el.style.borderRadius = '4px'; - el.addEventListener('mouseenter', () => { el.style.background = 'rgba(145,70,255,0.15)'; }); - el.addEventListener('mouseleave', () => { el.style.background = 'transparent'; }); + el.className = 'context-menu-item'; el.addEventListener('click', () => { try { onClick(); } finally { closeVodContextMenu(); } }); diff --git a/src/styles.css b/src/styles.css index 955e490..4bd1299 100644 --- a/src/styles.css +++ b/src/styles.css @@ -4411,11 +4411,12 @@ input[type="number"]::-webkit-outer-spin-button { } /* ============================================ - QUEUE CONTEXT MENU — right-click on a queue row + CONTEXT MENU — generic right-click menu base ============================================ - Previously every property was inline-styled in renderer-queue.ts. - left/top stay inline (set per-click); everything else lives here. */ -.queue-context-menu { + Used by both the queue row context menu (renderer-queue.ts) and the + VOD card context menu (renderer-streamers.ts). left/top stay inline + on the container (set per-click); everything else lives here. */ +.context-menu { position: fixed; z-index: 9999; background: var(--bg-card); @@ -4426,7 +4427,7 @@ input[type="number"]::-webkit-outer-spin-button { min-width: 200px; } -.queue-context-menu-item { +.context-menu-item { padding: 8px 12px; cursor: pointer; font-size: 13px; @@ -4435,17 +4436,17 @@ input[type="number"]::-webkit-outer-spin-button { transition: background 0.12s; } -.queue-context-menu-item:hover:not(.disabled) { +.context-menu-item:hover:not(.disabled) { background: rgba(145, 70, 255, 0.15); } -.queue-context-menu-item.disabled { +.context-menu-item.disabled { color: var(--text-secondary); opacity: 0.55; cursor: not-allowed; } -.queue-context-menu-separator { +.context-menu-separator { height: 1px; margin: 4px 6px; background: var(--border-soft);