1947278 - Replace <div> in Button Group story with a moz-card

Status: RESOLVED FIXED

(Toolkit :: UI Widgets, task, P3)

Description

[Tim Giles [:tgiles]]

In our Button Group story, we use a div as a card for emphasis for the button group. We should replace this with moz-card since that is our card component.

To help Mozilla out with this bug, here's the steps:

1. Comment here on the bug that you want to volunteer to help.
   This will tell others that you're working on the next steps.
2. Download and build the Firefox source code
   • Here is a more detailed tutorial for getting set up to work on Firefox
   • If you have any problems, please ask on Element/Matrix in the #introduction channel. They're there to help you get started.
3. Start working on this bug.
   • You will need to go to moz-button-group.stories.mjs and replace the <div> element with a <moz-card> element.
   • You may need to import the moz-card component like how moz-toggle is imported in moz-fieldset.stories.mjs
   • 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.
4. Build your change with mach build and test your change with mach storybook and navigating to the button group stories. Also check your changes for adherence to our style guidelines by using mach lint.
5. 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.
   • How to Submit a Patch
   • This is when the bug will be assigned to you.
6. After a series of reviews and changes to your patch, I'll push it to autoland.
   • If there are changes requested, please read the "To update a submitted patch" section to ensure you don't accidentally create a duplicate revision!
   • Your code will soon be shipping to Firefox users worldwide!

Comment 1

[Hazem Ahmed]

Hi everyone,
I'm excited to work on this bug! I've gone through the detailed report and the provided guides, and I'm now diving into the implementation.
Thanks!

Comment 2

[Raksha Kumari]

If the bug I'm referencing is still unresolved, please let me know. I've successfully fixed the issue and thoroughly tested the solution. Screenshots of the fix and testing results are attached for your review.
Screenshot 1
Please provide instructions on how to submit the patch for integration.

Comment 3

[Tim Giles [:tgiles]]

Hi Raksha, please read the to submit a patch in the Firefox Contributors' Quick Reference guide for information on how to submit your patch for review. See also the more detailed how to submit a patch guide if you need more detailed information on this process. Thanks!

Comment 4

[Raksha Kumari]

Attachment: Bug 1947278 - Replace div with moz-card in Button Group story for emphasis. r?tgiles

Comment 5

[Raksha Kumari]

Hey, I've made all the changes. Could you please review them?

Comment 6

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/5a3ea31237ee
Replace div with moz-card in Button Group story for emphasis. r=tgiles,reusable-components-reviewers

Comment 7

[Atila Butkovits]

https://hg.mozilla.org/mozilla-central/rev/5a3ea31237ee