Alternar modo escuro/claro agora disponível no núcleo

[Osama]

O componente de tema Alternador de Modo Escuro/Claro, que adiciona um alternador para permitir que os usuários alternem facilmente entre os modos claro e escuro, foi mesclado ao core do Discourse e pode ser ativado através da configuração do site interface color selector.

Além de várias correções de bugs e melhorias, a versão core difere ligeiramente do componente de tema original por ter uma terceira opção “Automático”, que faz com que o modo de cor do site corresponda à preferência do sistema do dispositivo do usuário.

O seletor de cores pode ser configurado através da configuração do site interface color selector para aparecer no cabeçalho do site ao lado do ícone de pesquisa ou no rodapé da barra lateral.

Aqui está uma captura de tela quando ele está no rodapé da barra lateral:

E esta é quando ele está no cabeçalho:

Usuários existentes do componente de tema

Depreciamos o componente de tema e lançamos uma atualização final para detectar se a versão core está disponível e alertar os administradores para excluí-la e ativar a versão core. Aqui está uma captura de tela do alerta do administrador:

Uma vez que a versão core esteja ativada, o componente de tema não terá mais efeito em seu site. No entanto, você ainda deve excluí-lo completamente para evitar possíveis problemas no futuro, pois não faremos mais nenhuma manutenção para o componente de tema.

[Kevin7 (Kévin .)]

Olá, obrigado por este novo recurso, mas eu me pergunto por que os botões ainda têm texto e ícones pretos ao mudar para o modo escuro em vez de simplesmente ficarem brancos. Como posso fazer com que o texto e os ícones dos botões fiquem brancos quando o modo escuro estiver ativo? Obrigado.

[Osama]

@Kévin .

Gostaria de saber por que os botões ainda possuem texto e ícones pretos ao alternar para o modo escuro, em vez de simplesmente ficarem brancos. Como posso fazer com que o texto e os ícones nos botões fiquem brancos quando o modo escuro estiver ativo?

Você pode compartilhar uma captura de tela do problema que está vendo?

[Kevin7 (Kévin .)]

Aqui está um exemplo: quando mudo o Discourse para o Modo Escuro, alguns textos de botões permanecem pretos. Acredito que faria mais sentido o texto ser branco. No entanto, encontrei uma solução usando CSS que acho que funciona bem para corrigir esse problema.

$button-text-color: dark-light-choose(#ffffff, $primary);

:root {
  --button-text-color: #{$button-text-color};
}

.btn-primary {
  color: var(--button-text-color) !important;
  
  .d-icon {
    color: var(--button-text-color) !important;
  }
}

[Osama]

@Kevin7

alguns textos de botões permanecem pretos.

Essa é uma decisão de design intencional da nossa parte para botões primários (aqueles que têm fundo azul na paleta de cores padrão), então não vamos mudar isso para todos. Dito isso, o Discourse é muito flexível e tem um sistema de temas para substituir o CSS principal.

[joo (slower)]

Eu já fiz a configuração, mas não consigo ver a opção. Você poderia explicar o motivo?

[Osama]

Você tem uma paleta clara e uma escura selecionadas em suas preferências em /my/preferences/interface? A opção de alternar só aparecerá se ambas as paletas, clara e escura, estiverem selecionadas:

[patrickemin]

Olá, não vejo essa configuração de paleta de cores nas minhas preferências, apenas "Tema" e "Modo escuro":

[Osama]

Acredito que se você habilitar a caixa de seleção do modo escuro (presumo que “Mode sombre” signifique modo escuro em francês), o alternador aparecerá para você. Você pode tentar isso?

A preferência de paletas de cores na minha última postagem acima aparece se o seu site tiver várias paletas escuras que os usuários podem selecionar. Se houver apenas 1 paleta de cores disponível, o menu suspenso é substituído pela caixa de seleção que você vê.

[Andrew_Rowe]

Sinto muito… onde fica a configuração para ativar este recurso?
Não precisa instalar?
com a nova interface de administração estou um pouco desorientado

[StefanoCecere]

não aparece no celular / iphone
no desktop: perfeito.
lembro que a versão anterior (a versão do Componente) aparecia.

[Jagster (Jakke Lehtonen)]

Apenas mostrando que alguns iPhones e fóruns funcionam.

Está no núcleo… isso significa que deve aparecer ao tentar o modo de segurança, eu acho. Se isso acontecer, então é um conflito com algum outro componente, tema ou plugin.

Caso contrário

• O Discourse não está atualizado o suficiente
• o alternador não está habilitado nas configurações do site
• o modo escuro não está habilitado no nível do site ou nas configurações do usuário

[StefanoCecere]

estranho porque estava funcionando até alguns dias atrás

voltarei em alguns dias.. vamos ver
obrigado

[StefanoCecere]

não tenho essas duas opções… apenas a regular…

[StefanoCecere]

entendi! mas foi difícil
em uma mistura de várias configurações e preferências pessoais… acho que deveríamos facilitar para dar a um tema os dois esquemas de cores (escuro e claro)

[patrickemin]

@Osama

Acredito que se você habilitar a caixa de seleção do modo escuro (presumo que “Mode sombre” signifique modo escuro em francês), o alternador aparecerá para você. Você pode tentar isso?

Bem, não, ele não aparece no rodapé da barra lateral.

[Osama]

@Andrew Rowe

Sinto muito… onde fica a configuração para ativar esse recurso?
Não precisa de instalação?
Com a nova interface de administração, estou um pouco desorientado

Se você acessa /admin/site_settings/category/all_results?filter=interface_color_selector no seu site, deve conseguir ver a configuração.

@Patrick EMIN

Bem não, ela não aparece no rodapé da barra lateral.

Se você trocar a preferência do sistema no seu telefone/computador de claro para escuro (ou vice-versa), a interface do discourse muda para combinar a preferência do sistema ou permanece inalterada (modo claro ou escuro)?

Já que o seletor principal está funcionando aqui e em muitos outros sites, deve haver uma questão de configuração aí em seu sistema que impede a exibição do seletor. Você pode compartilhar a saída desses comandos quando os executar no console do navegador enquanto estiver logado na sua conta?

(({dark_scheme_id, color_scheme_id}) => { return {dark_scheme_id, color_scheme_id}} )((await (await fetch(`/u/${Discourse.User.current().username}.json`)).json()).user.user_option)

Discourse.SiteSettings.default_dark_mode_color_scheme_id

[patrickemin]

Minhas configurações estão ok (na parte inferior da barra lateral). Se eu mudar para o modo escuro no celular ou PC, não, não há nenhuma mudança, e para o console, eu não sei como usá-lo, desculpe

[Jagster (Jakke Lehtonen)]

Mas suas configurações de cor escura nas configurações do sistema e/ou suas configurações pessoais provavelmente não estão corretas.

[patrickemin]

Bem, provavelmente, eu sempre tive dificuldades com esse tipo de configuração, mas não é tão importante, vou deixar assim, obrigado por tentar ajudar.