Minor UI issue with Idea Hub icon on 'View only' menu

[eclarke1]

Bug Description

Bug bash issue: https://app.asana.com/0/1202258919887896/1202419867342278 please see Asana for background

The idea hub icon is slightly larger and unaligned with the text. Only minor.

---

Do not alter or remove anything below. The following sections will be managed by moderators only.

Acceptance criteria

• The module icon, name, and "shared by" info should all be vertically aligned/centered in the "view only" Dashboard Sharing menu.

Implementation Brief

• Update the <Icon /> component here to have a height prop with the value of 26:
  

  site-kit-wp/assets/js/components/ViewOnlyMenu/Service.js

  Line 57 in 1f37af0

  <Icon />

• This necessarily acts as a maximum height for the icons imposing the Idea Hub icon to not be longer than the others.

Test Coverage

• Update VRT screenshots if required.

QA Brief

• Ensure that the dashboardSharing feature flag is enabled in the tester plugin.
• Go to the Site Kit Dashboard.
• Using the Dashboard Sharing settings modal, grant access to some/all modules to one or more roles, which should include the Idea Hub module.
• Log into the site using a different user having one of the granted roles.
• Open the Site Kit Dashboard as a View Only user.
• Open the View Only menu.
• Ensure that the Idea Hub icon and all the other icons are correctly placed.

Changelog entry

• Improve "View only" menu icon alignment when viewing shared dashboard.

[aaemnnosttv]

• Update the <Icon /> component here to have a height prop with the value of 26 only if it is the idea-hub module:

@nfmohit why not set the same height consistently for all module icons? It seems odd that Idea Hub would be a special case here.

[nfmohit]

@aaemnnosttv You're right! I just double-checked and found out that applying the height for all module icons doesn't make a difference to their current dimensions (except Idea Hub, of course, 😅). My bad 🙏. I've updated the IB to apply it for all module icons.

Thank you so much!

[aaemnnosttv]

IB ✅

[wpdarren]

QA Update: ✅

Verified:

• the Idea Hub icon and all the other icons are correctly placed.

Note: I am struggling to see the idea hub icon because of the grey background on the view only menu. I have raised this as a GM2+ issue as it's out of scope for this ticket.