fdsa
This commit is contained in:
@@ -503,7 +503,7 @@
|
|||||||
</div>
|
</div>
|
||||||
<span class="comment-time timeago" tooltip="${fullDate}" style="font-size: 0.75em;"${tsAttr}>${timeStr}</span>
|
<span class="comment-time timeago" tooltip="${fullDate}" style="font-size: 0.75em;"${tsAttr}>${timeStr}</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="comment-content"><div class="comment-content-inner">${displayContent}${attachmentsHtml}${pollHtml}</div><button class="read-more-btn">${window.f0ckI18n?.sidebar_read_more || 'read more'}</button></div>
|
<div class="comment-content has-overflow"><div class="comment-content-inner">${displayContent}${attachmentsHtml}${pollHtml}</div><button class="read-more-btn" style="display:block">${window.f0ckI18n?.sidebar_read_more || 'read more'}</button></div>
|
||||||
${itemPreview}
|
${itemPreview}
|
||||||
</div>
|
</div>
|
||||||
</div>`;
|
</div>`;
|
||||||
@@ -544,10 +544,12 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
if (scrollHeight > clientHeight + 2) { // 2px buffer for rounding
|
if (scrollHeight > clientHeight + 2) { // 2px buffer for rounding
|
||||||
|
// Content overflows — ensure clamped state (may already be set from HTML default)
|
||||||
btn.style.display = 'block';
|
btn.style.display = 'block';
|
||||||
btn.textContent = window.f0ckI18n?.sidebar_read_more || 'read more';
|
btn.textContent = window.f0ckI18n?.sidebar_read_more || 'read more';
|
||||||
container.classList.add('has-overflow');
|
container.classList.add('has-overflow');
|
||||||
} else {
|
} else {
|
||||||
|
// Content fits — remove the default-on clamped state
|
||||||
btn.style.display = 'none';
|
btn.style.display = 'none';
|
||||||
container.classList.remove('has-overflow');
|
container.classList.remove('has-overflow');
|
||||||
}
|
}
|
||||||
@@ -611,12 +613,11 @@
|
|||||||
container.appendChild(ioSentinel);
|
container.appendChild(ioSentinel);
|
||||||
}
|
}
|
||||||
attachMediaLoadListeners(container);
|
attachMediaLoadListeners(container);
|
||||||
// Defer overflow check until after the browser has performed layout on the
|
// has-overflow is set by default in the HTML template so long comments are clamped
|
||||||
// newly-injected innerHTML — a synchronous call here fires before paint so
|
// from the first paint. Reading scrollHeight inside checkOverflow forces a synchronous
|
||||||
// scrollHeight === clientHeight, causing has-overflow to be stripped and the
|
// reflow, so this call immediately removes has-overflow from short comments before
|
||||||
// "read more" button to flash away. Double-rAF guarantees we measure after
|
// anything is painted — no rAF deferral needed.
|
||||||
// the first layout/paint cycle.
|
checkOverflow();
|
||||||
requestAnimationFrame(() => requestAnimationFrame(() => checkOverflow()));
|
|
||||||
fetchSidebarYoutubeTitles(container);
|
fetchSidebarYoutubeTitles(container);
|
||||||
// Auto-play converted GIF videos and webm emoji stickers
|
// Auto-play converted GIF videos and webm emoji stickers
|
||||||
container.querySelectorAll('video.autoplay-gif').forEach(v => { v.autoplay = true; v.muted = true; v.play().catch(() => { v.addEventListener('canplay', () => v.play().catch(() => { }), { once: true }); }); });
|
container.querySelectorAll('video.autoplay-gif').forEach(v => { v.autoplay = true; v.muted = true; v.play().catch(() => { v.addEventListener('canplay', () => v.play().catch(() => { }), { once: true }); }); });
|
||||||
|
|||||||
Reference in New Issue
Block a user