MyBB Community Forums

<a class="switcher-mode-on hide"><i class="fas fa-moon"title="Open Game Mode">Night Mode</i></a> <a class="switcher-mode-off hide"><i class="fa fa-sun" style="color: darkgreen" title="Close Game Mode">Day Mode</i></a>

This is just creating two icons with separate links...

i want to creat one icon that includes two both of them links and when I will click its change to moon icons to sun icons...


for example (it should be)now the single link appearing as "🌙 night mode"


when i will click to it it will turn to this -->
"☀Day mode"



i just don't want stretch tye header please suggest...

Hi,

you could use CSS Image Sprites:

https://www.w3schools.com/css/css_image_sprites.asp

You can do something like

<div class="scheme-switcher">
<i class="scheme-switcher__symbol scheme-switcher__symbol--dark"></i>
<i class="scheme-switcher__status scheme-switcher__status--off"></i>
<i class="scheme-switcher__symbol scheme-switcher__symbol--light"></i>
</div>

And just add the css.

Check out a demo at: https://devilshakerz.com/mybb6122/

(2020-10-20, 12:38 PM)Dev0908 Wrote: [ -> ]You can do something like

<div class="scheme-switcher">
<i class="scheme-switcher__symbol scheme-switcher__symbol--dark"></i>
<i class="scheme-switcher__status scheme-switcher__status--off"></i>
<i class="scheme-switcher__symbol scheme-switcher__symbol--light"></i>
</div>

And just add the css.

Check out a demo at: https://devilshakerz.com/mybb6122/

And the css must be ?

I never used this https://community.mybb.com/mods.php?acti...w&pid=1149

But check it out might be what u like. And I cant tell u the css that is something you need to write.