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

Status: RESOLVED FIXED

(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 14: 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 15: Migrate AwesomeBarComposable to use M3 color tokens

Comment 16

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

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

Comment 17

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

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

Comment 18

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

Attachment: Bug 1983833 - Part 18: Migrate BrowserSimpleToolbar to use M3 color tokens

Comment 19

[Pulsebot]

Pushed by [e-mail]:
https://github.com/mozilla-firefox/firefox/commit/48c74bd83a31
https://hg.mozilla.org/integration/autoland/rev/f4d57a8d5293
Part 1: Migrate the AwesomeBar colors to use M3 Acorn color tokens r=android-reviewers,petru
https://github.com/mozilla-firefox/firefox/commit/9a1289a9402a
https://hg.mozilla.org/integration/autoland/rev/edd5d1c1a174
Part 2: Migrate TabCounter to use M3 Acorn color tokens r=android-reviewers,007
https://github.com/mozilla-firefox/firefox/commit/77be8fe7b2f2
https://hg.mozilla.org/integration/autoland/rev/2df163ec324e
Part 3: Migrate IconButton to use M3 Acorn color tokens r=android-reviewers,007
https://github.com/mozilla-firefox/firefox/commit/1c8ca0b04cca
https://hg.mozilla.org/integration/autoland/rev/e3e4e99bbd7d
Part 4: Migrate NavigationBar to use M3 Acorn color tokens r=android-reviewers,007,petru
https://github.com/mozilla-firefox/firefox/commit/a712e9d7dc8d
https://hg.mozilla.org/integration/autoland/rev/124f91874878
Part 5: Migrate InlineAutocompleteTextField to use M3 Acorn color tokens r=android-reviewers,007,petru
https://github.com/mozilla-firefox/firefox/commit/173caad29426
https://hg.mozilla.org/integration/autoland/rev/e203e33b884d
Part 6: Migrate SearchSelector to use M3 Acorn color tokens r=android-reviewers,007,petru
https://github.com/mozilla-firefox/firefox/commit/0a9d66331dcb
https://hg.mozilla.org/integration/autoland/rev/f3b26f2d10c4
Part 7: Migrate DotHighlight to use M3 Acorn color tokens r=android-reviewers,petru
https://github.com/mozilla-firefox/firefox/commit/762cfb025da3
https://hg.mozilla.org/integration/autoland/rev/1de4e90306ed
Part 8: Migrate ActionButton and ActionContainer to use M3 Acorn color tokens r=android-reviewers,007
https://github.com/mozilla-firefox/firefox/commit/7034e11b2d0e
https://hg.mozilla.org/integration/autoland/rev/ba8457804931
Part 9: Migrate Origin and HighlightedDomainUrl to use M3 Acorn color tokens r=android-reviewers,007
https://github.com/mozilla-firefox/firefox/commit/4dab10588d00
https://hg.mozilla.org/integration/autoland/rev/d07e1095b6de
Part 10: Migrate BrowserDisplayToolbar and BrowserEditToolbar to use M3 Acorn color tokens r=android-reviewers,007
https://github.com/mozilla-firefox/firefox/commit/c799b05489cd
https://hg.mozilla.org/integration/autoland/rev/b8a802d8cd88
Part 11: Migrate BrowserToolbarComposable to use M3 Acorn color tokens r=android-reviewers,petru
https://github.com/mozilla-firefox/firefox/commit/5106cc81bbb6
https://hg.mozilla.org/integration/autoland/rev/4addc742ec92
Part 12: Migrate AnimatedProgressBar to use M3 Acorn color tokens r=android-reviewers,007,petru
https://github.com/mozilla-firefox/firefox/commit/e49f4ce6b654
https://hg.mozilla.org/integration/autoland/rev/944729292783
Part 13: Migrate ClipboardSuggestionBar to use M3 Acorn color tokens r=android-reviewers,petru
https://github.com/mozilla-firefox/firefox/commit/b0995591cde5
https://hg.mozilla.org/integration/autoland/rev/6b20ce213d4f
Part 14: Migrate menuItemComposable to use M3 Acorn color tokens r=android-reviewers,petru
https://github.com/mozilla-firefox/firefox/commit/09dc78f1c812
https://hg.mozilla.org/integration/autoland/rev/d2c5ed48256e
Part 15: Migrate AwesomeBarComposable to use M3 color tokens r=android-reviewers,petru,007
https://github.com/mozilla-firefox/firefox/commit/652260580fe6
https://hg.mozilla.org/integration/autoland/rev/d97c45a33d47
Part 16: Migrate PrivateSuggestionsCard to use M3 color tokens r=android-reviewers,petru,007
https://github.com/mozilla-firefox/firefox/commit/efd38013cd20
https://hg.mozilla.org/integration/autoland/rev/5462144911b8
Part 17: Migrate to use the M3 color tokens for the awesome bar background in HistoryFragment r=petru,android-reviewers
https://github.com/mozilla-firefox/firefox/commit/ba19f6823eba
https://hg.mozilla.org/integration/autoland/rev/b7e514fe1bac
Part 18: Migrate BrowserSimpleToolbar to use M3 color tokens r=android-reviewers,007,petru

Comment 20

[Sandor Molnar[:smolnar]]

https://hg.mozilla.org/mozilla-central/rev/f4d57a8d5293
https://hg.mozilla.org/mozilla-central/rev/edd5d1c1a174
https://hg.mozilla.org/mozilla-central/rev/2df163ec324e
https://hg.mozilla.org/mozilla-central/rev/e3e4e99bbd7d
https://hg.mozilla.org/mozilla-central/rev/124f91874878
https://hg.mozilla.org/mozilla-central/rev/e203e33b884d
https://hg.mozilla.org/mozilla-central/rev/f3b26f2d10c4
https://hg.mozilla.org/mozilla-central/rev/1de4e90306ed
https://hg.mozilla.org/mozilla-central/rev/ba8457804931
https://hg.mozilla.org/mozilla-central/rev/d07e1095b6de
https://hg.mozilla.org/mozilla-central/rev/b8a802d8cd88
https://hg.mozilla.org/mozilla-central/rev/4addc742ec92
https://hg.mozilla.org/mozilla-central/rev/944729292783
https://hg.mozilla.org/mozilla-central/rev/6b20ce213d4f
https://hg.mozilla.org/mozilla-central/rev/d2c5ed48256e
https://hg.mozilla.org/mozilla-central/rev/d97c45a33d47
https://hg.mozilla.org/mozilla-central/rev/5462144911b8
https://hg.mozilla.org/mozilla-central/rev/b7e514fe1bac