style(scss): Fix various accessibility issues

[TheEvilSkeleton]

Description

This improves the contrast of certain text elements to make it easier to read.

Type of change

• Bug fix (non-breaking change which fixes an issue)
• New feature (non-breaking change which adds functionality)
• Improvement (refactoring and improving code)
• Breaking change (fix or feature that would cause existing functionality to not work as expected)
• Documentation update

Additional context

Fixes #1095

How has this been tested

• I have run bash ./tools/test (at the root of the project) locally and passed
• I have tested this feature in the browser

Do note that I haven't generated the website as it doesn't work for me on neither this branch and the master branch. I used Firefox DevTools.

Using https://orowith2os.gitlab.io/posts/Flatpak-an-insecurity-nightmare as an example:

Before	After

[sublimeclemency]

@TheEvilSkeleton thanks for the effort. this helps me with my own blog css styles.
In the first commit of this draft, you changed _sass/addon/module.scss %sidebar-links to make the color darkgray. this only has a good effect in dark mode.
for better accessibility, change to var(--text-color)

[TheEvilSkeleton]

Good point, thanks!

[TheEvilSkeleton]

I bumped the contrast of --text-color so that --text-muted-color could be bumped as well. To be honest, I think it looks better that way.

Before	After

[TheEvilSkeleton]

Before	After

[TheEvilSkeleton]

@sublimeclemency it's ready for review

[Mohamed3nan]

can we make all edits to this file "\assets\css\style.scss" ? or it's for something else?

---
---

@import '{{ site.theme }}';

/* append your custom style below */

instead of editing the core theme ".scss" files!

[TheEvilSkeleton]

The goal is to fix various accessibility issues within the core theme.