Estou tentando personalizar a nova janela de chat (modo de tela cheia) no desktop.
Tenho o CSS que gostaria de usar, mas não consigo descobrir onde colocá-lo no meu tema para que ele tenha efeito.
Eu tentei…
my_theme/desktop/chat.scss
my_theme/desktop/chat_desktop.scss
my_theme/common/chat.scss
my_theme/common/chat_desktop.scss
Nenhum desses parece sobrescrever o CSS padrão.
Para completar, aqui está o CSS que estou tentando injetar.
// Ajusta a aparência do chat em tela cheia
.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;
}
A estrutura do nome da sua pasta/arquivo está incorreta.
Leia em: Developing Discourse Themes & Theme Components
Devo estar a perder alguma coisa. O que está incorreto?
Esta é a estrutura da minha pasta.
Isso é diferente do que você compartilhou no OP:
Se você quiser nomear os moderadores de chat de forma diferente, você deve referenciá-los no arquivo principal.
Desculpe pela confusão. Na OP, eu estava tentando comunicar quais arquivos tentei criar e em quais locais os coloquei. Não quero nomear o modo de chat de forma diferente, estou apenas tentando descobrir em qual arquivo scss devo colocar o css para afetar apenas o chat no modo de tela cheia para desktop.
Você pode colocar seu CSS em theme/desktop/desktop.scss — para impactar o chat, ele não precisa estar em um arquivo específico de chat, você só precisa direcionar as classes relevantes.
Você pode usar @import "chat" ou o equivalente para importá-los em seu arquivo principal.