Light bulb theme switcher

Light bulb theme switcher

JoyFreak

Well-known member
JoyFreak submitted a new resource:

Light bulb theme switcher - Have your very own light bulb theme switcher on your board!

PAGE_CONTAINER
Find:
Code:
<div class="p-sectionLinks">
Add below:
Code:
<div class="lightbulb"><a href="YOUR THEME URL"><i class="far fa-lightbulb-on" style="color:#FFF"></i></a></div>

Note: To find your theme URL. On the style chooser, right click on theme you wish to use and copy link address.

EXTRA.less
Add:
Code:
.lightbulb {
    font-size: 1.0rem;
    float: right;
    padding-top: 6px;
    padding-bottom: 6px;
    padding-right: 15px;
}

Read more about this resource...
 

Brad Padgett

Well-known member
I still recommend my add-on. Only because it gives you a prompt to ask if you want to switch themes. My add-on automatically switches the theme when you click the light bulb and switches back when you click it again:

 

JoyFreak

Well-known member
You have this working on a default style?

It should work with the default theme. Any issues, then do let me know.

I still recommend my add-on. Only because it gives you a prompt to ask if you want to switch themes. My add-on automatically switches the theme when you click the light bulb and switches back when you click it again:


People can choose to use an add-on or use this quick template edit. I simply made this on a theme that already had the function and realized this after I had created it. Thought I'd release it so it's not time wasted.
 

Malcolm M

Well-known member
I still recommend my add-on. Only because it gives you a prompt to ask if you want to switch themes. My add-on automatically switches the theme when you click the light bulb and switches back when you click it again:

Hey I think both addons are great but I think you should let the member find your addon on their own as this is someone else’s addon.
 

korhox

Member
Hayo!

Thanks for the idea! Got this working!

Instead of normal style link I copied this from style_chooser:
{{ link('misc/style', null, {'style_id': 0, '_xfRedirect': $redirect, 't': csrf_token() }) }}

You will need to replace style_id to your style ID.

When generating the style link with this, the link will redirect user to the page they were on.
 

daimpa

Active member
@JoyFreak Woah, it seems to work perfectly! Why did it got not that much attention?? It deserves a lot more!
It's still working 100%, am I right or am I missing anything?
 

zonzon

Member
this work with xf.2.2.2 !!

but maybe somebody will tell how I can modify css code
Code:
.far.fa-lightbulb-on:hover {
    color: yellow !important;
}

to make hover with other fontawesome icon ?
 
Top