anki/qt/aqt/flags.py
Matthias Metelka 8142176f84
Introduce new color palette using Sass maps (#2016)
* Remove --medium-border variable

* Implement color palette using Sass maps

I hand-picked the gray tones, the other colors are from the Tailwind CSS v3 palette.

Significant changes:
- light theme is brighter
- dark theme is darker
- borders are softer

I also deleted some platform- and night-mode-specific code.

* Use custom colors for note view switch

* Use same placeholder color for all inputs

* Skew color palette for more dark values

by removing gray[3], which wasn't used anywhere. Slight adjustments were made to the darker tones.

* Adjust frame- window- and border colors

* Give deck browser entries --frame-bg as background color

* Define styling for QComboBox and QLineEdit globally

* Experiment with CSS filter for inline-colors

Inside darker inputs, some colors like dark blue will be hard to read, so we could try to improve text-color contrast with global adjustments depending on the theme.

* Use different map structure for _vars.scss

after @hgiesel's idea: https://github.com/ankitects/anki/pull/2016#discussion_r947087871

* Move custom QLineEdit styles out of searchbar.py

* Merge branch 'main' into color-palette

* Revert QComboBox stylesheet override

* Align gray color palette more with macOS

* Adjust light theme

* Use --slightly-grey-text for options tab color

* Replace gray tones with more neutral values

* Improve categorization of global colors

by renaming almost all of them and sorting them into separate maps.

* Saturate highlight-bg in light theme

* Tweak gray tones

* Adjust box-shadow of EditingArea to make fields look inset

* Add Sass functions to access color palette and semantic variables

in response to https://github.com/ankitects/anki/pull/2016#issuecomment-1220571076

* Showcase use of access functions in several locations

@hgiesel in buttons.scss I access the color palette directly. Is this what you meant by "... keep it local to the component, and possibly make it global at a later time ..."?

* Fix focus box shadow transition and remove default shadow for a cleaner look

I couldn't quite get the inset look the way I wanted, because inset box-shadows do not respect the border radius, therefore causing aliasing.

* Tweak light theme border and shadow colors

* Add functions and colors to base_lib

* Add vars_lib as dependency to base_lib and button_mixins_lib

* Improve uses of default-themed variables

* Use old --frame-bg color and use darker tone for canvas-default

* Return CSS var by default and add palette-of function for raw value

* Showcase use of palette-of function

The #{...} syntax is required only because the use cases are CSS var definitions. In other cases a simple palette-of(keyword, theme) would suffice.

* Light theme: decrease brightness of canvas-default and adjust fg-default

* Use canvas-inset variable for switch knob

* Adjust light theme

* Add back box-shadow to EditingArea

* Light theme: darken background and flatten transition

also set hue and saturation of gray-8 to 0 (like all the other grays).

* Reduce flag colors to single default value

* Tweak card/note accent colors

* Experiment with inset look for fields again

Is this too dark in night mode? It's the same color used for all other text inputs.

* Dark theme: make border-default one shade darker

* Tweak inset shadow color

* Dark theme: make border-faint darker than canvas-default

meaning two shades darker than it currently was.

* Fix PlainTextInput not expanding

* Dark theme: use less saturated flag colors

* Adjust gray tones

* Fix nested variables not getting extracted correctly

* Rename canvas-outset to canvas-elevated

* Light theme: darken canvas-default

* Make canvas-elevated a bit darker

* Rename variables and use them in various components

* Refactor button mixins

* Remove fusion vars from Anki

* Adjust button gradients

* Refactor button mixins

* Fix deck browser table td background color

* Use color function in buttons.scss

* Rework QTabWidget stylesheet

* Fix crash on browser open

* Perfect QTableView header

* Fix bottom toolbar button gradient

* Fix focus outline of bottom toolbar buttons

* Fix custom webview scrollbar

* Fix uses of vars in various webviews

The command @use vars as * lead to repeated inclusion of the CSS vars.

* Enable primary button color with mixin

* Run prettier

* Fix Python code style issues

* Tweak colors

* Lighten scrollbar shades in light theme

* Fix code style issues caused by merge

* Fix harsh border color in editor

caused by leftover --medium-border variables, probably introduced with a merge commit.

* Compile Sass before extracting Python colors/props

This means the Python side doesn't need to worry about the map structure and Sass functions, just copy the output CSS values.

* Desaturate primary button colors by 10%

* Convert accidentally capitalized variable names to lowercase

* Simplify color definitions with qcolor function

* Remove default border-focus variable

* Remove redundant colon

* Apply custom scrollbar CSS only on Windows and Linux

* Make border-subtle color brighter than background in dark theme

* Make border-subtle color a shade brighter in light theme

* Use border-subtle for NoteEditor and EditorToolbar border

* Small patches
2022-09-16 14:11:18 +10:00

117 lines
4.0 KiB
Python

# Copyright: Ankitects Pty Ltd and contributors
# License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
from __future__ import annotations
from dataclasses import dataclass
from typing import cast
import aqt
import aqt.main
from anki.collection import SearchNode
from aqt import colors, gui_hooks
from aqt.theme import ColoredIcon
from aqt.utils import tr
@dataclass
class Flag:
"""A container class for flag related data.
index -- The integer by which the flag is represented internally (1-7).
label -- The text by which the flag is described in the GUI.
icon -- The icon by which the flag is represented in the GUI.
search_node -- The node to build a search string for finding cards with the flag.
action -- The name of the action to assign the flag in the browser form.
"""
index: int
label: str
icon: ColoredIcon
search_node: SearchNode
action: str
class FlagManager:
def __init__(self, mw: aqt.main.AnkiQt) -> None:
self.mw = mw
self._flags: list[Flag] | None = None
def all(self) -> list[Flag]:
"""Return a list of all flags."""
if self._flags is None:
self._load_flags()
return self._flags
def get_flag(self, flag_index: int) -> Flag:
if not 1 <= flag_index <= len(self.all()):
raise Exception(f"Flag index out of range (1-{len(self.all())}).")
return self.all()[flag_index - 1]
def rename_flag(self, flag_index: int, new_name: str) -> None:
if new_name in ("", self.get_flag(flag_index).label):
return
labels = self.mw.col.get_config("flagLabels", {})
labels[str(flag_index)] = self.get_flag(flag_index).label = new_name
self.mw.col.set_config("flagLabels", labels)
gui_hooks.flag_label_did_change()
def require_refresh(self) -> None:
"Discard cached labels."
self._flags = None
def _load_flags(self) -> None:
labels = cast(dict[str, str], self.mw.col.get_config("flagLabels", {}))
icon = ColoredIcon(path="icons:flag-variant.svg", color=colors.FG_DISABLED)
self._flags = [
Flag(
1,
labels["1"] if "1" in labels else tr.actions_flag_red(),
icon.with_color(colors.FLAG_1),
SearchNode(flag=SearchNode.FLAG_RED),
"actionRed_Flag",
),
Flag(
2,
labels["2"] if "2" in labels else tr.actions_flag_orange(),
icon.with_color(colors.FLAG_2),
SearchNode(flag=SearchNode.FLAG_ORANGE),
"actionOrange_Flag",
),
Flag(
3,
labels["3"] if "3" in labels else tr.actions_flag_green(),
icon.with_color(colors.FLAG_3),
SearchNode(flag=SearchNode.FLAG_GREEN),
"actionGreen_Flag",
),
Flag(
4,
labels["4"] if "4" in labels else tr.actions_flag_blue(),
icon.with_color(colors.FLAG_4),
SearchNode(flag=SearchNode.FLAG_BLUE),
"actionBlue_Flag",
),
Flag(
5,
labels["5"] if "5" in labels else tr.actions_flag_pink(),
icon.with_color(colors.FLAG_5),
SearchNode(flag=SearchNode.FLAG_PINK),
"actionPink_Flag",
),
Flag(
6,
labels["6"] if "6" in labels else tr.actions_flag_turquoise(),
icon.with_color(colors.FLAG_6),
SearchNode(flag=SearchNode.FLAG_TURQUOISE),
"actionTurquoise_Flag",
),
Flag(
7,
labels["7"] if "7" in labels else tr.actions_flag_purple(),
icon.with_color(colors.FLAG_7),
SearchNode(flag=SearchNode.FLAG_PURPLE),
"actionPurple_Flag",
),
]