Improve font appearance on non-Ubuntu Linux desktops

[reinhart1010]

Pull request type

Please check the type of change your PR introduces:

• Bugfix
• New feature or enhancement
• UI change (please include screenshot!)
• Code style update (formatting, renaming)
• Refactoring (no functional changes, no api changes)
• Build related changes
• Documentation content changes
• Internationalization and localization
• Other (please describe):

What is the current behavior?

Issue Number: N/A

What is the new behavior?

This PR modifies the CSS system font stack to accommodate Linux desktops other than Ubuntu.

• GNOME defines Cantarell as their system font
• Cinnamon (as in Linux Mint) and KDE defines Noto Sans as their system font

Other Linux desktops tend to use the de-facto system sans-serif font as commonly set in fontconfig: DejaVu Sans. But that is now subject to change, as major Linux distributions swapped the fonts in favor of Noto Sans (and Serif and Mono, as well).

This new font-stack feature Noto Sans as a fallback DE (desktop environment)-neutral font for Linux. Even though I am unable to test due to #1224, the resulting effect should be similar to the ones at https://reinhart1010.id/browser-test as I have researched about these system font stacks.

Cantarell

Noto Sans

Ubuntu

|

Other information

Quality check

Before creating this PR:

• Did you follow the code style guideline as described in CONTRIBUTING.md
• Did you build the app and test your changes?
  • Failed - Blocked by DevToys source code failed to compile due to missing ResxHelperGenerator.dll #1224
• Did you check for accessibility? On Windows, you can use Accessibility Insights for this.
• Did you verify that the change work in Release build configuration
• Did you verify that all unit tests pass
• If necessary and if possible, did you verify your changes on:
  • Windows
  • macOS
  • Linux

[reinhart1010]

I have gotten the builds running. This is DevToys on Fedora Linux (without the Ubuntu font installed) looks like. Noto Sans is used (as defined in system-ui but some parts of the UI (including the search bar) uses a monospaced font instead.

And this is in Cantarell.

I found out the font weight combinations are not suitable for Noto Sans and Cantarell

    --text-weight-normal: 300;
    --text-weight-bold: 400;
    --text-weight-bolder: 600;

So I changed it to 400/600/700 for best results:

The monospaced font bug still exist on Noto Sans, though.

[veler]

It looks good to me, thank you for this contribution! :)