From 4932b2099176d185ad3a39e0257212c0bf395615 Mon Sep 17 00:00:00 2001 From: Daniel Dada Date: Wed, 11 Feb 2026 11:38:35 +0300 Subject: [PATCH] fixed layout in "on page" section --- _locales/de/messages.json | 4 +-- _locales/en/messages.json | 4 +-- _locales/es/messages.json | 8 +++--- _locales/fr/messages.json | 4 +-- _locales/hi/messages.json | 2 +- _locales/it/messages.json | 4 +-- _locales/ja/messages.json | 2 +- _locales/ko/messages.json | 4 +-- _locales/nl/messages.json | 4 +-- _locales/pl/messages.json | 4 +-- _locales/pt_BR/messages.json | 4 +-- _locales/ru/messages.json | 2 +- _locales/tr/messages.json | 4 +-- _locales/zh_CN/messages.json | 4 +-- popup/popup.css | 44 +++++++++++++++++++++++++++++ popup/popup.html | 5 +++- src/popup/PopupController.ts | 55 ++++++++++++++++++++++++++++++++++-- 17 files changed, 127 insertions(+), 31 deletions(-) diff --git a/_locales/de/messages.json b/_locales/de/messages.json index efcf5b9..cff6fc0 100644 --- a/_locales/de/messages.json +++ b/_locales/de/messages.json @@ -36,7 +36,7 @@ "message": "Wörter hinzufügen" }, "select_all": { - "message": "Auswählen" + "message": "Alle auswählen" }, "delete_selected": { "message": "Ausgewählte löschen" @@ -78,7 +78,7 @@ "message": "Möchten Sie die ausgewählten Wörter wirklich löschen?" }, "deselect_all": { - "message": "Abwählen" + "message": "Alle abwählen" }, "highlight_lists": { "message": "Hervorhebungslisten" diff --git a/_locales/en/messages.json b/_locales/en/messages.json index 9e563a1..0d7a5c9 100644 --- a/_locales/en/messages.json +++ b/_locales/en/messages.json @@ -36,7 +36,7 @@ "message": "Add Words" }, "select_all": { - "message": "Select" + "message": "Select all" }, "delete_selected": { "message": "Delete selected" @@ -78,7 +78,7 @@ "message": "Are you sure you want to delete the selected words?" }, "deselect_all": { - "message": "Deselect" + "message": "Deselect all" }, "highlight_lists": { "message": "Highlight Lists" diff --git a/_locales/es/messages.json b/_locales/es/messages.json index c86c2bf..2c004cb 100644 --- a/_locales/es/messages.json +++ b/_locales/es/messages.json @@ -35,8 +35,8 @@ "apply_paste": { "message": "Agregar palabras" }, - "select_all": { - "message": "Seleccionar" +"select_all": { + "message": "Seleccionar todo" }, "delete_selected": { "message": "Eliminar seleccionados" @@ -77,8 +77,8 @@ "confirm_delete_words": { "message": "¿Estás seguro de que deseas eliminar las palabras seleccionadas?" }, - "deselect_all": { - "message": "Deseleccionar" +"deselect_all": { + "message": "Deseleccionar todo" }, "highlight_lists": { "message": "Listas de resaltado" diff --git a/_locales/fr/messages.json b/_locales/fr/messages.json index eec0a70..c331546 100644 --- a/_locales/fr/messages.json +++ b/_locales/fr/messages.json @@ -36,7 +36,7 @@ "message": "Ajouter des mots" }, "select_all": { - "message": "Sélectionner" + "message": "Tout sélectionner" }, "delete_selected": { "message": "Supprimer la sélection" @@ -78,7 +78,7 @@ "message": "Êtes-vous sûr de vouloir supprimer les mots sélectionnés ?" }, "deselect_all": { - "message": "Désélectionner" + "message": "Tout désélectionner" }, "highlight_lists": { "message": "Listes de surbrillance" diff --git a/_locales/hi/messages.json b/_locales/hi/messages.json index 861c3ee..c75f7c5 100644 --- a/_locales/hi/messages.json +++ b/_locales/hi/messages.json @@ -78,7 +78,7 @@ "message": "क्या आप वाकई चयनित शब्दों को हटाना चाहते हैं?" }, "deselect_all": { - "message": "चयन हटाएँ" + "message": "सभी का चयन हटाएँ" }, "highlight_lists": { "message": "हाइलाइट सूचियाँ" diff --git a/_locales/it/messages.json b/_locales/it/messages.json index cf232ee..127f402 100644 --- a/_locales/it/messages.json +++ b/_locales/it/messages.json @@ -36,7 +36,7 @@ "message": "Aggiungi parole" }, "select_all": { - "message": "Seleziona" + "message": "Seleziona tutto" }, "delete_selected": { "message": "Elimina selezionati" @@ -78,7 +78,7 @@ "message": "Sei sicuro di voler eliminare le parole selezionate?" }, "deselect_all": { - "message": "Deseleziona" + "message": "Deseleziona tutto" }, "highlight_lists": { "message": "Elenchi di evidenziazione" diff --git a/_locales/ja/messages.json b/_locales/ja/messages.json index 726e2be..1d77a8c 100644 --- a/_locales/ja/messages.json +++ b/_locales/ja/messages.json @@ -78,7 +78,7 @@ "message": "選択した単語を削除してもよろしいですか?" }, "deselect_all": { - "message": "すべて解除" + "message": "すべての選択を解除" }, "highlight_lists": { "message": "ハイライトリスト" diff --git a/_locales/ko/messages.json b/_locales/ko/messages.json index ea484a2..93e9f18 100644 --- a/_locales/ko/messages.json +++ b/_locales/ko/messages.json @@ -36,7 +36,7 @@ "message": "단어 추가" }, "select_all": { - "message": "선택" + "message": "모두 선택" }, "delete_selected": { "message": "선택 항목 삭제" @@ -78,7 +78,7 @@ "message": "선택한 단어를 삭제하시겠습니까?" }, "deselect_all": { - "message": "선택 해제" + "message": "모두 선택 해제" }, "highlight_lists": { "message": "하이라이트 리스트" diff --git a/_locales/nl/messages.json b/_locales/nl/messages.json index 37fc558..4d9e6e3 100644 --- a/_locales/nl/messages.json +++ b/_locales/nl/messages.json @@ -36,7 +36,7 @@ "message": "Woorden toevoegen" }, "select_all": { - "message": "Selecteren" + "message": "Alles selecteren" }, "delete_selected": { "message": "Geselecteerde verwijderen" @@ -78,7 +78,7 @@ "message": "Weet je zeker dat je de geselecteerde woorden wilt verwijderen?" }, "deselect_all": { - "message": "Deselecteren" + "message": "Alles deselecteren" }, "highlight_lists": { "message": "Markeer lijsten" diff --git a/_locales/pl/messages.json b/_locales/pl/messages.json index 8001187..b7e4ad6 100644 --- a/_locales/pl/messages.json +++ b/_locales/pl/messages.json @@ -36,7 +36,7 @@ "message": "Dodaj słowa" }, "select_all": { - "message": "Zaznacz" + "message": "Zaznacz wszystko" }, "delete_selected": { "message": "Usuń zaznaczone" @@ -78,7 +78,7 @@ "message": "Czy na pewno chcesz usunąć wybrane słowa?" }, "deselect_all": { - "message": "Odznacz" + "message": "Odznacz wszystko" }, "highlight_lists": { "message": "Listy podświetleń" diff --git a/_locales/pt_BR/messages.json b/_locales/pt_BR/messages.json index bed56a4..9694482 100644 --- a/_locales/pt_BR/messages.json +++ b/_locales/pt_BR/messages.json @@ -36,7 +36,7 @@ "message": "Adicionar palavras" }, "select_all": { - "message": "Selecionar" + "message": "Selecionar tudo" }, "delete_selected": { "message": "Excluir selecionados" @@ -78,7 +78,7 @@ "message": "Tem certeza de que deseja excluir as palavras selecionadas?" }, "deselect_all": { - "message": "Desmarcar" + "message": "Desmarcar tudo" }, "highlight_lists": { "message": "Listas de destaque" diff --git a/_locales/ru/messages.json b/_locales/ru/messages.json index e51e20a..3416c87 100644 --- a/_locales/ru/messages.json +++ b/_locales/ru/messages.json @@ -78,7 +78,7 @@ "message": "Вы уверены, что хотите удалить выбранные слова?" }, "deselect_all": { - "message": "Отменить выбор" + "message": "Снять выделение со всех" }, "highlight_lists": { "message": "Списки" diff --git a/_locales/tr/messages.json b/_locales/tr/messages.json index 6456b2b..6f09baf 100644 --- a/_locales/tr/messages.json +++ b/_locales/tr/messages.json @@ -36,7 +36,7 @@ "message": "Kelimeleri Ekle" }, "select_all": { - "message": "Seç" + "message": "Tümünü seç" }, "delete_selected": { "message": "Seçilenleri sil" @@ -78,7 +78,7 @@ "message": "Seçili kelimeleri silmek istediğinizden emin misiniz?" }, "deselect_all": { - "message": "Seçimi Kaldır" + "message": "Tümünün seçimini kaldır" }, "highlight_lists": { "message": "Vurgulama Listeleri" diff --git a/_locales/zh_CN/messages.json b/_locales/zh_CN/messages.json index 1521960..d510827 100644 --- a/_locales/zh_CN/messages.json +++ b/_locales/zh_CN/messages.json @@ -36,7 +36,7 @@ "message": "添加单词" }, "select_all": { - "message": "选择" + "message": "全选" }, "delete_selected": { "message": "删除所选" @@ -78,7 +78,7 @@ "message": "您确定要删除选中的单词吗?" }, "deselect_all": { - "message": "取消选择" + "message": "取消全选" }, "highlight_lists": { "message": "高亮列表" diff --git a/popup/popup.css b/popup/popup.css index 6addc17..43430d9 100644 --- a/popup/popup.css +++ b/popup/popup.css @@ -865,11 +865,55 @@ body { user-select: none; } +.page-highlights-filters-wrap { + display: flex; + flex-direction: column; + gap: 6px; + flex-shrink: 0; +} + +.page-highlights-filters-actions { + display: flex; + align-items: center; + justify-content: flex-end; + gap: 8px; + flex-shrink: 0; +} + +.page-highlights-filters-actions .page-highlights-filter-link { + font-size: var(--text-xs); + font-weight: 500; + color: var(--text-color); + opacity: 0.7; + background: none; + border: none; + padding: 0; + cursor: pointer; + text-decoration: underline; + text-underline-offset: 2px; + transition: opacity 0.2s, color 0.2s; +} + +.page-highlights-filters-actions .page-highlights-filter-link:hover { + opacity: 1; + color: var(--accent); +} + +.page-highlights-filters-actions span[aria-hidden="true"] { + font-size: var(--text-xs); + color: var(--text-color); + opacity: 0.5; + user-select: none; +} + .page-highlights-filters { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; + max-height: 62px; + overflow-y: auto; + overflow-x: hidden; } .page-highlights-filter-chip { diff --git a/popup/popup.html b/popup/popup.html index cbc0f16..15dca75 100644 --- a/popup/popup.html +++ b/popup/popup.html @@ -210,7 +210,10 @@ Group by list -
+
+ +
+
diff --git a/src/popup/PopupController.ts b/src/popup/PopupController.ts index d773d1d..8fd7b35 100644 --- a/src/popup/PopupController.ts +++ b/src/popup/PopupController.ts @@ -1026,6 +1026,7 @@ export class PopupController { private passesListFilter(h: { listId?: number; listNames: string[] }): boolean { if (this.pageHighlightsListFilter.size === 0) return true; + if (this.pageHighlightsListFilter.has(-1)) return false; const wordListIds = new Set(); if (h.listId !== undefined) wordListIds.add(h.listId); for (const name of h.listNames) { @@ -1122,19 +1123,62 @@ export class PopupController { } } + private static readonly PAGE_HIGHLIGHTS_MANY_LISTS_THRESHOLD = 8; + private renderPageHighlightsFilters(): void { const container = document.getElementById('pageHighlightsListFilters'); + const actionsEl = document.getElementById('pageHighlightsFiltersActions'); if (!container) return; if (this.pageHighlightsActiveLists.length <= 1) { container.innerHTML = ''; + if (actionsEl) { + actionsEl.innerHTML = ''; + actionsEl.hidden = true; + } return; } - const allSelected = this.pageHighlightsListFilter.size === 0 || this.pageHighlightsListFilter.size === this.pageHighlightsActiveLists.length; + + const isNone = this.pageHighlightsListFilter.size === 1 && this.pageHighlightsListFilter.has(-1); + const allSelected = !isNone && (this.pageHighlightsListFilter.size === 0 || this.pageHighlightsListFilter.size === this.pageHighlightsActiveLists.length); + const showQuickActions = this.pageHighlightsActiveLists.length > PopupController.PAGE_HIGHLIGHTS_MANY_LISTS_THRESHOLD; + + if (actionsEl) { + if (showQuickActions) { + const allLabel = chrome.i18n.getMessage('select_all') || 'Select all'; + const noneLabel = chrome.i18n.getMessage('deselect_all') || 'Deselect all'; + actionsEl.innerHTML = ` + + + + `; + actionsEl.hidden = false; + actionsEl.querySelectorAll('.page-highlights-filter-link').forEach(btn => { + btn.addEventListener('click', () => { + const action = (btn as HTMLElement).dataset.filterAction; + if (action === 'all') { + this.pageHighlightsListFilter = new Set(); + } else if (action === 'none') { + this.pageHighlightsListFilter = new Set([-1]); + } + this.savePopupState(); + this.renderPageHighlights(); + this.renderPageHighlightsFilters(); + }); + }); + } else { + actionsEl.innerHTML = ''; + actionsEl.hidden = true; + } + } + + const active = (listId: number) => + !isNone && (this.pageHighlightsListFilter.size === 0 || this.pageHighlightsListFilter.has(listId)); + container.innerHTML = this.pageHighlightsActiveLists.map(list => { - const active = this.pageHighlightsListFilter.size === 0 || this.pageHighlightsListFilter.has(list.id); + const chipActive = active(list.id); const bg = DOMUtils.escapeHtml(list.background); return ` - @@ -1149,6 +1193,11 @@ export class PopupController { } else { this.pageHighlightsListFilter.add(id); } + if (this.pageHighlightsListFilter.size === 0) { + this.pageHighlightsListFilter = new Set(); + } else if (this.pageHighlightsListFilter.has(-1)) { + this.pageHighlightsListFilter.delete(-1); + } this.savePopupState(); this.renderPageHighlights(); this.renderPageHighlightsFilters();