Download button at Payments > Payouts is misaligned

[csmcneill]

Describe the bug

The Download button for various reports has typically been right-aligned (next to the ellipsis menu). However, on the Payments > Payouts page, it is misaligned.

Initial investigation suggests the alignment issue is caused by some justify-content: space-between; styling for the .woocommerce-report-table .components-card__header .woocommerce-table__actions element, but this styling is not present on other pages.

To Reproduce

1. Log into wp-admin for a site with WooPayments that has processed payouts.
2. Navigate to Payments > Transactions.
3. Note the position of the gridicons-cloud-download SVG.
4. Navigate to Payments > Payouts.
5. Note the position of the gridicons-cloud-download SVG is left-aligned.

Actual behavior

The experience of downloading a report of an account's payout history is dissimilar from downloading other similar reports (e.g., transactions, disputes). We should try to make this experience as consistent as possible.

Screenshots

Expected behavior

The experience of locating and downloading reports should be consistent across the entire product.

Additional context

No user reports AFAIK. Found this issue while performing other tests.

[haszari]

The Download button for various reports has typically been right-aligned (next to the ellipsis menu). However, on the Payments > Payouts page, it is misaligned.

Super weird that this is only on payouts view! Small thing but important to fix because it's inconsistent. Could potentially be a signal of deeper problem, these list views should ideally be 100% consistent.

[Jinksi]

The cause, as spotted by @csmcneill, was introduced in #8996 as a temporary CSS fix when many search terms were active on the Transactions table after clicking through from a Payment Activity Card report (unreleased).

woocommerce-payments/client/transactions/list/style.scss

Line 165 in 1fc7a8a

justify-content: space-between;

This inadvertently impacted the Payouts list styles.

Since we're removing the need for these styles in #9871, I'll open a new PR that removes them, resolving this issue.