Tema Zeronoise

:discourse2: Sintesi Zeronoise si concentra su accenti di colore chiari e aree di contenuto leggermente differenziate, cercando di creare un’esperienza di lettura piacevole.
:eyeglasses: Anteprima Anteprima su Discourse Theme Creator
:hammer_and_wrench: Link al repository https://github.com/discourse/zeronoise
:open_book: Nuovo a Discourse Themes? Guida per principianti all’uso di Discourse Themes

Installa questo tema

Caratteristiche

Ciao Meta! Ho creato un tema per Discourse concentrandomi su accenti di colore chiari e aree di contenuto leggermente differenziate, cercando di creare un’esperienza di lettura piacevole.

Nella versione desktop ho anche spostato l’avatar del creatore dell’argomento sul lato sinistro del titolo per conferirgli una gerarchia più alta nel design.

È stato anche divertente giocare con i caratteri serif e alla fine “Playfair Display” dà davvero carattere (hehe) al tema.

Un’altra cosa divertente è che, dato che l’intestazione del tema è nera, puoi giocare con alcuni aspetti del logo tramite le Impostazioni del tema (inversione dei colori, rotazione della tonalità e luminosità).

Spero che vi piaccia, lo usiate e lo forkiate :100:!

Impostazioni

Nome Descrizione
inverti i colori del logo
rotazione della tonalità del logo Specifica un valore in gradi per cambiare il colore del tuo logo. Se non sai di cosa si tratta, puoi lasciarlo a 0 o cercare su Google ‘css filter hue rotation’
luminosità del logo Imposta la quantità di luminosità che desideri aggiungere al tuo logo (se vuoi renderlo più scuro, imposta un numero negativo)

Crediti

Creato da @ruidovisual


:discourse2: Ospitato da noi? I temi sono disponibili per l’uso nei nostri piani Standard, Business ed Enterprise.

51 Mi Piace

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

2 Mi Piace

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

4 Mi Piace

new topic is a component?

2 Mi Piace

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

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

  • 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 :slight_smile:

5 Mi Piace

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 : )

7 Mi Piace

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 : )

4 Mi Piace

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

5 Mi Piace

excellent theme. high on my personal like list. :slight_smile:

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

4 Mi Piace

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. :grin:

2 Mi Piace

@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 :slight_smile:

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

1 Mi Piace

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.

1 Mi Piace

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

1 Mi Piace

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

zeronoise theme

default theme

3 Mi Piace

Probably a formatting issue with Chinese characters

2 Mi Piace

Prima di tutto, grazie mille per questo bellissimo tema @ruidovisual. Lo sto usando per il mio forum della community da quasi 2 mesi.

Ho una domanda. È possibile rimuovere il menu a discesa di navigazione su mobile?

Grazie in anticipo.

1 Mi Piace

Grazie per questo tema, mi piace molto finora! Uno degli stili di discorso più piacevoli che abbia mai visto :slight_smile:

Solo un problema: quando si eseguono operazioni di massa in una categoria, le caselle di controllo non appaiono, quindi non posso selezionare più argomenti. Questo mi sta davvero infastidendo e non sono in grado di utilizzare regolarmente il tema, a causa di questo problema. Potrebbe essere risolto? <3

1 Mi Piace

Questo non ha nulla a che fare con i caratteri cinesi, è un problema con l’impostazione dello stile della categoria “box”.

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

Per risolvere questo problema, applica quanto segue come componente del 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%;
  }
}
3 Mi Piace

Adoro il tema ma… :wink:

Potresti aiutarmi o correggere questa vista di stampa poiché non è utilizzabile:

  • il titolo dovrebbe essere piccolo
  • il bordo con l’ombra non dovrebbe essere visibile

Inoltre, la selezione dell’argomento non funziona

CleanShot 2022-11-20 at 00.12.18

Inoltre, come posso cambiare globalmente il font per questo tema?

Molto impressionante, grazie mille.

Ora effettuerò il deploy, spero di poter contribuire presto :slight_smile: