From 1dd9af3b493cd1eda72b2d5b54542aa7100b3326 Mon Sep 17 00:00:00 2001
From: akasunil <sdprajapati999@gmail.com>
Date: Wed, 25 Sep 2024 12:52:43 +0530
Subject: [PATCH] Update grid view design for grid view

---
 .../src/components/dataviews-item-actions/index.tsx         | 2 +-
 packages/dataviews/src/dataviews-layouts/grid/index.tsx     | 6 +++++-
 packages/dataviews/src/dataviews-layouts/grid/style.scss    | 2 +-
 packages/dataviews/src/dataviews-layouts/table/style.scss   | 1 +
 packages/edit-site/src/components/page-patterns/style.scss  | 6 ++++++
 5 files changed, 14 insertions(+), 3 deletions(-)

diff --git a/packages/dataviews/src/components/dataviews-item-actions/index.tsx b/packages/dataviews/src/components/dataviews-item-actions/index.tsx
index e33cb0fe56d0ed..bad48e122c17e5 100644
--- a/packages/dataviews/src/components/dataviews-item-actions/index.tsx
+++ b/packages/dataviews/src/components/dataviews-item-actions/index.tsx
@@ -248,7 +248,7 @@ function CompactItemActions< Item >( {
 		<DropdownMenuV2
 			trigger={
 				<Button
-					size="compact"
+					size="small"
 					icon={ moreVertical }
 					label={ __( 'Actions' ) }
 					accessibleWhenDisabled
diff --git a/packages/dataviews/src/dataviews-layouts/grid/index.tsx b/packages/dataviews/src/dataviews-layouts/grid/index.tsx
index 230ffe0dc50b5c..5b5771ab560016 100644
--- a/packages/dataviews/src/dataviews-layouts/grid/index.tsx
+++ b/packages/dataviews/src/dataviews-layouts/grid/index.tsx
@@ -95,8 +95,12 @@ function GridItem< Item >( {
 			<HStack
 				justify="space-between"
 				className="dataviews-view-grid__title-actions"
+				alignment="top"
 			>
-				<HStack className="dataviews-view-grid__primary-field">
+				<HStack
+					className="dataviews-view-grid__primary-field"
+					alignment="top"
+				>
 					{ renderedPrimaryField }
 				</HStack>
 				<ItemActions item={ item } actions={ actions } isCompact />
diff --git a/packages/dataviews/src/dataviews-layouts/grid/style.scss b/packages/dataviews/src/dataviews-layouts/grid/style.scss
index 6286ed94685a04..40e0188da6ac01 100644
--- a/packages/dataviews/src/dataviews-layouts/grid/style.scss
+++ b/packages/dataviews/src/dataviews-layouts/grid/style.scss
@@ -16,7 +16,7 @@
 		}
 
 		.dataviews-view-grid__primary-field {
-			min-height: $grid-unit-40; // Preserve layout when there is no ellipsis button
+			min-height: $grid-unit-30; // Preserve layout when there is no ellipsis button
 		}
 
 		&.is-selected {
diff --git a/packages/dataviews/src/dataviews-layouts/table/style.scss b/packages/dataviews/src/dataviews-layouts/table/style.scss
index ea2c614e4339df..d955a6c4c2f99e 100644
--- a/packages/dataviews/src/dataviews-layouts/table/style.scss
+++ b/packages/dataviews/src/dataviews-layouts/table/style.scss
@@ -162,6 +162,7 @@
 
 	.dataviews-view-table__actions-column {
 		width: 1%;
+		vertical-align: middle;
 	}
 
 	&:has(tr.is-selected) {
diff --git a/packages/edit-site/src/components/page-patterns/style.scss b/packages/edit-site/src/components/page-patterns/style.scss
index a9b1c3b5a87cf6..2b954a1b5e8c49 100644
--- a/packages/edit-site/src/components/page-patterns/style.scss
+++ b/packages/edit-site/src/components/page-patterns/style.scss
@@ -110,6 +110,12 @@
 		-webkit-line-clamp: 2;
 		-webkit-box-orient: vertical;
 		white-space: normal;
+		padding-top: 3px;
+		align-self: start;
+	}
+
+	.edit-site-patterns__pattern-lock-icon {
+		align-self: start;
 	}
 }