Особенности работы с полной шириной темы и #reply-control на 100%

Привет! Я заметил, что мои пользователи очень не любят широкие поля слева и справа, которые по умолчанию использует Discourse. Поэтому я использовал GitHub - programmersforum-reborn/discourse-wide-posts: Increases post width · GitHub в сочетании с этими дополнительными правками CSS:

:root {
    --d-max-width: 1900px;
    --topic-body-width: 1244px;
}

Недавнее обновление Discourse, похоже, сломало GitHub - programmersforum-reborn/discourse-wide-posts: Increases post width · GitHub, и панель редактора на всю ширину уходила за левый край экрана. Поэтому я отключил discourse-wide-posts и установил GitHub - discourse/discourse-full-width-component: Make Discourse occupy the full browser width · GitHub, который уменьшает только левое поле, плюс эти правки CSS для уменьшения правого поля и чтобы сделать панель редактора на всю ширину:

body.has-sidebar-page #reply-control.show-preview:not(.fullscreen), #reply-control {
    max-width: 100%;
    margin-left: 0;
}
:root {
    --d-max-width: 1900px;
    --topic-body-width: 1244px;
}

Но есть несколько странностей. Большинство из них можно воспроизвести здесь, на Discourse Meta, с темой Default (full-width) или Fully Theme.

Во-первых, без упомянутых выше правок CSS для #reply-control панель прыгает в зависимости от уровня масштабирования:





Кроме того, при нормальном уровне масштабирования div sidebar-wrapper подстраивает свою высоту под высоту панели редактора ниже, но при определенной ширине окна браузера что-то меняется, и он начинает обрезаться без возможности прокрутки до низа боковой панели (проверьте ширину изображения скриншота, чтобы примерно понять, где это происходит):




Наконец, с правилом --topic-body-width: 1244px; при просмотре темы элементы боковой панели сдвигаются вверх во время загрузки новой порции сообщений в длинных темах при переключении на другую позицию в ползунке временной шкалы сообщений, а затем возвращаются на свои обычные места после завершения загрузки. Это довольно отвлекает, и, похоже, это началось после этого обновления, которое потребовало от меня пересобрать мои настройки ширины. Если я изменю правило CSS на --topic-body-width: 100%;, то элементы боковой панели остаются на месте во время сдвигов временной шкалы, но во время появления вращающегося индикатора загрузки временная шкала сдвигается влево (вероятно, к стандартной ширине --topic-body-width Discourse?), а затем резко возвращается на свое обычное место ближе к правому краю. Есть ли какое-то решение? Возможно, правило ширины, которое можно добавить к вращающемуся индикатору загрузки? Я не могу отследить его с помощью инспектора HTML, так как это происходит слишком быстро.

Пожалуйста, дайте знать, если вам понадобится дополнительная информация для отладки. Спасибо!

1 лайк