From 359d82fb0519737c2bf0e4e9fabd41fe8ac2f180 Mon Sep 17 00:00:00 2001 From: Ricardo Espinoza Date: Fri, 24 Jul 2026 10:59:37 -0400 Subject: [PATCH] fix(editor): Center empty state content vertically on short viewports (#34820) --- .../src/app/components/layouts/EmptyStateLayout.vue | 12 +++--------- 1 file changed, 3 insertions(+), 9 deletions(-) diff --git a/packages/frontend/editor-ui/src/app/components/layouts/EmptyStateLayout.vue b/packages/frontend/editor-ui/src/app/components/layouts/EmptyStateLayout.vue index d8135848e43..4dc17a2fac6 100644 --- a/packages/frontend/editor-ui/src/app/components/layouts/EmptyStateLayout.vue +++ b/packages/frontend/editor-ui/src/app/components/layouts/EmptyStateLayout.vue @@ -96,7 +96,6 @@ const handleAppSelectionContinue = () => { :class="[ $style.emptyStateLayout, { - [$style.noTemplatesContent]: !showAppSelection, [$style.builderLayout]: showAppSelection, }, ]" @@ -219,22 +218,17 @@ const handleAppSelectionContinue = () => { justify-content: center; align-content: center; height: 100%; - padding: var(--spacing--4xl) var(--spacing--2xl) 0; + // Vertical padding must stay symmetric so justify-content centers the content + padding: 0 var(--spacing--2xl); max-width: var(--content-container--width); width: 100%; @media (max-width: vars.$breakpoint-lg) { - padding: var(--spacing--xl) var(--spacing--xs) 0; - } - - &.noTemplatesContent { - padding-top: var(--spacing--3xl); + padding: 0 var(--spacing--xs); } &.builderLayout { align-items: center; - justify-content: center; - width: 100%; max-width: none; padding: var(--spacing--lg); }