- Исправлен PollSerializer для создания опросов с опциями - Добавлено поле read_only_fields для корректной валидации - Реализована отправка WebSocket уведомлений при создании опроса - Исправлен импорт serialize_message из communications.serialization - Добавлен обработчик poll_update в UserConsumer для WebSocket событий - Исправлен эндпоинт /results/ для возврата user_voted_option_ids - Добавлено поле voters в PollOptionSerializer для списка проголосовавших - Реализована инициализация poll виджетов после рендера сообщений - Добавлено игнорирование poll_update в notification-manager - Исправлены стили для request list badges (height, word-break, flex) - Восстановлены стили team-wheel (.wheel-focus, .scroll-arc) из git истории - Реализовано отображение forwarded message info в messageRendererV2 - Множественные улучшения UI и UX для опросов Fixes: создание опросов, голосование, отображение результатов, список проголосовавших
104 lines
3.0 KiB
SCSS
104 lines
3.0 KiB
SCSS
// =============================================================================
|
||
// Message Reply Preview Component
|
||
// =============================================================================
|
||
// Компактное превью ответа на сообщение в чате
|
||
// При клике скроллит к оригинальному сообщению и подсвечивает его
|
||
// Использует data-reply-to-id для навигации
|
||
|
||
.message-reply-preview {
|
||
// Базовые стили
|
||
padding: 0; // Без отступов
|
||
margin-bottom: 2px; // Минимальный отступ снизу
|
||
|
||
// Компенсация padding от родительского .bubble
|
||
// .bubble имеет padding: var(--space-1) var(--space-2)
|
||
margin-left: calc(var(--space-2) * -1); // Компенсируем левый padding bubble
|
||
margin-right: calc(var(--space-2) * -1); // Компенсируем правый padding bubble
|
||
margin-top: calc(var(--space-1) * -1); // Компенсируем верхний padding bubble (первый элемент)
|
||
|
||
border-radius: var(--bs-border-radius);
|
||
border-left-width: 3px;
|
||
border-left-style: solid;
|
||
cursor: pointer;
|
||
transition: all 0.15s ease;
|
||
line-height: 1.3; // Компактный межстрочный интервал
|
||
|
||
// Сброс возможных наследуемых стилей от bubble
|
||
display: block;
|
||
|
||
// Интерактивность
|
||
&:hover {
|
||
transform: translateX(2px);
|
||
opacity: 0.9;
|
||
}
|
||
|
||
&:focus {
|
||
outline: 2px solid var(--bs-primary);
|
||
outline-offset: 2px;
|
||
}
|
||
|
||
// Автор ответа
|
||
&__author {
|
||
line-height: 1.2;
|
||
margin-bottom: 2px;
|
||
padding: 0; // Сброс padding от .small
|
||
|
||
.bi-reply-fill {
|
||
font-size: 0.85em;
|
||
margin-right: 4px;
|
||
}
|
||
}
|
||
|
||
// Текст сообщения
|
||
&__content {
|
||
line-height: 1.2;
|
||
margin-top: 0;
|
||
margin-bottom: 0; // Сброс margin от .small
|
||
padding: 0; // Сброс padding от .small
|
||
max-width: 400px;
|
||
}
|
||
|
||
// Вариант для своих сообщений (синий фон)
|
||
&--own {
|
||
background-color: rgba(255, 255, 255, 0.1);
|
||
border-left-color: rgba(255, 255, 255, 0.5);
|
||
|
||
.message-reply-preview__author {
|
||
color: rgba(255, 255, 255, 0.7);
|
||
}
|
||
|
||
.message-reply-preview__content {
|
||
color: rgba(255, 255, 255, 0.6);
|
||
}
|
||
|
||
&:hover {
|
||
background-color: rgba(255, 255, 255, 0.15);
|
||
}
|
||
}
|
||
|
||
// Вариант для чужих сообщений (светлый фон)
|
||
&--other {
|
||
background-color: rgba(13, 110, 253, 0.05);
|
||
border-left-color: var(--bs-primary);
|
||
|
||
.message-reply-preview__author {
|
||
color: var(--bs-primary);
|
||
}
|
||
|
||
.message-reply-preview__content {
|
||
color: var(--bs-secondary);
|
||
}
|
||
|
||
&:hover {
|
||
background-color: rgba(13, 110, 253, 0.1);
|
||
}
|
||
}
|
||
|
||
// Адаптивность для мобильных
|
||
@media (max-width: 576px) {
|
||
&__content {
|
||
max-width: 250px;
|
||
}
|
||
}
|
||
}
|