This commit is contained in:
2026-07-16 18:14:32 +02:00
parent 360dc1db06
commit fc237ab71a
4 changed files with 35 additions and 3 deletions

View File

@@ -1815,6 +1815,25 @@ body.layout-modern .global-sidebar-right {
grid-column: 1;
}
/* Body-level left-sidebar hide — set by blocking inline script before first paint
to prevent the sidebar from flashing visible. Mirrors the .sidebar-hidden rules above
but activates from the body class so it works before the container element exists. */
body.layout-modern.sidebar-left-hidden .item-layout-container {
grid-template-columns: minmax(0, 1fr) 400px;
}
body.layout-modern.sidebar-left-hidden.sidebar-right-hidden .item-layout-container {
grid-template-columns: 1fr;
}
body.layout-modern.sidebar-left-hidden .item-layout-container .item-sidebar-left {
display: none;
}
body.layout-modern.sidebar-left-hidden .item-layout-container .item-main-content {
grid-column: 1;
}
body.layout-modern .item-sidebar-right,
body.layout-modern .global-sidebar-right {
grid-column: 3;
@@ -5440,13 +5459,14 @@ span#tags:not(.tags-expanded) .tags-inner>span:nth-child(n+11) {
} */
/* layout-modern: both sidebar AND comments visible — column is narrow, full 16:9 fits */
body.layout-modern:not(.sidebar-right-hidden) .item-layout-container:not(.sidebar-hidden) .embed-responsive-16by9::before {
body.layout-modern:not(.sidebar-right-hidden):not(.sidebar-left-hidden) .item-layout-container:not(.sidebar-hidden) .embed-responsive-16by9::before {
padding-top: 54.25%;
}
/* layout-modern: either sidebar OR comments hidden (or both) — column is wider, reduce */
body.layout-modern.sidebar-right-hidden .embed-responsive-16by9::before,
body.layout-modern .item-layout-container.sidebar-hidden .embed-responsive-16by9::before {
body.layout-modern .item-layout-container.sidebar-hidden .embed-responsive-16by9::before,
body.layout-modern.sidebar-left-hidden .embed-responsive-16by9::before {
padding-top: 40.25%;
}
}

View File

@@ -41,6 +41,9 @@ class CommentSystem {
};
// Restore visibility state
// The body class 'sidebar-left-hidden' is already set by the blocking
// inline script in header.html (prevents flash). Here we sync the
// container-level class and display state to match.
if (this.container) {
const isHidden = localStorage.getItem('comments_hidden') === 'true';
// Force show if hash is present
@@ -48,9 +51,13 @@ class CommentSystem {
this.container.classList.remove('faded-out');
this.container.style.display = 'block';
localStorage.setItem('comments_hidden', 'false');
document.body.classList.remove('sidebar-left-hidden');
const layout = this.container.closest('.item-layout-container');
if (layout) layout.classList.remove('sidebar-hidden');
} else if (isHidden) {
this.container.classList.add('faded-out');
this.container.style.display = 'none';
document.body.classList.add('sidebar-left-hidden');
const layout = this.container.closest('.item-layout-container');
if (layout) layout.classList.add('sidebar-hidden');
}
@@ -3784,6 +3791,7 @@ class CommentSystem {
if (isHidden) {
// SHOW: expand grid first, then slide content in
if (layout) layout.classList.remove('sidebar-hidden');
document.body.classList.remove('sidebar-left-hidden');
this.container.style.display = '';
localStorage.setItem('comments_hidden', 'false');
void this.container.offsetWidth; // force reflow so transition fires
@@ -3798,6 +3806,7 @@ class CommentSystem {
if (!this.container.classList.contains('faded-out')) return;
this.container.style.display = 'none';
if (layout) layout.classList.add('sidebar-hidden');
document.body.classList.add('sidebar-left-hidden');
}, 300);
}
}

View File

@@ -6618,6 +6618,7 @@ window.cancelAnimFrame = (function () {
sb.style.setProperty('transition', 'none', 'important');
if (isHidden) {
layout.classList.remove('sidebar-hidden');
document.body.classList.remove('sidebar-left-hidden');
sb.style.display = '';
sb.querySelectorAll('.faded-out').forEach(el => el.classList.remove('faded-out'));
const c = sb.querySelector('#comments-container');
@@ -6643,11 +6644,13 @@ window.cancelAnimFrame = (function () {
if (shouldOpen) {
sb.style.removeProperty('transform');
localStorage.setItem('comments_hidden', 'false');
document.body.classList.remove('sidebar-left-hidden');
} else {
// Hide BEFORE removing transform to prevent snap-back flash
sb.style.display = 'none';
layout.classList.add('sidebar-hidden');
localStorage.setItem('comments_hidden', 'true');
document.body.classList.add('sidebar-left-hidden');
sb.style.removeProperty('transform');
}
requestAnimationFrame(() => syncLeftEdgeZone());