Update badge.js

[anezthes]

Description

Buttons with icons placed inside a badge are affected by the following styles:

[theme~='badge'] vaadin-icon {
  margin: -0.25em 0;
}
[theme~='badge'] vaadin-icon:first-child {
  margin-left: -0.375em;
}
[theme~='badge'] vaadin-icon:last-child {
  margin-right: -0.375em;
}

Suggesting these minor changes to avoid any icon misalignment:

[theme~='badge'] > vaadin-icon {
  margin: -0.25em 0;
}
[theme~='badge'] > vaadin-icon:first-child {
  margin-left: -0.375em;
}
[theme~='badge'] > vaadin-icon:last-child {
  margin-right: -0.375em;
}

Type of change

• Bugfix
• Feature

Checklist

• I have read the contribution guide: https://vaadin.com/docs/latest/contributing/overview
• I have added a description following the guideline.
• The issue is created in the corresponding repository and I have referenced it.
• I have added tests to ensure my change is effective and works as intended.
• New and existing tests are passing locally with my change.
• [xI have performed self-review and corrected misspellings.

[sonarcloud]

Quality Gate passed

Issues
0 New issues
0 Accepted issues

Measures
0 Security Hotspots
0.0% Coverage on New Code
0.0% Duplication on New Code

See analysis details on SonarCloud

[vaadin-bot]

Hi @anezthes and @DiegoCardoso, when i performed cherry-pick to this commit to 23.5, i have encountered the following issue. Can you take a look and pick it manually?
Error Message:
Error: Command failed: git cherry-pick 8eb6583
error: could not apply 8eb6583... Update badge.js (#7510)
hint: After resolving the conflicts, mark them with
hint: "git add/rm ", then run
hint: "git cherry-pick --continue".
hint: You can instead skip this commit with "git cherry-pick --skip".
hint: To abort and get back to the state before "git cherry-pick",
hint: run "git cherry-pick --abort".