Skip to content

Tags should show their original tinted colour, and Settings should offer the colour they actually display #2269

Description

@ericgriffin

What we want

Tags should look the way they looked before #2255: a pale tinted chip carrying
the diver's colour, not a chip flooded with that colour at full strength. The
colour swatches in Settings > Manage > Tags should then show that display
colour, rather than the raw saturated hex the tag is stored as.

#2255 fixed the real complaint in #2254, that a tag's colour in Settings did
not match the colour the tag showed anywhere else, by moving the chips to the
stored colour. The mismatch is better resolved the other way round: keep the
quiet chips and correct what Settings promises.

Why the tint has to become opaque

A 15% translucent fill is not a colour, it is a recipe whose result depends on
the surface behind it. That is what #2254 measured: the amber tag #F59E0B
resolved to F7E7CF on a detail card, F2E8D7 on an ordinary dive row and
C4C2B7 on a selected one, where the row's blue-grey bled through.

So a swatch cannot represent "the actual display colour" while the chip stays
translucent, because there is no single such colour. The tint has to be
computed once against a fixed reference surface and then painted opaque. The
pixel on a plain card is unchanged from the pre-#2255 chip; what goes away is
the drift onto selected rows, and the swatch becomes able to tell the truth.

This is the treatment lib/features/courses/presentation/course_status_colors.dart
already uses for the course status card.

Scope

  • TagChip stays the one widget behind every tag, and repaints as the tinted
    recipe: blended opaque fill, full-hue border, hue-preserving label.
  • One tint, not two. The old code used 0.15 in dive lists and 0.2 on
    cards, which would give a tag two display colours again.
  • The label keeps the tag's hue but is darkened until it clears WCAG AA
    against the fill. The pre-fix(tags): show a tag in its own colour, not a tint of it #2255 chips wrote the label in the raw
    tag.color, which on its own 15% tint is about 1.7:1 for the pale hues.
  • TagColorPicker swatches become chip-shaped, drawn by the same colour
    function, in all three places it appears: both dialogs in TagManagePage
    and TagMergeSheet.
  • The Manage list row's solid CircleAvatar becomes the tag's real chip, so
    the spot Tag colour in the app does not match the colour set in Settings > Manage > Tags #2254 measured agrees with the rest of the app.
  • The 48/32 dp close-button tap target added in fix(tags): show a tag in its own colour, not a tint of it #2255 stays. It is an
    accessibility floor and has nothing to do with colour.

Activity

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

Labels

No labels
No labels

Type

Projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions