Dark Mode Toggle

I have tried and tried again to get this toggle to work. I have included a link to my github repo. In the top part of the script.js file is the over-engineered script that I commented out. Below is the script Kevin had on youtube. Any help on this is much appreciated! PS: This is the error I get : TypeError: can't access property "addEventListener", darkModeToggle is null https://github.com/andrewteece/social-media-dashboard
GitHub
GitHub - andrewteece/social-media-dashboard
Contribute to andrewteece/social-media-dashboard development by creating an account on GitHub.
17 Replies
Andrew
AndrewOP16mo ago
Got the error fixed. It was a simple typo, but the script does not work.
sacarima (Class - 50)
I was looking at it, was it the toogle id typo?
Andrew
AndrewOP16mo ago
Yes it was. So that problem is fixed, but now the script does not do anything. Watching the dev tools and the body should have "darkmode" added to it with the script, but that does not seem to happen.
ἔρως
ἔρως16mo ago
where can we see this running?
sacarima (Class - 50)
clone the repo, @epic2937 @andrewteece the problem now is with your css, i'm trying to figure it out
Andrew
AndrewOP16mo ago
Thats what I was thinking. My commented out code at the top of the script.js file was the original code I wrote. The code being used now it the code I found from Kevin. The css is still written for the original js code. @sacarima thank you This problem is driving me insane lol
ἔρως
ἔρως16mo ago
it's not a css or a javascript issue: it's an issue with you not using the right variables none of the variables inside the .darkmode are used anywhere
Andrew
AndrewOP16mo ago
ok I will look at that @epic2937 thank you
ἔρως
ἔρως16mo ago
you're welcome
Andrew
AndrewOP16mo ago
Just going to redo the variables
ἔρως
ἔρως16mo ago
you don't need to re-do, you just need to use the ones you had, but weren't using also, since you're using scss, i would recommend that you create a map with all the colors, instead of manually creating the variables
Andrew
AndrewOP16mo ago
great thank you for your help
ἔρως
ἔρως16mo ago
you're welcome
Andrew
AndrewOP16mo ago
Something like this map but for colors
@use 'sass:map';

$font-sizes: (
'400': 1.125rem,
'500': 1.25rem,
'600': 1.5rem,
'700': 2rem
);
@use 'sass:map';

$font-sizes: (
'400': 1.125rem,
'500': 1.25rem,
'600': 1.5rem,
'700': 2rem
);
ἔρως
ἔρως16mo ago
yes
Andrew
AndrewOP16mo ago
Very helpful advice, thanks again
ἔρως
ἔρως16mo ago
you're welcome
Want results from more Discord servers?
Add your server