Позиционирование уведомлений для сотрудников неоднозначно

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

(Я наткнулся на этот старый пост, когда пересматривал некоторые другие сообщения о путанице с уведомлениями сотрудников…)

Мне всегда казалось, что размещение уведомлений сотрудников может быть неоднозначным. Поскольку темы могут по-разному обрабатывать такие элементы, как цвета, границы и разделители, решить эту проблему таким способом, вероятно, сложно.

Альтернатива, которую сегодня можно применить глобально ко всем уведомлениям в постах, — это использование пользовательского CSS для вставки символа Unicode со стрелкой, либо перед аватаром:

image

CSS: перед аватаром 
.post-notice::before {
  content: '🡇';
}

(Или, возможно, более корректно):

.post-notice::before {
  content: " \1F847";
}

…либо перед текстовым содержимым:

image

CSS: перед текстом 
.post-notice p::before {
  content: " \1F847";
  margin-right: .5rem;
}

О-о — вот трюк для изменения цвета:

image

CSS: изменение цвета 
.post-notice p::before {
  content: " \1F847\fe0e";
  color: yellow;
  margin-right: .5rem;
}

(Добавление \fe0e к любому символу Unicode отображает текстовую версию, которая поддерживает цвет. Ссылка.)

Я также решил, что стрелка вниз не подходит для уведомления в основном топике, так как она явно указывает на направление топика. Этот CSS заменяет стрелку на маркер только для первого поста:

image

CSS: отличается для основного топика 
#post_1 .post-notice p::before {
  content: " \29BF\fe0e";
  color: yellow;
  margin-right: .5rem;
}
1 лайк