How can you change background colour? about hallo-hugo HOT 7 CLOSED

Hi @swade1987, the easiest way at the moment is to use Hugo Theme Components.

1. In your themes folder, create an additional folder next to the folder you already have for Hallo, e.g. my-hallo.
2. Inside this folder, create the file assets/scss/hallo/_variables.scss. You can copy this file over from Hallo if you like.
3. Alter the different variables used in this file. Currently background-1 is used as the background colour; background-2 is unused. I may remove the unused variable in the future, so keep an eye on the release notes for the theme.
   For example, to make the background red, use$background-1: #ff0000;.
4. Alter the config.toml of your site to make use of both themes: theme = ["my-hallo", "hallo"]. Hugo will then first look in my-hallo for the files it needs, before using the files in hallo.

It seems like a good idea to add functionality to the theme to make this process easier. I will look into this!

from hallo-hugo.

I tested a little bit further and actually there is no need to create an additional theme folder. You can just create assets/scss/hallo/_variables.scss directly in the root folder of your site. Then there's no need to alter config.toml either. So ignore steps 1 and 4 and just perform steps 2 and 3 in the root folder of your site instead.

from hallo-hugo.

Awesome thanks for this @EmielH trying to work out how easy it'd be to switch to an image as well.

from hallo-hugo.

FYI ... it changes the colour when running locally.

However when deployed via Netlify it does not.

See https://github.com/swade1987/swade1987.github.io and https://www.stevenwade.co.uk/

from hallo-hugo.

That's too bad! Do you know whether it works when you have Hugo generate for production on your own machine? So just hugo instead of hugo serve. I'm curious if the problem is with Netlify or with the Hugo build. Unfortunately I don't have time to look into this myself the next couple of days...

from hallo-hugo.

@swade1987 I created configuration options for the colours that the theme uses. Can you check whether this fixes your problem on Netlify? Thanks!

from hallo-hugo.

Closing this issue. A new configuration option was added in version 2.0.0.

from hallo-hugo.