From ba3f7b3e96df7f034b56132d8c2c90289e16c288 Mon Sep 17 00:00:00 2001 From: soriac Date: Fri, 30 Apr 2021 18:57:53 -0300 Subject: Show any custom tags on words that have anki cards created (#1628) * Proof-of-concept for showing card tags (#1626) * Resolved most PR comments: - Added a snackbar notification when clicking tag button - Replaced magnifying glass icon with new tag icon - Button now contains a span w/icon, to use text color - Removed unnecessary attributes from button - Backend now returns full noteInfos object - Frontend now handles filtering tags * Add options to show/hide tag button & filter tags * Do not show tags button if, after filtering, we have zero tags. * Change tags option to enums, optimize tags intersection check & fix code style. * Update options-util.js to include new tag options. * Fix wording on new tag setting. * Add CSS to remove hidden buttons from the display layout. * getAnkiNoteInfo extra parameter for additional info. * Add new tag option to tests. * Remove unnecessary changes related to anki tags option. * Code style fixes. --- ext/css/display.css | 11 ++++++++++- 1 file changed, 10 insertions(+), 1 deletion(-) (limited to 'ext/css') diff --git a/ext/css/display.css b/ext/css/display.css index c7827710..6fffc5ab 100644 --- a/ext/css/display.css +++ b/ext/css/display.css @@ -644,6 +644,9 @@ button.action-button[hidden] { -webkit-filter var(--animation-duration) linear, background-color var(--animation-duration) linear; } +button.collapsible-action-button[hidden] { + display: none; +} button.action-button:disabled { pointer-events: none; cursor: default; @@ -667,7 +670,7 @@ button.action-button:active { background-color: var(--action-button-active-color); box-shadow: none; } -button.action-button::before { +button.action-button[data-icon]::before { content: ''; width: var(--action-button-size); height: var(--action-button-size); @@ -691,6 +694,12 @@ button.action-button[data-icon=play-audio]::before { button.action-button[data-icon=source-term]::before { background-image: url('/images/source-term.svg'); } +.action-view-tags>.icon { + display: block; + width: var(--action-button-size); + height: var(--action-button-size); + background-color: var(--text-color); +} :root[data-result-output-mode=merge] .entry[data-type=term] .actions>button.action-button.action-play-audio { display: none; } -- cgit v1.2.3