danielsantos
danielsantos

@ericgregorich I loved what you created with your Cards theme!

I wonder if you can give me any advice on how I could make it sensitive to current devices' dark or light mode selection, or how to make a switch to toggle between them?

|
Embed
ericgregorich
ericgregorich

@danielsantos I’m not 100% certain about the dark/light mode selection. I have an article saved I was going to try sometime.

I haven’t looked I to it much yet.

|
Embed
danielsantos
danielsantos

@ericgregorich Interesting share, thanks 🙏

Not a CSS expert myself, but as I’m curious enough, I guess I’ll try to experiment with it and, if I get somewhere I’ll share the progress with you :)

|
Embed
ericgregorich
ericgregorich

@danielsantos Yeah, I've been wanting to learn how to do it. Maybe this weekend.

|
Embed
danielsantos
danielsantos

@ericgregorich I kind of got something working. See my site and the small switch on the top right… the thing is it only works on the homepage.

I’m not the best figuring out Hugo tenpkates, I’ve always worked with them on a trial and error basis. I wish to share what I have produced with you, just don’t know how to do it…

|
Embed
JohnPhilpin
JohnPhilpin

@danielsantos nicely done

|
Embed
ericgregorich
ericgregorich

@danielsantos Nice!

It looks like you have the CSS working on all pages, but maybe not the JavaScript. Which file did you add the JavaScript to? Index.html? Maybe putting it in layouts/_default/baseof.html will apply to all pages.

I hope to play around with it this weekend.

|
Embed
ericgregorich
ericgregorich

@danielsantos, I have it working on my test blog. I added the script to the bottom of the footer.html, which is applied to every page after the toggle loads. https://ericgregorich-test.micro.blog

|
Embed
danielsantos
danielsantos

@ericgregorich Fantastic! I didn’t think of adding the JS to the footer file… like I said, I’m a Hugo themes reader under improvement… I’ll see if I apply it tonight and it will probably work. Btw, to experiment with all this dark/light theme toggling, I cloned your theme and added dark color options to plug-in.json… just don’t know how to make it work…

|
Embed
ericgregorich
ericgregorich

@danielsantos My Cards theme is already updated with these changes. I just haven't tested and pushed out a new version yet. If you pull the latest from my github, you should get the updates, including the plugin settings updates. If you want to help verify it works?

|
Embed
danielsantos
danielsantos

@ericgregorich Nice! I’ll make the changes shortly and let you know! Thank you very much Eric 🙏

|
Embed
danielsantos
danielsantos

@ericgregorich worked like a charm! I just tweaked the font family to Inter, and it’s size to increase it a bit (over 40 here, lol), all via custom CSS.

|
Embed
ericgregorich
ericgregorich

@danielsantos Looks great! I'm happy we can customize anything we want even when using a custom theme.

|
Embed
danielsantos
danielsantos

@ericgregorich yes, that’s certainly something fantastic about MB and Hugo :)

|
Embed