XF 2.2 Extra.less for Admin CP

TheSkullKid

Active member
Hello everybody,

is there something similar to the public extra.less template for the admin control panel?
Where can I add CSS code for the admin control panel?

Thx
 
Solution
Ah that's actually my mistake, the control panel will always use the master style, which is not editable. You could still accomplish this by creating an add-on with a template modification that applies your desired changes to extra.less, but of course that's more cumbersome.
Ah that's actually my mistake, the control panel will always use the master style, which is not editable. You could still accomplish this by creating an add-on with a template modification that applies your desired changes to extra.less, but of course that's more cumbersome.
 
Solution
No you don't need an addon. And master style is editable. You need to open Development Mode and then you can find Master Style and its templates. I've already customized my admin panel.

1625385198277.webp
 
Ah that's actually my mistake, the control panel will always use the master style, which is not editable. You could still accomplish this by creating an add-on with a template modification that applies your desired changes to extra.less, but of course that's more cumbersome.
that was the answer I need, i will test it right now.

Edit: Great it works, thx
 
Last edited:
@Jeremy P thanks for your help.
Please could you explain me why CSS will not be updated, if I use an option variable in the LESS code, it seems that I need to rebuild something to take place. Or is it not good to use option variables in that way?
 
CSS is cached for performance reasons, so you shouldn't typically use options in that way. You can usually get away with dynamically applying classes in the template instead:

HTML:
<div class="{{ $xf.option.foo ? 'elm--class1' : 'elm--class2' }}">

Depending on your use case, it is possible to clear the CSS cache when an option is updated using the \XF\Option\Style::triggerStyleUpdate callback, but I would typically reserve that for when the above is not feasible.
 
So, I successfully made an addon that modified extra.less (master style) to change CSS in the ACP. It works on my development site. But on the production site (where I have limited access to ACP), the master style is not listed in the styles tree, and my addon does not function (at least not for me). Is there a permission setting which can make the master style invisible to users in the ACP? Why else might my addon function on development but not on production, with nearly identical copies of XF on both?
 
The master style only appears in development mode. You should be able to see whether the modification is being applied correctly on the template modifications pages.
 
Back
Top Bottom