Админ панель доставляла мне неудобство некоторое время. Общественный сайт в конце концов выглядел как мой, зелёный, гора, всё это, и потом я бы нажал в админ площадь писать пост и это было как входить в другой веб-сайт. Общий панель, никакого персонажа, твёрдый визуальный разрыв между моим сайтом и инструментом я использую это запустить. Я хотел входить в админ чувствовать как то же самое место, просто с разными вещами в боковой панели.
Честная причина это было два различных вида что я построил их как две различные оболочки. Общественный макет нарисовал боковую панель и фон и читающий панель, и админ выбросил всё то и нарисовал его собственный простой вариант. Так шаг один был тянуть оболочку вне в компонент что оба использовали. Это берёт nav ссылки как пропс, и то в основном единственная вещь что отличается между ними.
<!-- both public and admin render this now -->
<SiteShell {nav} {account} wide={isAdmin}>
{@render children()}
</SiteShell>Общество проходит его главная, тегов, архив ссылки, админ проходит панель, посты, комментарии и так далее. Одинаковый фон, одинаковые матовые панели, одинаковые рельс. Теперь единственная вещь что изменяется когда ты пересекаешь в админ какой ссылки в боковой панели, что в точности что я было после.
Было одно что я был осторожен около. Я не хотел полностью сварить админ к общественному сайту, потому что в какой-то момент я мог бы хотел переместить админ куда-то больше заперто для причин безопасности, это собственный поддомен или это собственное развёртывание. Так разделённая часть только внешний вид. Админ всё ещё имеет это собственный группа маршрута и это собственный охранник auth, оба нетронуты. Разделённая оболочка это глупая визуальная обёртка что не знает или не забочусь ли это показывает общественный сайт или админ. Шов всё ещё там где оно имеет значение, оно просто невидимо теперь.
Потом редактор. Редактор markdown это CodeMirror, и я никогда не давал это теме действительно, так оно сидит там в это дефолт легкий вид несоответствие того что остаток сайта делается. В тёмном режиме это яркий белый ящик в середине тёмной страницы. Не хорошо. Я дал это надлежащему темнику в цветах сайта, но мой первый попробуй только выбрал тему один раз, когда оно загружалось:
// wrong: theme is set once and never follows the light/dark toggle
new EditorView({ extensions: [markdown(), myTheme] });Щёлкни сайт в тёмное и редактор остался упрямо лёгкий. CodeMirror держит его конфиг внутри состояния редактора, так ты не можешь просто переприсвоить переменную, ты должен дать это переконфигурировать. Исправление это положить тему в камеру и обменять оно когда бы ни когда сайт тема изменяется:
const themeComp = new Compartment();
// ...extensions: [markdown(), themeComp.of(lightTheme)]
view.dispatch({ effects: themeComp.reconfigure(isDark ? darkTheme : lightTheme) });Теперь оно следует переключению, тёмный редактор в тёмном режиме, и письменная поверхность твёрдая так гора не показывает через фактический текстовый ящик пока я печатаю в нём. Что я, прямо теперь, писать это.