Редизайн сообщества

На modx.pro обновили интерфейс сообщества: v2, тёмная тема и доработки поиска. Ниже — что поменялось и куда писать, если что-то поехало.



Интерфейс v2

Перекрасили оболочку и основные экраны:

  • лента, карточки топиков, страница заметки, комментарии;
  • разделы, пользователи, профиль, вход и регистрация;
  • поиск, «О нас», страницы ошибок;
  • общие пустые состояния и пагинация;
  • одни CSS-токены --v2-* вместо цветов, размазанных по шаблонам.
Читать должно быть проще, на телефоне ничего не прилипает к краям, лишний визуальный шум убрали.

Тёмная тема

Переключатель в шапке. Выбор лежит в localStorage. При первом заходе подхватываем prefers-color-scheme из системы.

  • инициализация в <head>, без белой вспышки при загрузке;
  • токены темы подключаются до отрисовки страницы;
  • Ya-share, Bootstrap-модалки, MarkItUp, Prism и утилиты Bootstrap сидят на общих переменных;
  • подтянули контраст: кнопки, рейтинг, чекбоксы, тултип голосов, футер на всю ширину экрана.
Поиск

  • сортировка: релевантность или дата;
  • вес результата виден только при сортировке по релевантности;
  • совпадения в заголовке и сниппете подсвечиваются красным #b91c1c, не только жирным.
Мелочи, которые тоже поправили

  • «Наверх»: клик и по левой полосе, и по кнопке; логотип в шапке не перекрывается;
  • закрытие фото в lightbox: кликабелен весь круг, не только крестик;
  • ветки комментариев: убрали точки вложенности, урезали отступ на длинных тредах;
  • ссылки на пакеты Modstore в сайдбаре ведут на канонические URL;
  • фильтры пользователей и подписка на комментарии: свои чекбоксы v2 вместо синего Bootstrap.


Нашли баг?

Комментарий к этому топику. Чем точнее опишете, тем быстрее разберусь.

Напишите:

  • URL или шаги воспроизведения;
  • браузер и ОС;
  • светлая или тёмная тема;
  • скрин или запись экрана, если есть;
  • что ждали и что увидели.
Сейчас работаю над допиливанием отображением статей
Иван Бочкарев
Иван Бочкарев
Вчера в 17:19
modx.pro
443
Поблагодарить автора Отправить деньги

Комментарии: 19

Miša Bulic
Вчера в 17:34
Было бы здорово регулировать размер шрифта, мне мелковато текст. Samsung s23
Сергей Карпович
Сегодня в 00:18
В темной теме логотип темный тоже, плохо видно.
И шрифт мелковат. Читать тяжело.
Иван
Сегодня в 10:37
Мне кажется цвет при наведении на ссылку не очень подходящий — file.modx.pro/files/f/c/6/fc69770e7ffc11369d27240105c1a938.png file.modx.pro/files/4/c/9/4c92d79ce44b3000f268d88ae58d4ac1.png

Так и было задумано? — file.modx.pro/files/2/3/1/231e5a9643a087d8a69ccbef2bbb78aa.png

Нет отступа — file.modx.pro/files/4/c/e/4cefb3e4c7a3c6fc9462257bafcedfb7.png

Если я не ошибаюсь запрещено сейчас в РФ использовать авторизацию через иностранные соцсети. Вроде бы большой штраф — file.modx.pro/files/4/d/5/4d5e20a47f221f4cd3675d6e1f76598e.png

При наведении на кнопку «наверх» серая полоска пропадает — file.modx.pro/files/1/6/0/160b0b84b447c7a8720f54e3c13c7661.png

При нажатии на стрелочки вверх вниз у комментария или у автора (прибавить карму) было бы не плохо у неавторизованного пользователя предлагать авторизоваться в модальном окне.
Иван
Сегодня в 10:41
При наведении на кнопку при создании заметки она выглядит так себе. Цвета сливаются — file.modx.pro/files/0/c/a/0ca63296177d65f7fdbb730c8712e6ef.png

В правом сайдбаре когда создаешь заметку вот так — file.modx.pro/files/3/c/6/3c630164e3d987485c306725c550467e.png
Иван
Сегодня в 10:42
При предпросмотре комментария как-то съезжает — file.modx.pro/files/4/0/6/4062a09883a7727384b4c0030274dee2.png
Miša Bulic
9 часов назад
Было бы неплохо в редактор заметок добавлять маркдаун редактор как альтернативу текущего html.
    Scorp Satex
    8 часов назад
    А отступ справа в контентной области — это так задумано?

      W.H.I.T.E
      8 часов назад
      тот же вопрос.

      .v2-topic-page__content {
          /* max-width: 65ch; лишнее
      }
        Иван Бочкарев
        7 часов назад
        Исправил, спасибо
        Кирилл
        8 часов назад
        Я бы убрал клик в левой области, вне области «Наверх» (оно и раньше так было, да, но много раз я ловил это, когда не хотел)

        Из мелочей, отступ в превью комментария

        Максим
        6 часов назад
        В целом свежо, зелёный цвет нравится, но вот логотип — нет, а именно «Х» перед modx.pro
          Максим
          6 часов назад
          На больших экранах основной текст статьи я бы сделал 18 px. Да и текст комментариев можно таким сделать. Для меня лично 16 — мелковато на больших экранах (в комментариях вообще 15 с копейками).
            Авторизуйтесь или зарегистрируйтесь, чтобы оставлять комментарии.
            19