qibogang / qibogang.github.io

The gang site :)
https://qibogang.github.io
0 stars 0 forks source link

From Arial to Ubuntu through Roboto #41

Closed MatteoRobbiati closed 1 year ago

MatteoRobbiati commented 1 year ago

I changed the font: from Arial to Roboto.

scarrazza commented 1 year ago

Yes, I like.

alecandido commented 1 year ago

Please add the font package, and import it in the top-level layout:

https://fontsource.org/docs/guides/nextjs https://www.npmjs.com/search?q=%40fontsource%2Froboto

alecandido commented 1 year ago

Concerning the code font, you could use Roboto Mono, for consistency, but it is not required.

Personally, I'm quite keen on Fira Code. Ligatures are particularly elegant, but maybe they are not in the package (but hopefully yes), so for that we may have to download it.

P.S.: otherwise there is always IBM Plex :P P.P.S.: personally I like the most Operator Mono and its ligatures (much fewer than Fira Code ligatures, but as elegant as those), but that's really not an option...

alecandido commented 1 year ago

Moreover, the most important thing is that the font choice should not been in many places, but in a single one.

The simplest option is just to set the font-family once in body rule, everywhere else you get from the cascade (that's CSS after all). But sometimes you might want to reset the font after having changed it. For this, the best option is to set top-level some a CSS variable:

<body>
  <section>
    Ciao!
    <article>
      Come va?
    </article>
  </section>
</body>
body {
  --main-sans: Roboto;
  --main-serif: 'Roboto Serif';
  --default-sans: var(--main-sans), sans-serif;
  --default-serif: var(--main-sans), serif;
  font-family: var(--default-sans);
}

section {
  font-family:  var(--default-serif);
}

article {
  font-family:  var(--default-sans);
}
MatteoRobbiati commented 1 year ago

Thank you @AleCandido for the suggestions. I ave a question for both you and @scarrazza: do you like Roboto Mono or it is "too much" ? Personally I like the mono-space style, but I am not sure it is the best choice in terms of web developing.

MatteoRobbiati commented 1 year ago

Thank you @AleCandido for the suggestions. I ave a question for both you and @scarrazza: do you like Roboto Mono or it is "too much" ? Personally I like the mono-space style, but I am not sure it is the best choice in terms of web developing.

Don't think about this. I have just choosen "Ubuntu" font: I really like it and it allows us to propagate the open source philosophy even in fonts.

scarrazza commented 1 year ago

Yes, I like it.

MatteoRobbiati commented 1 year ago

Yes, I like it.

Perfect. Now I am trying to add the Ubuntu font into the sphinx configuration file.

alecandido commented 1 year ago

Personally I like the mono-space style, but I am not sure it is the best choice in terms of web developing.

About the individual font, we can iterate and choose what we prefer. Instead, about the category:

There are also a few other categories, e.g. handwritten-like fonts, but I would reserve those for titles, while the bulk of the text should be something simple.

alecandido commented 1 year ago

This (and resources linked) can help you in motivating and improving your choice: