CSS: изменение цвета имени пользователя для всех пользовательских групп работает иногда, а иногда нет?

Разработка
1

Я не совсем понимаю, что именно вызывает эту проблему, но любой CSS-код, который я использую для этого, то включается, то выключается случайным образом. Не знаю, связано ли это с обновлением, какими-то настройками или чем-то ещё…

Код, который я использую уже давно, выглядит так:

.topic-post .Veeps a {
color: #66FF00;
}

Здесь «Veeps» — это моя пользовательская группа. Всё работало нормально ещё вчера или позавчера, но сегодня я заметил, что все цвета, кроме тех, что привязаны к конкретным именам пользователей, вернулись к значениям по умолчанию, и это наблюдается во всех темах. Я создал новую тему и полностью очистил все модификации, но ни одна из них не работает. Код отлично работает с предустановленными группами, такими как «admin», «staff», «moderator», но я не могу заставить его срабатывать для пользовательских групп. Я убедился, что группа установлена как основная, что пользователь состоит только в ней, пробовал разные пользовательские группы (например, «Owner») — ничего не помогает. Если же я применяю стили к конкретным именам пользователей, всё работает, но это крайне утомительно: приходится создавать 100 отдельных записей для каждого, к тому же такие настройки не обновляются автоматически при смене группы пользователя.

span.username.staff a {
      color: #00A9DB;
}

Этот код работает, но тоже не для пользовательских групп. Я знаю, что раньше пользовательские группы работали, потому что на протяжении многих лет это было возможно (за исключением тех случаев, когда вдруг переставало работать). Может быть, есть какой-то более подходящий CSS-код или настройка, которую я случайно изменил?

Я установил плагин GitHub - discourse/discourse-groups-css-classes-in-body · GitHub, и теперь у меня работает следующий код:

div.topic-post.group-Veeps div.names span.username a {
  color: #8A2BE2;
}

Он функционирует так, как мне нужно, но я не устанавливал этот плагин (и не использовал такой CSS) в последние несколько лет, поэтому это не помогает понять, что именно перестало работать и что нужно исправить. Это всё равно что забивать гвоздь дрелью — вроде бы результат есть, но метод не помогает разобраться в причине проблемы.

2

Здравствуйте,

Вчера произошло изменение DEV: add title class name, prefix username class (#19482) · discourse/discourse@b1e0836 · GitHub, поэтому теперь в CSS необходимо добавлять префикс group-- к имени группы. Например: .group--Veeps.

3

Да, извините за неудобства, но предыдущий способ добавления имени класса группы был немного подвержен ошибкам… Это означало, что любое имя группы, совпадающее с именем класса в нашем CSS, вызывало проблемы с макетом.

Например, группа с именем “hidden” добавляла класс .hidden, что скрывало имена пользователей. Добавление префикса group-- решает эту проблему, и в будущем это больше не потребуется менять. Поэтому вам достаточно просто обновить .Veeps на .group--veeps

4

Спасибо, что сообщили мне. Я чувствую себя немного менее глупо, ведь, как это часто бывает, я сломал что-то, пытаясь починить что-то другое! Я протестировал несколько разных случаев, и всё работает отлично. С этой информацией мне удалось разобраться.

Требуется ли использование GitHub - discourse/discourse-groups-css-classes-in-body · GitHub для того, чтобы по-прежнему использовать пользовательские основные группы таким образом, как я спрашивал, или это излишне? Возможно, я изначально неправильно понял назначение этого плагина, и он никогда не был необходим для того, что я делал; я просто удалил его из своей тестовой темы, чтобы проверить, продолжают ли срабатывать коды пользовательских основных групп, и они срабатывают, так что, похоже, он не нужен… но я бы предпочел убедиться в этом, прежде чем просто отключать его и столкнуться с чем-то неожиданным в будущем.

5

Основные группы присутствуют без этого плагина, поэтому их можно стилизовать через CSS. При установленном компоненте темы также можно нацеливаться и на неосновные группы. :+1:

6

Я не понял, какой код использовать, возможно, перевод выпал из контекста.

Поэтому вместо того чтобы использовать это:

div.topic-post.group-Veeps div.names span.username a {
  color: #8A2BE2;
}

я использую это:

div.topic-post.group-- Veeps div.names span.username a {
  color: #8A2BE2;
}

Я не понимаю, что именно нужно вставить в код? Это просто --.

@Kartoon @Don @awesomerobot

7

Здравствуйте,

Это должно работать так :arrow_down_small:

.names span {
  &.group--GroupName a {
    color: red;
  }
}

Но я уже быстро создал для этого компонент темы. :slightly_smiling_face:

Теперь вы можете просто настроить это.

groupname;color

Screenshot 2023-01-14 at 21.07.53
Screenshot 2023-01-14 at 21.07.53767×399 31.1 KB

8

Скорее всего, я не самый подходящий человек для ответа, так как могу заставить вещи работать, но не всегда могу объяснить, почему. Но вот то, что я сейчас использую и что работает отлично:

.topic-post.group-Veeps div.names span.username a {
   color: #66FF00;
 }

Конечно, замените «Veeps» на название вашей пользовательской группы; у меня она так называется.

.names span {
  &.group--Veeps a {
    color: red;
  }
}

Как упоминалось выше, это тоже работает; я просто заменил это на то, что было у меня. В любом случае, я, вероятно, установлю плагин, который он только что опубликовал, ради удобства.

9

У меня тоже возникает та же проблема, не знаю, в чём дело. Удивительно, что даже при использовании темы «Competent» или кода имена участников не меняют цвет. Я даже пробовал тему «Cogido» и компонентную тему в виде «сырой» темы без каких-либо CSS-изменений, но это никак не влияет на цвета заголовков.

Я только что заметил кое-что интересное: если я добавляю кого-то в группу как владельца, то код изменения работает, и цвета имён участников, которых я назначил владельцами, меняются. Однако участники, не являющиеся владельцами, не меняют цвет.

@Kartoon @Don @xebiyen