2053817 - Make about:debugging Profiler dialog consistent with other dialogs in Firefox

Status: VERIFIED FIXED

(DevTools :: about:debugging, task)

Description

[Nicolas Chevobbe [:nchevobbe][PTO - back October 26]]

At the moment, the Profiler dialog doesn't look like the other dialogs we have in Firefox (e.g. the alert() dialog):

• the header/title has a background color
• the header/title is not bold
• the dialog doesn't have border radius
• the padding isn't the same

let's fix all those so the dialog feels nicer when Nova lands

Comment 1

[Nicolas Chevobbe [:nchevobbe][PTO - back October 26]]

Attachment: Bug 2053817 - [devtools] Make about:debugging Profile dialog styling consistent with other Firefox dialogs. r=#devtools.

Tweak colors, border radius, spacing and font weight so the dialog looks like
it's part of the design system.

Comment 2

[Pulsebot]

Pushed by [e-mail]:
https://github.com/mozilla-firefox/firefox/commit/d7e5cefda751
https://hg.mozilla.org/integration/autoland/rev/8db326271d85
[devtools] Make about:debugging Profile dialog styling consistent with other Firefox dialogs. r=devtools-reviewers,bomsy.

Comment 3

[Pulsebot]

Pushed by [e-mail]:
https://github.com/mozilla-firefox/firefox/commit/9559450d5ad2
https://hg.mozilla.org/integration/autoland/rev/0ed93f8b742a
Revert "Bug 2053817 - [devtools] Make about:debugging Profile dialog styling consistent with other Firefox dialogs. r=devtools-reviewers,bomsy." for causing devtools failures at custom property

Comment 4

[Silaghi Andreea]

Backed out for causing devtools failures at custom property
Backout Link
Push with failures
Failure Log
Failure line TEST-UNEXPECTED-FAIL | browser/base/content/test/static/browser_parsable_css.js | checkAllTheCSS - custom property --popup-header-background-color is not referenced

Comment 5

[Nicolas Chevobbe [:nchevobbe][PTO - back October 26]]

Ah yes, forgot to cleanup a couple CSS variables that are no longer used

Comment 6

[Pulsebot]

Pushed by [e-mail]:
https://github.com/mozilla-firefox/firefox/commit/61cb86dc17c9
https://hg.mozilla.org/integration/autoland/rev/9381755b3d33
[devtools] Make about:debugging Profile dialog styling consistent with other Firefox dialogs. r=devtools-reviewers,bomsy.

Comment 7

[Atila Butkovits]

https://hg.mozilla.org/mozilla-central/rev/9381755b3d33

Comment 8

[Daniel Bodea [:danibodea]]

I can confirm this implementation in Nightly v155.0a1 and Beta v154.0b4 in Windows 10/11, MacOS 14 and Ubuntu 24.

The following changes were made:

• the header/title background color was removed
• the header/title was made bold
• the dialog border radius was implemented (rounded corners)
• the padding was changed