
6

Use moz-button-group in report add-on dialog
source link: https://bugzilla.mozilla.org/show_bug.cgi?id=1819352
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.

Details
(Keywords: good-first-bug, Whiteboard: [fidefe-reusable-components][lang=js][lang=html][lang=css])
The Cancel/Go back and Next/Submit buttons in the report add-on dialog don't follow our conventions for what buttons should look like in dialogs like this.
There are some custom styles to make the buttons shorter and wider that can be removed (the rule and associated --button-padding
variable) [1]. And the container of the buttons should be updated to use the moz-button-group
component so that they're correctly positioned on all platforms.
If you're an Outreachy applicant or external contributor wanting to pick up this bug, please follow these steps:
- Comment here on the bug that you want to volunteer to help. This will tell others that you're working on the next steps.
- Download and build the Firefox source code
- If you have any problems, please ask on Element/Matrix in the
#introduction
channel. They're there to help you get started. - You can also read the Firefox Contributors' Quick Reference, which has answers to most development questions.
- If you have any problems, please ask on Element/Matrix in the
- Start working on this bug.
- To find this dialog in Firefox, navigate to
about:addons
and add at least one addon (if you don't already have any installed). Find an addon in the "Enabled" section, click on the "..." menu, then click on "Report" to bring up the dialog. - The code For the buttons can be found here.
- You'll need to wrap both sets of buttons with a
moz-button-group
, then double check to see if there's any CSS that needs to be removed (anything that changes the size or spacing of the buttons). You may need to add a script tag to make themoz-button-group
element available in the dialog. You can see an example of similar work in Bug 1802377. - If you have any problems with this bug, please comment on this bug and set the needinfo flag for me. Also, you can find me and my teammates on the
#reusable-components
channel on Element/Matrix most hours of most days.
- To find this dialog in Firefox, navigate to
- Build your change with
mach build
and verify your changes locally. You can also test your change by running some of the abuse report tests (in particular thebrowser_html_abuse_report.js
tests). More information on running tests can be found here. Also check your changes for adherence to our style guidelines by usingmach lint
- Submit the patch (including an automated test, if applicable) for review. Mark me as a reviewer so I'll get an email to come look at your code.
- Getting your code reviewed
- This is when the bug will be assigned to you.
- After a series of reviews and changes to your patch, I'll mark it for checkin or push it to autoland. Your code will soon be shipping to Firefox users worldwide!
Mentor: hjones
Keywords: good-first-bug
Whiteboard: [fidefe-reusable-components] → [fidefe-reusable-components][lang=js][lang=html][lang=css]
Recommend
About Joyk
Aggregate valuable and interesting links.
Joyk means Joy of geeK