[CSS] Add additional good-quality fonts to the web app

[DeeDeeG]

Scope / difficulty

We just need to change one line in our _variables.scss file.

Impact

This would make the app look a bit nicer on most operating systems and browsers.

Details

Basically, we already have "Ubuntu" as a really nice font, and then we currently fall back to variations on "Helvetica" or else we fall back to [insert sans-serif font likely to look like Helvetica here].

I think we should add some other nice fonts that people probably have on their computers.

Rationale

I thought to do this, because there are actually some great "basic sans-serif" fonts out there that people already have, which might be even better than Helvetica / Arial and equivalent.

Proposal

What I have in mind is Segoe UI (almost every Windows user has this, since Vista and onward), -apple-system[1] (recent macOS and iOS versions will use San Francisco; all the way back to the iPad 2 and similarly old iPhones support this, and I believe many Mac owners are on the latest macOS, which will also use San Francisco.) And we can consider some common Android fonts, such as Roboto and even Droid Sans for older Android phones.)

See this list of common "system" fonts: https://css-tricks.com/snippets/css/system-font-stack/

How to actually do this:

One would just need to update this line of our app/assets/stylesheets/sass/_variables.scss file: link

Before merging any changes, it would be great to have someone test this and ensure it works, and take some time to consider the style pros/cons of these fonts.

[lucas-carl]

I would like to work on this.

[DeeDeeG]

Hi @lucas-carl.

Thanks for volunteering! We would be glad to have you work on this.

I think there might be a time-zone difference, but we'll try to answer any questions you have in a reasonable amount of time.

Best regards,

- DeeDeeG

[hiteshpr]

Can I work n this?

[DeeDeeG]

Hi @hiteshpr.

I think @lucas-carl has finished this task. See this pull request: #501.

If you want to work on this also, for the sake of learning, that would be okay. I think we are likely to merge pull request #501, however.

We won't be able to merge two PRs for this. You are still welcome to open one if you like, since you asked very close to when the other pull request was submitted.