1639122 - Compat panel - add padding between browser icons and issue type

Status: VERIFIED FIXED

(DevTools :: Inspector: Compatibility, enhancement, P3)

Description

[Cristian Fogel [:cfogel]]

Attachment: Screenshot 0002-05-19 at 10.32.37.png

Affected versions

• 77.0b7(DevTools), 78.0a1 (2020-05-18)

Affected platforms

• macOS 10.15.4, Windows 10, Ubuntu 18.04;

Steps to reproduce

• devtools.inspector.compatibility.enabled preff on true;

1. Launch Firefox, open DevTools Inspector - Compat tab;
2. Access about:newtab
3. Wait until the list populates with issues, expand sections;
4. Expand the nested lists in the Compat tab;

Expected result

• UI properly displayed

Actual result / Enhancement suggestion

• for experimental/deprecated or lists with multiple browsers padding between the text and icons is needed - otherwise they're sticking one to the other in certain size scenarios

Regression range

• not a regression;

Additional notes

• attached screenshot to illustrate the issue.

Comment 1

[Victoria Wang [:victoria]]

Related to padding - could we increase the gap between icons to 6px?

Comment 2

[Victoria Wang [:victoria]]

^ This one is pretty visible in screenshots/demos so I would rate it a higher priority :)

Comment 3

[Daisuke Akatsuka (:daisuke)]

Attachment: Bug 1639122: Make issue item components collapsable.

Comment 4

[Daisuke Akatsuka (:daisuke)]

Oh, I landed the patch with thinking that this is bug 1639495..
However, this patch would fix three bugs include the above bug at the same time.

• Bug 1639122 - Compat panel - add padding between browser icons and issue type (this bug)
• Bug 1639495 - Compat panel - keep bottom scrollbar in view if needed
• Bug 1639194 - Compat panel - issues separators not drawn over the whole section

Comment 5

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/2ae23d137681
Make issue item components collapsable. r=ladybenko

Comment 6

[Dorel Luca [:dluca]]

https://hg.mozilla.org/mozilla-central/rev/2ae23d137681