From 46c38ad75da1c2388f43e26f6817cc9206119bf2 Mon Sep 17 00:00:00 2001 From: Mikhaela Tapia Date: Tue, 14 Oct 2025 22:25:04 +0800 Subject: [PATCH] add fix for content width wide --- src/styles/block.scss | 2 ++ src/styles/editor-block.scss | 3 ++- 2 files changed, 4 insertions(+), 1 deletion(-) diff --git a/src/styles/block.scss b/src/styles/block.scss index fc819b3d2..9e717792f 100644 --- a/src/styles/block.scss +++ b/src/styles/block.scss @@ -67,6 +67,8 @@ } @include desktop-tablet { .stk-block:is(.aligncenter, .alignwide, .alignfull) > .stk-content-align.alignwide, + // Dev note: add selector for carousel because it has an extra wrapper before the inner blocks. + .stk-block-carousel:is(.aligncenter, .alignwide, .alignfull) > :where(.stk-block-carousel__content-wrapper) > .stk-content-align.alignwide, .stk-block .stk-block.alignwide { // --stk-block-default-width is a Stackable setting // --stk-block-width-default-detected is from the fallback autodetected value. diff --git a/src/styles/editor-block.scss b/src/styles/editor-block.scss index a58ad8ff4..622bab6f0 100644 --- a/src/styles/editor-block.scss +++ b/src/styles/editor-block.scss @@ -113,7 +113,8 @@ } :where(:is(.stk-preview-device-desktop, .stk-preview-device-tablet) [data-type^="stackable/"]:is([data-align="wide"], [data-align="full"]) > .stk-block > .stk-inner-blocks.alignwide), -:where(:is(.stk-preview-device-desktop, .stk-preview-device-tablet) [data-type^="stackable/"]:is([data-align="wide"], [data-align="full"]) [data-type^="stackable/"][data-align="wide"]) { +:where(:is(.stk-preview-device-desktop, .stk-preview-device-tablet) [data-type^="stackable/"]:is([data-align="wide"], [data-align="full"]) [data-type^="stackable/"][data-align="wide"]), +:where(:is(.stk-preview-device-desktop, .stk-preview-device-tablet) [data-type^="stackable/"]:is([data-align="wide"], [data-align="full"]) > .stk-block-carousel > :where(.stk-block-carousel__content-wrapper) > .stk-inner-blocks.alignwide) { // --stk-block-default-width is a Stackable setting // --stk-block-width-default-detected is from the fallback autodetected value. max-width: var(--stk-block-wide-width, var(--stk-block-width-wide-detected, calc(80vw - 280px))) !important; // Make way for the inspector