search

okkur / syna

Highly customizable open source theme for Hugo based static websites
https://syna.okkur.org/demo/
Apache License 2.0
250 stars 134 forks source link

Unable to change colors in config.toml #758

Closed JoshuaKissel closed 4 years ago

JoshuaKissel commented 4 years ago

Is this a BUG REPORT or FEATURE REQUEST?: bug

What happened: Attempting to change the color option in the config.tolm file. When I change and save the file I am given the error .File.Dir on zero object. Wrap it in if or with: {{ with .File }}{{ .Dir }}{{ end }} and the color does not change. Not sure what to wrap with if or with.

What you expected to happen: I expected that changing the color code in config.toml would change the color in the site.

Environment:

stp-ip commented 4 years ago

The site works without changing the color? What theme version are you using? What hugo version are you using? Are you using the starter repo from https://github.com/okkur/syna-start?

The zero object warning is usually just a warning and shouldn't impact site rendering and all the warnings should have been fixed. Related issue: https://github.com/okkur/syna/issues/728

The color change seems to work in my tests. Would be great, if you can show the config you are trying to use to change the colors. Some additional docs would be great. Related issue: #750

JoshuaKissel commented 4 years ago

The site works without changing the color?

Yes

What theme version are you using?

version = "0.17.0"

What hugo version are you using?

v0.69.2-EC9DCF30

Are you using the starter repo from https://github.com/okkur/syna-start?

Yes

The zero object warning is usually just a warning and shouldn't impact site rendering and all the warnings should have been fixed. Related issue: #728

The color change seems to work in my tests. Would be great, if you can show the config you are trying to use to change the colors. Some additional docs would be great. Related issue: #750

Example: in the config.toml file I changed primary = "#00838F" to primary = "#0000FF" and receive the warning `".File.Dir on zero object. Wrap it in if or with: {{ with .File }}{{ .Dir }}{{ end }}".' Any fragments that had 'background = "primary"' render as the original #00838F color and not #0000FF.

IvanTurgenev commented 4 years ago

save some headaches hugo server -D --disableFastRender

stp-ip commented 4 years ago

@IvanTurgenev sidenote on that comment. Our use of fragments and partials seems to be suboptimal with the Hugo cache changes so might be a generally good thing to add to documented commands.

stp-ip commented 4 years ago

@JoshuaKissel Cleaned up the comment to make it more readable. Github flavored markdown needs whitespace between the end of a comment declarated by > and the response or it will formatted as being part of the comment.

Will try to recreate the issue locally. Thanks for the info.

JoshuaKissel commented 4 years ago

I was wondering if this has been solved yet- I am running syna version 0.17.3 on hugo 0.74.3. In the config.toml file I see a list of param.colors: param color I would assume that changing the hex code (ie from "primary = #000000" to "primary = #ffffff") would change the color associated with that name, but no change occurs. Am I changing this in the correct file?

stp-ip commented 4 years ago

@JoshuaKissel Are you running with the extended version? This is necessary to rebuild the CSS assets, which would incorporate these styling changes.

JoshuaKissel commented 4 years ago

@stp-ip I don't believe so, is there a way to check that? Could you explain what the extended version is more? I'm still pretty new to this.

stp-ip commented 4 years ago

You can run hugo version, which should show something along the lines of v0.74.1-15163266/extended, if it is the extended version.

Hugo basically ships in 2 versions. One can't recompile specific assets such as CSS and JS and uses pre-compile ones including the pre-compiled colors (non extended) and the other can recompile the CSS including the colors.

The Hugo extended version is available here as well: https://github.com/gohugoio/hugo/releases

You would also currently need postcss-cli until this issue is merged and release, which is currently a bit delayed: https://github.com/okkur/syna/pull/816

JoshuaKissel commented 4 years ago

Was able to get this to work by following @stp-ip instructions. Download and install the extended version of Hugo, download newest version of Syna, install postcss-cli (if on windows follow the install process for npm then in powershell run npm install -g postcss-cli to install postcss-cli.) I was then able to change the color hex number and effect the background colors on my localhost.

Not sure if instructions like this are allowed - figured it would help others.

stp-ip commented 4 years ago

Sure. Don't use windows myself. So that sounds good. The need for postcss-cli should be removed with #816 merged, but there is still a blocker as the test server is having issues.

Closing this for now as it is working as you mentioned.

0xffset commented 3 years ago

Hi, I had the same issue. To solved just I installed postcss with npm install postcss