PAX inherits conflicting styles from WP core

[aaemnnosttv]

Bug Description

There are a few CSS styles that PAX inherits from WP core which result in a "broken" visual appearance.

Steps to reproduce

1. Connect Ads via PAX
2. View Ads widget on dashboard

Screenshots

---

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

Acceptance criteria

• PAX should not be affected by CSS styles that are intended for WP core layout (e.g. .card)
• A few of PAX's own styles should be modified to provide a more seamless presence on the SK dashboard by removing it's extra padding, margin, borders, and shadows so that it only fills the widget contents rather than providing the entire thing

Implementation Brief

Note to the reviewer: Due to the priority of the issue, I already added a PR targeting main, to speed up the inclusion, as it is a very small css change. If IB is ok, it can go straight to the CR

• [ ] Add assets/sass/components/ads/_googlesitekit-ads-pax-embedded-app.scss
  • CSS selectors should be nested under main .googlesitekit-pax-embedded-app selector
  • Remove padding from .card-content
  • On .mdc-card.card
    • Remove top margin, max-width and shadow from the card container
    • Apply same padding used for other widgets ($grid-gap-desktop for desktop and $grid-gap-phone)
    • Apply same border radius used on other widgets $br-sm
  • Remove margin top from .notification

Test Coverage

• No updates needed

QA Brief

• Setup Site Kit
• Setup Ads module using PAX embedded app
• Go to dashboard, verify that PAX dashboard widget have proper styling matching the other widgets

Changelog entry

• N/A

[eclarke1]

This is related to this bug bash item https://app.asana.com/0/1207337163922896/1207344075557379 just FYI

[wpdarren]

QA Update: ✅

Verified:

The PAX dashboard widget has proper styling matching the other widgets. The widget now appears in the entire space of the widget area and looks much more user friendly.

Note: there is a very minor styling issue on smaller viewports and I will create a ticket for this.