1983833 - Migrate the composable toolbar color tokens to the new M3 + Acorn specs

Status: ASSIGNED

(Firefox for Android :: Design System and Theming, task)

Description

[Petru-Mugurel Lingurar [:petru]]

We should investigate what changes for the colours used for the composable toolbar are needed to fully integrate with the new M3 + Acorn spec.
Here is the link to the new tokens.

Comment 1

[Gabriel Luong [:gl] (ΦωΦ)]

Attachment: Bug 1983833 - Part 1: Migrate the AwesomeBar colors to use M3 Acorn color tokens

Reference: https://www.figma.com/design/ctk1Pw1TBxUwVgTTOvjHb4/2025-Android-Fundamentals?node-id=972-25475&m=dev

Comment 2

[Gabriel Luong [:gl] (ΦωΦ)]

Attachment: Bug 1983833 - Part 2: Migrate TabCounter to use M3 Acorn color tokens

Figma: https://www.figma.com/design/MjufE1X5fvkxZ0YneX4kRd/Android-Library--2025-?node-id=63874-4870&m=dev

Comment 3

[Gabriel Luong [:gl] (ΦωΦ)]

Attachment: Bug 1983833 - Part 3: Migrate IconButton to use M3 Acorn color tokens

Figma: https://www.figma.com/design/MjufE1X5fvkxZ0YneX4kRd/Android-Library--2025-?node-id=63872-9687&m=dev

Comment 4

[Gabriel Luong [:gl] (ΦωΦ)]

Attachment: Bug 1983833 - Part 4: Migrate NavigationBar to use M3 Acorn color tokens

Figma: https://www.figma.com/design/MjufE1X5fvkxZ0YneX4kRd/Android-Library--2025-?node-id=65318-23525&m=dev

Comment 5

[Gabriel Luong [:gl] (ΦωΦ)]

Attachment: Bug 1983833 - Part 5: Migrate InlineAutocompleteTextField to use M3 Acorn color tokens

Figma: https://www.figma.com/design/MjufE1X5fvkxZ0YneX4kRd/Android-Library--2025-?node-id=63874-4870&m=dev

Comment 6

[Gabriel Luong [:gl] (ΦωΦ)]

Attachment: Bug 1983833 - Part 6: Migrate SearchSelector to use M3 Acorn color tokens

• Confirmed container color should be surface bright with Maggie over in slack https://mozilla.slack.com/archives/C08MZ1Z840K/p1761577889871329
• Figma: https://www.figma.com/design/MjufE1X5fvkxZ0YneX4kRd/Android-Library--2025-?node-id=59914-9786&m=dev

Comment 7

[Gabriel Luong [:gl] (ΦωΦ)]

Attachment: Bug 1983833 - Part 7: Migrate DotHighlight to use M3 Acorn color tokens

• The iconAccentBlue color had the wrong dark theme color. Instead of changing iconAccentBlue, added a new information color to AcornColors since we will want to deprecate iconAccentBlue and remove.
• Color: https://www.figma.com/design/MjufE1X5fvkxZ0YneX4kRd/Android-Library--2025-?node-id=64745-6688&m=dev
• Dot Highlight: https://www.figma.com/design/MjufE1X5fvkxZ0YneX4kRd/Android-Library--2025-?node-id=66379-5182&m=dev

Comment 8

[Gabriel Luong [:gl] (ΦωΦ)]

Attachment: Bug 1983833 - Part 8: Migrate ActionButton and ActionContainer to use M3 Acorn color tokens

Figma: https://www.figma.com/design/MjufE1X5fvkxZ0YneX4kRd/Android-Library--2025-?node-id=63874-4867&m=dev

Comment 9

[Gabriel Luong [:gl] (ΦωΦ)]

Attachment: Bug 1983833 - Part 9: Migrate Origin and HighlightedDomainUrl to use M3 Acorn color tokens

Figma: https://www.figma.com/design/MjufE1X5fvkxZ0YneX4kRd/Android-Library--2025-?node-id=63874-4890&m=dev

Comment 10

[Gabriel Luong [:gl] (ΦωΦ)]

Attachment: Bug 1983833 - Part 10: Migrate BrowserDisplayToolbar and BrowserEditToolbar to use M3 Acorn color tokens

Figma: https://www.figma.com/design/MjufE1X5fvkxZ0YneX4kRd/Android-Library--2025-?node-id=64371-9809&m=dev

Comment 11

[Gabriel Luong [:gl] (ΦωΦ)]

Attachment: Bug 1983833 - Part 11: Migrate BrowserToolbarComposable to use M3 Acorn color tokens

Figma: https://www.figma.com/design/MjufE1X5fvkxZ0YneX4kRd/Android-Library--2025-?node-id=64371-9809&m=dev

Comment 12

[Gabriel Luong [:gl] (ΦωΦ)]

Attachment: Bug 1983833 - Part 12: Migrate AnimatedProgressBar to use M3 Acorn color tokens

Comment 13

[Gabriel Luong [:gl] (ΦωΦ)]

Attachment: Bug 1983833 - Part 13: Migrate ClipboardSuggestionBar to use M3 Acorn color tokens

Comment 14

[Gabriel Luong [:gl] (ΦωΦ)]

Attachment: Bug 1983833 - Part 13: Migrate menuItemComposable to use M3 Acorn color tokens

Figma: https://www.figma.com/design/MjufE1X5fvkxZ0YneX4kRd/Android-Library--2025-?node-id=63982-26985&m=dev

Comment 15

[Gabriel Luong [:gl] (ΦωΦ)]

Attachment: Bug 1983833 - Part 14: Migrate AwesomeBarComposable to use M3 color tokens

Comment 16

[Gabriel Luong [:gl] (ΦωΦ)]

Attachment: Bug 1983833 - Part 15: Migrate PrivateSuggestionsCard to use M3 color tokens

Comment 17

[Gabriel Luong [:gl] (ΦωΦ)]

Attachment: Bug 1983833 - Part 16: Migrate to use the M3 color tokens for the awesome bar background in HistoryFragment