diff --git a/src/css/main.css b/src/css/main.css index 33f0f3f..419569d 100644 --- a/src/css/main.css +++ b/src/css/main.css @@ -562,12 +562,13 @@ html, body { body.compact .bm-item { padding: var(--spacing-compact) 10px; } -.bm-favicon { width: 14px; height: 14px; flex-shrink: 0; border-radius: 2px; opacity: 0.85; } -.bm-favicon-fallback { - width: 14px; height: 14px; flex-shrink: 0; - background: var(--accent-dim); border-radius: 2px; +.bm-favicon-local { + width: 16px; height: 16px; flex-shrink: 0; + border-radius: 3px; display: flex; align-items: center; justify-content: center; - font-size: 8px; color: var(--accent); + font-size: 9px; font-weight: 600; + color: #fff; + line-height: 1; } .bm-text { flex: 1; min-width: 0; } .bm-title { font-size: 12px; font-weight: 400; color: var(--text-primary); line-height: 1.3; } diff --git a/src/js/boards.js b/src/js/boards.js index 7e7d5fc..44aaa82 100644 --- a/src/js/boards.js +++ b/src/js/boards.js @@ -215,19 +215,11 @@ function createBmEl(bm) { li.dataset.bmUrl = bm.url; li.draggable = true; - const favicon = document.createElement('img'); - favicon.className = 'bm-favicon'; - favicon.width = 14; - favicon.height = 14; - favicon.src = getFaviconUrl(bm.url); - favicon.addEventListener('error', function() { - this.classList.add('hidden'); - this.nextElementSibling.classList.remove('hidden'); - }); - - const fallback = document.createElement('div'); - fallback.className = 'bm-favicon-fallback hidden'; - fallback.textContent = bm.title.charAt(0).toUpperCase(); + const favicon = document.createElement('div'); + favicon.className = 'bm-favicon-local'; + favicon.textContent = bm.title.charAt(0).toUpperCase(); + const hue = (bm.title.charCodeAt(0) * 137) % 360; + favicon.style.backgroundColor = `hsl(${hue}, 45%, 35%)`; const textDiv = document.createElement('div'); textDiv.className = 'bm-text'; @@ -247,7 +239,6 @@ function createBmEl(bm) { deleteBtn.textContent = '✕'; li.appendChild(favicon); - li.appendChild(fallback); li.appendChild(textDiv); li.appendChild(deleteBtn); diff --git a/src/js/state.js b/src/js/state.js index d387e47..d2db23e 100644 --- a/src/js/state.js +++ b/src/js/state.js @@ -33,15 +33,6 @@ function escHtml(str) { .replace(/"/g, '"'); } -function getFaviconUrl(url) { - try { - const u = new URL(url); - return `https://www.google.com/s2/favicons?domain=${u.hostname}&sz=16`; - } catch { - return ''; - } -} - function getDefaultBoards() { return [ {