Настройка внешнего вида чата

Разработка
1

Я пытаюсь настроить новое окно чата (полноэкранный режим) на рабочем столе.

У меня есть нужный CSS, но я не могу понять, куда его добавить в мою тему, чтобы он применился.

Я пробовал…

my_theme/desktop/chat.scss
my_theme/desktop/chat_desktop.scss
my_theme/common/chat.scss
my_theme/common/chat_desktop.scss

Ни один из этих вариантов не переопределяет CSS по умолчанию.

Для полноты картины, вот CSS, который я пытаюсь внедрить.

// Настройка внешнего вида чата на весь экран

.full-page-chat .chat-full-page-header {
	background: var(--primary-very-low);
}

.full-page-chat .chat-full-page-header {
	border-top: 0px;
}

:root {
	--d-max-width: 2000px;
}

.has-full-page-chat:not(.discourse-sidebar) {
	--max-chat-width: 2000px;
}

#main-outlet-wrapper {
	padding: 0 0px;
}
2

Структура имен ваших папок/файлов неверна.

Прочитайте: Developing Discourse Themes & Theme Components

3

Я, должно быть, что-то упускаю. В чём именно ошибка?

Вот структура моей папки.

Screenshot 2023-01-06 at 9.22.05 AM
Screenshot 2023-01-06 at 9.22.05 AM1714×612 116 KB

4

Это отличается от того, что вы указали в первом сообщении:

image
image318×127 1.55 KB

Если вы хотите назвать моды чата иначе, вы должны сослаться на них в главном файле.

5

Извините за путаницу. В исходном посте я пытался объяснить, какие файлы я создал и где их разместил. Я не хочу менять название режима чата, мне просто нужно понять, в какой SCSS-файл следует добавить CSS, чтобы изменения применялись только к чату в полноэкранном режиме на рабочем столе.

6

Вы можете разместить свой CSS в theme/desktop/desktop.scss — для влияния на чат он не обязательно должен находиться в файле, специфичном для чата; вам просто нужно обратиться к соответствующим классам.

7

Вы можете использовать @import "chat" или аналогичный синтаксис для импорта их в ваш главный файл.