Tema Zeronoise

[Discourse]

	Resumo	Zeronoise foca em ter acentos de cor claros e áreas de conteúdo sutilmente diferenciadas, tentando criar uma experiência de leitura agradável.
	Pré-visualização	Pré-visualizar no Discourse Theme Creator
	Link do Repositório	https://github.com/discourse/zeronoise
	Novo em Temas do Discourse?	Guia para iniciantes sobre como usar Temas do Discourse

Instale este tema

Como este é um tema #oficial mantido pela equipe do Discourse, questões de #suporte, relatórios de #bugs, sugestões de #experiência do usuário (UX) e solicitações de #conselhos de desenvolvimento podem ser feitos nas respectivas categorias aqui no Meta, e marcados com a tag do tema apropriada. Clique em um link abaixo para iniciar um.

 Suporte  Bug  UX  Dev

Recursos

Olá Meta! Criei um tema para o Discourse focando em ter acentos de cor claros e áreas de conteúdo sutilmente diferenciadas, tentando criar uma experiência de leitura agradável.

Na versão para desktop, também movi o avatar do criador do tópico para o lado esquerdo do título, a fim de dar a ele uma hierarquia mais alta no design.

Também foi divertido brincar com fontes serifadas e, no final, “Playfair Display” realmente dá um caráter (hehe) ao tema.

Outra coisa divertida é que, como o cabeçalho do tema é preto, você pode brincar com alguns aspectos do logotipo através das Configurações do Tema (inversão de cor, rotação de matiz e brilho).

Espero que gostem, usem e façam um fork !

Configurações

Nome	Descrição
Inverter cores do logotipo
Rotação de matiz do logotipo	Especifique um valor em graus para alterar a cor do seu logotipo. Se você não sabe o que é isso, pode deixá-lo em 0 ou pesquisar no Google ‘css filter hue rotation’
Brilho do logotipo	Defina a quantidade de brilho que deseja adicionar ao seu logotipo (se quiser deixá-lo mais escuro, defina um número negativo)

Créditos

Criado por @ruidovisual

Hospedado por nós? Temas estão disponíveis para uso em nossos planos Standard, Business e Enterprise.

[anon82467725]

Wow! Beautiful theme! Many of the elements should honestly be baked into Material Theme, but both themes are awesome. Great job!

[thegurjyot (Gurjyot Singh)]

This theme actually looks good. Will definitely try this on my website.

[Eduardo_Braga (Eduardo)]

new topic is a component?

[Karthikk_Vijay]

Honestly this is one of the best looking themes I have found! Thank you so much

I just need one help, if it’s not too much trouble @ruidovisual

• I am a complete noob with all this, so forgive my naivety. I have managed to fork your file and change the colour themes. I need to change the font and I see I can do that by importing my own font family inside the variable SCSS?
• What I am not able to figure is how to set two different fonts, one for the titles, headers etc., and the other for the body.

It will be so great if you could help me out here, I know this might be totally out of scope but it would certainly help a lot

[ruidovisual (Miguel Arroyo)]

Hey Karthikk! I’m glad you like the theme : )

The easiest way would be to define a font-family for the body (I think doing it in common.scss would be the best):

body {
  font-family: 'The Name of your Font Family', [FALLBACKS];
} 

I don’t know if you are adding your own fonts or picking up some google fonts, but, I would advise that you pick a family from the google catalog.

Remember to replace [FALLBACKS] with your fallbacks depending on what type of font you’ve chosen, you can see more on font-family fallbacks here

About changing the font for titles and headers, I think that’s the part that you already figured out, but as a reminder, besides from importing it you need to declare it in the line 116 of variables.scss

Hope it helps! have a nice weekend : )

[ruidovisual (Miguel Arroyo)]

You mean a custom component for the theme? in this case the answer is no. It’s there with position: fixed See line 36 of mobile.scss

Have a nice weekend and thank you for your patience : )

[Matze]

Very nice theme! I can’t wait building a new theme for our discourse based upon zeronoise.
Thank you for sharing!

[Zup]

excellent theme. high on my personal like list.

would be even more interesting if font could be optionally same as whatever was chosen in the wizard.

[daemon (Alex)]

Hi @ruidovisual ,

I like your Theme a lot.

Is it possible to change the purple color to red? Can you release a red version of your theme?

I tried it myself but after that I lost the Theme effects and it wasn’t red.

[Karthikk_Vijay]

@ruidovisual Thanks for the explanation, I have figure out how to change the fonts, thanks to you!

I am now playing around with my own light and dark version of the theme. I am using the Color Palettes to achieve this, as I wish to stay away from CSS as much as possible.

I have managed to tweak almost everything except these two elements :

1. The status bar below the post has a special effect in your theme and I am not able to control it with the Color Palette. How do I tweak this using CSS? Which part do I target?
   

   

2. The bar on top of all topics in the separate category view stays white no matter what colour I set in the palette

   

Would be great if you could help me with these

P.S. This is my Color Palette for your reference :

[Iceman]

Great theme.

One question, has anyone been able to make it work with “Box-type” Categories? They just get random shapes and the text remains white.

[png (Portable Network Graphics)]

This is extremely clean and modern. The community makes the best themes ever!

[KevinBlandy]

Hi,This theme looks great
However, there seems to be some problems with the style in the Chinese forum.

zeronoise theme

default theme

[png (Portable Network Graphics)]

Probably a formatting issue with Chinese characters

[marthasimmons]

Em primeiro lugar, muito obrigado por este belo tema @ruidovisual. Tenho usado ele para o meu fórum da comunidade há quase 2 meses.

Tenho uma pergunta. É possível remover o menu suspenso de navegação no celular?

Obrigado desde já.

[diabolicvincent]

Obrigado por este tema, estou adorando até agora! Um dos estilos de discourse mais agradáveis que já vi

Apenas um problema: ao realizar operações em massa em uma categoria, as caixas de seleção não aparecem, portanto, não consigo selecionar vários tópicos. Isso está me incomodando muito e sou incapaz de usar o tema regularmente, devido a este problema. Isso poderia ser corrigido? <3

[RGJ (Richard - Communiteq)]

@KevinBlandy

No entanto, parece haver alguns problemas com o estilo no fórum chinês.

Isso não tem nada a ver com caracteres chineses, é um problema com a configuração de estilo de categoria “caixa”.

.badge {
  &-category-bg,  /* <------ ruim!! */
  &-wrapper.bullet &-category-parent-bg,
  &-wrapper.bullet &-category-parent-bg + &-category-bg {
    border-radius: 50%;
    width: 9px;
  }

Para resolver isso, aplique isto como um componente de tema

.badge {
  &-wrapper.bar &-category-bg,
  &-wrapper.bar &-category-parent-bg,
  &-wrapper.bar &-category-parent-bg + &-category-bg {
     border-radius: 0%;
  }
  &-wrapper.box &-category-bg,
  &-wrapper.box &-category-parent-bg,
  &-wrapper.box &-category-parent-bg + &-category-bg {
    border-radius: 0%;
    width: 100%;
  }
}

[bosal]

Adorei o tema, mas… ;)\n\nVocê poderia me ajudar ou corrigir esta visualização de impressão, pois ela não é utilizável:\n- o título deve ser pequeno\n- a borda com sombra não deve ser visível\n\n

\n\nAlém disso, a seleção de tópicos não funciona\n\n\n\nAlém disso, como posso alterar globalmente a fonte para este tema?

[bquast (Bastiaan Quast)]

Muito impressionante, muito obrigado.

Vou implantar agora, espero poder contribuir mais em breve