1
Hi,
Firstly,
I am completely new to this.
I had an idea:
Offer a button on the theme to switch from light to dark mode.
I was inspired by what Richard did with the xSwatch4 theme and the toggle to show or hide the toolbar
I started the code based on his work but I have no javascript skills.
Here is what I did:
In the nav-menu.tpl file
I added line 6:
le="color: #000000"><?php <a class="btn btn-secondary" href="javascript:xswatchLightingToggle();" role="button"><span id="xswatch-lighting-ind"></span></a>
then at the end of the same file, I added a script:
le="color: #000000"><?php <script type="text/javascript"> // Alain function xswatchLightingIndLight() { $('#xswatch-lighting-ind').attr('class', 'fa fa-sun-o fa-fw'); // $('#xswatch-lighting').show(); $('#$xswatchCss == 'css-cerulean'); } function xswatchLightingIndDark() { $('#xswatch-lighting-ind').attr('class', 'fa fa-moon-o fa-fw'); // $('#xswatch-lighting').hide(); $('#xswatchDarkCss == 'css-slate'); } function xswatchLightingToggle() { var lighting_cookie = Cookies.get('xswatch-lighting'); if (lighting_cookie == 'off') { lighting_cookie = 'on'; xswatchLightingIndLight(); } else { lighting_cookie = 'off'; xswatchLightingIndDark(); } Cookies.set('xswatch-lighting', lighting_cookie, { expires: 365, sameSite: 'strict' }); } // set initial conditions based on cookie var lighting_cookie = Cookies.get('xswatch-lighting'); if (lighting_cookie == 'off') { xswatchLightingIndDark(); } else { xswatchLightingIndLight(); } </script>
I know that the code
$('#xswatchDarkCss == 'css-slate');
is not correct, but i dont know How to do that...
So I need some help !
Thank you
