How to change color

[hahoangnhan]

Hi @marvinschmitt, I'm using your page repository for my website, and I've recognized that all hyperlinks are currently orange, which I believe is the main color in your theme. I'd like to change this to a darker color for better readability across the entire site, not just the landing page.

What I've tried: I've attempted to modify the html/styles.scss file, specifically these lines:

// Links
$link-color: $orange !default;
$link-decoration: none !default;
$link-hover-color: $orange !default;
$link-hover-decoration: underline !default;

However, this didn't have the desired effect. What I need help with:

1. How can I change the hyperlink color for the entire site to ensure a consistent format?
2. Are there any other files I need to modify besides _sass/minimal-mistakes/_variables.scss?
3. Is there a specific way to override the default color settings?

Additional Information:

You can find my repository here

Thank you for your help! HHN

[marvinschmitt]

Hi @hahoangnhan,

Thanks for reaching out.

Generally speaking, I would strongly advise against building on top of this website. It's a huge patchwork of hotfixes and overrides, and the project structure is awful (like things scattered in folders where they don't belong). In short, I have accidentally built a pile of technical debt that doesn't let me simply change things like link colors consistently.

Doing a full refactor that might make this hot mess even remotely useful for others is on my to-do list but I haven't found the time and patience for that yet.

I would recommend building on the much cleaner tutorial template repository instead: https://github.com/marvinschmitt/quarto-website-template

If you like the landing page hero ("Hi, I'm ..." etc), you can just re-use parts of the index.qmd in the base directory, and the overall settings will be less of a pain. Then you can also just change the colors in the hero section so that you don't have the very same orange.

A minor request: I would appreciate it if you removed the orange hexagon from the navigation bar. I have designed that as a personal icon (favicon / logo) and it feels odd to see that on other people's websites 😄

Best, Marvin

[hahoangnhan]

Ahh, thank you for your suggestion. I just forked and modified it conveniently. But as you said, there are several settings that are hard to control. I didn't realize the logo should not be used. I'll remove it. Best, HHN

[hahoangnhan]

A minor request: I would appreciate it if you removed the orange hexagon from the navigation bar. I have designed that as a personal icon (favicon / logo) and it feels odd to see that on other people's websites 😄

Hi @marvinschmitt, which setting file can I edit the personal icon? I couldn't find any lines related to the logo in the main index, the style.scss file as well as the yml file. Thank you so much!

[marvinschmitt]

Navbar logo in the quarto config: https://github.com/hahoangnhan/hahoangnhan.github.io/blob/gh-pages/_quarto.yml#L48

I am on mobile right now, so I'll only write a short answer. Thanks and see you!

[hahoangnhan]

Navbar logo in the quarto config: https://github.com/hahoangnhan/hahoangnhan.github.io/blob/gh-pages/_quarto.yml#L48

I am on mobile right now, so I'll only write a short answer. Thanks and see you!

The logo was removed. Thank you so much!