From c728436d29a28259f688e82abf41ebf1153f0aa9 Mon Sep 17 00:00:00 2001 From: Christian Gastrell Date: Mon, 16 Mar 2026 17:54:06 -0300 Subject: [PATCH 1/3] AI Client: Fix modal header spacing and make it sticky The modal header used -32px negative margins that didn't match the actual modal padding, causing misalignment. Update to -24px to match the WordPress Modal component's content padding. Replace the separate
divider element with a border-bottom on the header itself, and make the header sticky so it remains visible when modal content scrolls. Co-Authored-By: Claude Opus 4.6 (1M context) --- .../ai-client/src/components/modal/index.tsx | 1 - .../ai-client/src/components/modal/style.scss | 16 +++++++--------- 2 files changed, 7 insertions(+), 10 deletions(-) diff --git a/projects/js-packages/ai-client/src/components/modal/index.tsx b/projects/js-packages/ai-client/src/components/modal/index.tsx index dfc014790f8e..e56e1a340ce3 100644 --- a/projects/js-packages/ai-client/src/components/modal/index.tsx +++ b/projects/js-packages/ai-client/src/components/modal/index.tsx @@ -57,7 +57,6 @@ export default function AiAssistantModal( { >
-
{ children }
diff --git a/projects/js-packages/ai-client/src/components/modal/style.scss b/projects/js-packages/ai-client/src/components/modal/style.scss index 139e002b3dd9..9da174285abd 100644 --- a/projects/js-packages/ai-client/src/components/modal/style.scss +++ b/projects/js-packages/ai-client/src/components/modal/style.scss @@ -16,16 +16,14 @@ &__header { display: flex; justify-content: space-between; - margin-right: -32px; - margin-left: -32px; - margin-top: -32px; + margin-right: -24px; + margin-left: -24px; + margin-top: -24px; padding: 8px 12px; - } - - &__divider { - background: #dcdcde; - margin: 0 -32px; - height: 1px; + position: sticky; + top: -24px; + background: #fff; + border-bottom: 1px solid #dcdcde; } &__title-wrapper { From fe35b06f2460e618adf98f9dbf81cb166d17fb0f Mon Sep 17 00:00:00 2001 From: Christian Gastrell Date: Mon, 16 Mar 2026 17:57:18 -0300 Subject: [PATCH 2/3] Jetpack: Align AI modal consumer spacing with updated modal padding Update negative margin and padding values from -32px to -24px in the feedback suggestion and title optimization footer components to match the corrected modal content padding from the ai-client package. Co-Authored-By: Claude Opus 4.6 (1M context) --- .../ai-assistant-plugin/components/feedback/style.scss | 4 ++-- .../components/title-optimization/style.scss | 10 +++++----- 2 files changed, 7 insertions(+), 7 deletions(-) diff --git a/projects/plugins/jetpack/extensions/plugins/ai-assistant-plugin/components/feedback/style.scss b/projects/plugins/jetpack/extensions/plugins/ai-assistant-plugin/components/feedback/style.scss index f8e6acc8670e..b1920de51a17 100644 --- a/projects/plugins/jetpack/extensions/plugins/ai-assistant-plugin/components/feedback/style.scss +++ b/projects/plugins/jetpack/extensions/plugins/ai-assistant-plugin/components/feedback/style.scss @@ -1,8 +1,8 @@ .ai-assistant-post-feedback { &__suggestion { - padding: 18px 0; - margin-bottom: -32px; + padding: 8px 0; + margin-bottom: -16px; ul, ol { diff --git a/projects/plugins/jetpack/extensions/plugins/ai-assistant-plugin/components/title-optimization/style.scss b/projects/plugins/jetpack/extensions/plugins/ai-assistant-plugin/components/title-optimization/style.scss index 72ba6961cd26..91eb812231f4 100644 --- a/projects/plugins/jetpack/extensions/plugins/ai-assistant-plugin/components/title-optimization/style.scss +++ b/projects/plugins/jetpack/extensions/plugins/ai-assistant-plugin/components/title-optimization/style.scss @@ -26,11 +26,11 @@ &__footer { display: flex; justify-content: flex-start; - margin-right: -32px; - margin-left: -32px; - margin-top: 32px; - margin-bottom: -32px; - padding: 20px 32px; + margin-right: -24px; + margin-left: -24px; + margin-top: 24px; + margin-bottom: -24px; + padding: 20px 24px; border-top: solid 1px #dcdcde; height: 60px; } From e7371868dd776eb2421ae3a04e3c5f6661169438 Mon Sep 17 00:00:00 2001 From: GitHub Actions Date: Mon, 16 Mar 2026 21:16:29 +0000 Subject: [PATCH 3/3] Add changelog entries. --- projects/js-packages/ai-client/changelog/pr-47616 | 4 ++++ projects/plugins/jetpack/changelog/pr-47616 | 4 ++++ 2 files changed, 8 insertions(+) create mode 100644 projects/js-packages/ai-client/changelog/pr-47616 create mode 100644 projects/plugins/jetpack/changelog/pr-47616 diff --git a/projects/js-packages/ai-client/changelog/pr-47616 b/projects/js-packages/ai-client/changelog/pr-47616 new file mode 100644 index 000000000000..562b59fddd42 --- /dev/null +++ b/projects/js-packages/ai-client/changelog/pr-47616 @@ -0,0 +1,4 @@ +Significance: patch +Type: fixed + +AI Assistant: Fix modal shaking when content streams in by correcting header margins and making the header sticky. diff --git a/projects/plugins/jetpack/changelog/pr-47616 b/projects/plugins/jetpack/changelog/pr-47616 new file mode 100644 index 000000000000..2c536f600a1f --- /dev/null +++ b/projects/plugins/jetpack/changelog/pr-47616 @@ -0,0 +1,4 @@ +Significance: patch +Type: bugfix + +AI Assistant: Fix modal shaking when content streams in by correcting header margins and making the header sticky.