Fix inconsistent layout body padding on some pages.

Automattic · Oct 1, 2024 · 5ed6a6a · 5ed6a6a
1 parent e967583
commit 5ed6a6a
Show file tree

Hide file tree

Showing 5 changed files with 24 additions and 3 deletions.
diff --git a/client/a8c-for-agencies/components/content-sidebar/style.scss b/client/a8c-for-agencies/components/content-sidebar/style.scss
@@ -2,6 +2,7 @@
 @import "@wordpress/base-styles/mixins";
 
 .content-sidebar {
+	margin-block-start: 16px;
 	grid-row: 4 / span 1;
 
 	@include break-xlarge {

diff --git a/client/a8c-for-agencies/sections/purchases/billing/style.scss b/client/a8c-for-agencies/sections/purchases/billing/style.scss
@@ -1,3 +1,7 @@
+.billing-dashboard .a4a-layout__body {
+	padding-block-start: 32px;
+}
+
 .a4a-billing__header-actions {
 	@include breakpoint-deprecated( "<660px" ) {
 		display: block;

diff --git a/client/a8c-for-agencies/sections/purchases/invoices/invoices-overview/index.tsx b/client/a8c-for-agencies/sections/purchases/invoices/invoices-overview/index.tsx
@@ -8,13 +8,20 @@ import LayoutTop from 'calypso/a8c-for-agencies/components/layout/top';
 import MobileSidebarNavigation from 'calypso/a8c-for-agencies/components/sidebar/mobile-sidebar-navigation';
 import InvoicesList from '../invoices-list';
 
+import './style.scss';
+
 export default function InvoicesOverview() {
 	const translate = useTranslate();
 
 	const title = translate( 'Invoices' );
 
 	return (
-		<Layout title={ title } wide sidebarNavigation={ <MobileSidebarNavigation /> }>
+		<Layout
+			className="invoices-overview"
+			title={ title }
+			wide
+			sidebarNavigation={ <MobileSidebarNavigation /> }
+		>
 			<LayoutTop>
 				<LayoutHeader>
 					<Title>{ title } </Title>

diff --git a/client/a8c-for-agencies/sections/purchases/invoices/invoices-overview/style.scss b/client/a8c-for-agencies/sections/purchases/invoices/invoices-overview/style.scss
@@ -0,0 +1,3 @@
+.invoices-overview .a4a-layout__body {
+	padding-block-start: 32px;
+}
diff --git a/client/a8c-for-agencies/sections/purchases/licenses/licenses-overview/style.scss b/client/a8c-for-agencies/sections/purchases/licenses/licenses-overview/style.scss
@@ -1,8 +1,14 @@
 @import "@wordpress/base-styles/breakpoints";
 @import "@wordpress/base-styles/mixins";
 
-.licenses-overview .search {
-	box-shadow: 0 0 0 1px var(--color-neutral-5);
+.licenses-overview {
+	.a4a-layout__body {
+		padding-block-start: 32px;
+	}
+
+	.search {
+		box-shadow: 0 0 0 1px var(--color-neutral-5);
+	}
 }
 
 .licenses-overview__empty-message {