From 1302e258347ee0a43cc45fa0e6c76f7418c20e61 Mon Sep 17 00:00:00 2001 From: Kelsey Goldwein Date: Thu, 21 May 2026 13:50:26 -0400 Subject: [PATCH 1/6] panorama fix for tagged pages #1785 --- src/features/panorama/index.js | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/src/features/panorama/index.js b/src/features/panorama/index.js index 28cfa299ef..87c0ce8642 100644 --- a/src/features/panorama/index.js +++ b/src/features/panorama/index.js @@ -21,7 +21,7 @@ const aspectRatioVar = '--xkit-panorama-aspect-ratio'; const mainContentWrapper = `${keyToCss('mainContentWrapper')}:not(${keyToCss('mainContentIsMasonry', 'mainContentIsFullWidth')})`; -const mainPostColumn = `main${keyToCss('postColumn', 'postsColumn')}`; +const mainPostColumn = `main${keyToCss('postColumn', 'postsColumn', 'mainColumnContainer')}`; const patioPostColumn = `[id]${keyToCss('columnWide')}`; const mainStyleElement = buildStyle(` @@ -45,6 +45,9 @@ ${keyToCss('queueSettings')} { ${mainPostColumn} > ${keyToCss('tabsHeader')} + ${keyToCss('container')} { max-width: unset; } +${mainPostColumn} > ${keyToCss('postColumn')} { + max-width: unset; +} `); mainStyleElement.media = `(min-width: ${widenDashMinWidth}px)`; From 6d9314936acdf8bf50272dd3dce425068cec764b Mon Sep 17 00:00:00 2001 From: Kelsey Goldwein Date: Thu, 21 May 2026 14:26:32 -0400 Subject: [PATCH 2/6] panorama fix for liked feed #1785 --- src/features/panorama/index.js | 13 +++++++++++++ 1 file changed, 13 insertions(+) diff --git a/src/features/panorama/index.js b/src/features/panorama/index.js index 87c0ce8642..f6226e2700 100644 --- a/src/features/panorama/index.js +++ b/src/features/panorama/index.js @@ -48,6 +48,19 @@ ${mainPostColumn} > ${keyToCss('tabsHeader')} + ${keyToCss('container')} { ${mainPostColumn} > ${keyToCss('postColumn')} { max-width: unset; } + +${mainContentWrapper}:has(> div > div > div > ${keyToCss('timeline')}) { + flex-grow: 1; +} +${mainContentWrapper} > div:has(> div > div > ${keyToCss('timeline')}) { + max-width: unset; +} +${mainContentWrapper} > div > div:has(> div > ${keyToCss('timeline')}) { + max-width: unset; +} +${mainContentWrapper} > div > div > div:has(> ${keyToCss('timeline')}) { + max-width: unset; +} `); mainStyleElement.media = `(min-width: ${widenDashMinWidth}px)`; From c1f0bcebd91a6fda3b28e229c031075b17e74bb5 Mon Sep 17 00:00:00 2001 From: Kelsey Goldwein Date: Thu, 21 May 2026 18:24:46 -0400 Subject: [PATCH 3/6] set max post width on liked page --- src/features/panorama/index.js | 1 + 1 file changed, 1 insertion(+) diff --git a/src/features/panorama/index.js b/src/features/panorama/index.js index f6226e2700..6e0858315f 100644 --- a/src/features/panorama/index.js +++ b/src/features/panorama/index.js @@ -51,6 +51,7 @@ ${mainPostColumn} > ${keyToCss('postColumn')} { ${mainContentWrapper}:has(> div > div > div > ${keyToCss('timeline')}) { flex-grow: 1; + max-width: calc(var(${maxPostWidthVar}) + ${sidebarOffset}px); } ${mainContentWrapper} > div:has(> div > div > ${keyToCss('timeline')}) { max-width: unset; From 9dc7d0e4124e912e4eea6ebb6d03063b54419f09 Mon Sep 17 00:00:00 2001 From: Kelsey Goldwein Date: Thu, 21 May 2026 19:06:23 -0400 Subject: [PATCH 4/6] panorama fix for communities feed #1785 --- src/features/panorama/index.js | 7 +++++++ 1 file changed, 7 insertions(+) diff --git a/src/features/panorama/index.js b/src/features/panorama/index.js index 6e0858315f..35778630ea 100644 --- a/src/features/panorama/index.js +++ b/src/features/panorama/index.js @@ -62,6 +62,13 @@ ${mainContentWrapper} > div > div:has(> div > ${keyToCss('timeline')}) { ${mainContentWrapper} > div > div > div:has(> ${keyToCss('timeline')}) { max-width: unset; } + +${keyToCss('grid')}:has(${keyToCss('layoutBody')}) { + grid-template-columns: 1fr auto; +} +${keyToCss('grid')} ${keyToCss('layoutBody')} { + max-width: var(${maxPostWidthVar}); +} `); mainStyleElement.media = `(min-width: ${widenDashMinWidth}px)`; From 48a27f5ce2282e4ad8e316dc188b1b0272c219f1 Mon Sep 17 00:00:00 2001 From: theIncandescentAnteater <59981704+theIncandescentAnteater@users.noreply.github.com> Date: Thu, 21 May 2026 21:26:32 -0400 Subject: [PATCH 5/6] child selector for layoutbody Co-authored-by: marcustyphoon --- src/features/panorama/index.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/features/panorama/index.js b/src/features/panorama/index.js index 35778630ea..d1f7a30509 100644 --- a/src/features/panorama/index.js +++ b/src/features/panorama/index.js @@ -63,7 +63,7 @@ ${mainContentWrapper} > div > div > div:has(> ${keyToCss('timeline')}) { max-width: unset; } -${keyToCss('grid')}:has(${keyToCss('layoutBody')}) { +${keyToCss('grid')}:has(> ${keyToCss('layoutBody')}) { grid-template-columns: 1fr auto; } ${keyToCss('grid')} ${keyToCss('layoutBody')} { From 5c05c861bcfdb08aec531c62bb86fdf7bccb9bd8 Mon Sep 17 00:00:00 2001 From: Kelsey Goldwein Date: Sat, 23 May 2026 17:41:56 -0400 Subject: [PATCH 6/6] put community feed in flex rather than grid to match other pages --- src/features/panorama/index.js | 15 ++++++++++++--- 1 file changed, 12 insertions(+), 3 deletions(-) diff --git a/src/features/panorama/index.js b/src/features/panorama/index.js index 35778630ea..7f5ef8a128 100644 --- a/src/features/panorama/index.js +++ b/src/features/panorama/index.js @@ -63,12 +63,21 @@ ${mainContentWrapper} > div > div > div:has(> ${keyToCss('timeline')}) { max-width: unset; } -${keyToCss('grid')}:has(${keyToCss('layoutBody')}) { - grid-template-columns: 1fr auto; +${keyToCss('mainContentWrapper')}:has(> div > div > ${keyToCss('grid')}) { + flex-grow: 1; + max-width: calc(var(${maxPostWidthVar}) + ${sidebarOffset}px); } -${keyToCss('grid')} ${keyToCss('layoutBody')} { +${keyToCss('mainContentWrapper')} > div > div > ${keyToCss('grid')}:has(> ${keyToCss('layoutBody')}) { + display: flex; +} +${keyToCss('mainContentWrapper')} > div > div > ${keyToCss('grid')} > ${keyToCss('layoutBody')} { max-width: var(${maxPostWidthVar}); } +${keyToCss('mainContentWrapper')} > div > div > ${keyToCss('grid')} > ${keyToCss('sidebar')} { + width: auto; + min-width: 256px; + max-width: 320px; +} `); mainStyleElement.media = `(min-width: ${widenDashMinWidth}px)`;