diff --git a/src/block/accordion/style.scss b/src/block/accordion/style.scss index 7d6f7c8b7..c925e1594 100644 --- a/src/block/accordion/style.scss +++ b/src/block/accordion/style.scss @@ -99,6 +99,12 @@ transform: translateY(25px); opacity: 0; } + + // Prevent inside columns from being re-ordered when a parent column block + // has custom ordering. + > .stk-block-column { + order: initial !important; + } } // This is for the column hack. Remove margin for the wrapper div if accordion is inside a columns block diff --git a/src/block/columns/style.scss b/src/block/columns/style.scss index 7587a52ad..b72632aaf 100644 --- a/src/block/columns/style.scss +++ b/src/block/columns/style.scss @@ -15,6 +15,16 @@ margin-right: auto; } +// Add a 0 specificity style to set the default column order. This is to prevent +// the column order from spilling to nested blocks. +// Target the stk-column-wrapper to also include blocks with column innerblocks +// but are not columns (no stk-block-columns), like accordion and horizontal scroller. +:where(.stk-block-columns) { + @for $i from 1 through 20 { + --stk-col-order-#{ $i }: #{ $i }; + } +} + // Column order. @for $i from 1 through 20 { .stk-block-column:nth-child(#{ $i }) {