Поведение CSS изменилось после обновления ПО

Внести вклад UX
1

Я обновил Discourse два дня назад до версии 2.7.0beta4 и заметил изменение в поведении пользовательских стилей CSS. Ранее у меня был следующий код CSS (упрощённый) для скрытия определённых тегов у пользователей, которые не являются сотрудниками:

:not(.staff){
    .topic-list{
        .category-marketplace{
            a[data-tag-name="wagon"]
            {
                display: none!important;
            }
        }
        
    } 
}

В последнее время я заметил, что теги скрыты и у сотрудников. Мне интересно, связано ли это с обновлением. Если да, то как я могу внести исправление? Спасибо!

1 лайк
2

Это всё ещё должно работать, я проверил на своём тестовом сайте, и всё работает как ожидалось… это единственные CSS-стили, которые перестали работать?

4 лайка
3

Да, это единственное, что я заметил, что ведёт себя иначе. Не уверен, почему теги скрываются от сотрудников, так как я явно вижу <body class="staff navigation-categories categories-list">, когда посещаю свой сайт как сотрудник.

1 лайк
4

Ты уже разобрался с этим?

1 лайк
5

Нет, я не пробовал. Я несколько раз пытался переписать CSS-код (например, html:not(.staff), body:not(.staff) или группировка элементов в одной строке), но код всё равно скрывает выбранные элементы для сотрудников.

1 лайк
7

Хм… попробуйте добавить этот CSS в конец файла, где находятся ваши другие стили. Возможно, где-то возникает конфликт с другим CSS, и это поможет это подтвердить.

body:not(.staff) .topic-list-item a[data-tag-name="wagon"] { 
  display: none !important; 
}

Если у вас есть публичный сайт, не стесняйтесь также опубликовать ссылку здесь — я смогу внимательнее посмотреть, нет ли чего-то очевидного.

2 лайка
8

Спасибо! Сайт: Marketplace - Leasehackr Forum

В основном я хотел, чтобы определённые теги в категории Marketplace и её подкатегориях были скрыты от тех, кто не является staff.

Спасибо, что уделили время этому вопросу!

1 лайк
9

Извините за задержку с ответом. Вы выяснили, в чём проблема? Я вижу, что теперь на вашем сайте некоторые теги скрыты от пользователей, не являющихся сотрудниками.

10

Я ещё не нашёл решение. Теги по-прежнему скрыты как для .staff, так и для не-сотрудников. Спасибо!

11

Кажется, здесь есть две проблемы. Первая: перед :not нужно добавить body, иначе :not может сработать для любого div без класса.

Вторая проблема в том, что эти стили конфликтуют друг с другом:

:not(.staff) .topic-list .category-marketplace a[data-tag-name="wagon"] {
  display: none !important;
}

:not(.primary-group-dealers) .topic-list .category-marketplace a[data-tag-name="wagon"] {
  display: none !important;
}

:not(.primary-group-brokers) .topic-list .category-marketplace a[data-tag-name="wagon"] {
  display: none !important;
}

Первое правило скроет тег wagon, если вы не сотрудник… но второе и третье правила скроют тег wagon, если ваша основная группа также не дилеры/брокеры. Чтобы избежать display: none;, нужно соответствовать всем трём условиям одновременно.

Вместо этого, думаю, лучше объединить их так:

body:not(.staff):not(.primary-group-dealers):not(.primary-group-brokers)  .topic-list .category-marketplace a[data-tag-name="wagon"] {
  display: none;
}

Первый вариант с тремя отдельными правилами работает как «не и»:

не staff и primary-group-dealers и primary-group-brokers

Второй вариант с цепочкой :not работает как «или»:

не staff или primary-group-dealers или primary-group-brokers

4 лайка
12

Это решает проблему! Большое спасибо!

1 лайк