How do I declare a LESS variable + is it possible to add to color palette?

  • If I wanted to add a variable '@menuTextColor' in the LESS Variables Override section, how do I go about this? I get an error saying that the variable is not recognised, so I assume it has to be declared somewhere.


    Additionally, if I instead wanted to add this as an option to the Color Palette, is this possible?

  • You can define custom variables within the additional LESS/CSS input field, in fact this field allows for arbitrary input as long as it is well-formed LESS or CSS.


    Adding custom items to the color palette is possible, but requires an event listener and a template listener.

    Alexander Ebert
    Senior Developer WoltLab® GmbH

  • You can define custom variables within the additional LESS/CSS input field, in fact this field allows for arbitrary input as long as it is well-formed LESS or CSS.


    Ah, I was adding it to the LESS Variable Override section - I didn't realize it would work fine in a CSS document like that.


    Adding custom items to the color palette is possible, but requires an event listener and a template listener.


    I will look into it. I'm still learning the inner workings of this forum software so I will mess around with that when I get a better understanding of it all. I was hoping there might be some xml document per-style where I could easily edit the color palette, but if it's anything complicated I don't think it's worth the trouble :)

  • Your input inside the individual CSS and LESS will be compiled by a PHP LESS compiler so that every LESS will work fine. :)

  • Quick question - is there any reason that the css I see in Edit Style > Advanced Settings is far less than what I see at wcf/style/style-x.css? I'm having to use !important to overwrite some of the default css values which does not appear in the ACP style editor. My style is an edited duplicate of Blue Temptation.

  • The system uses a set of pre-defined less files which are included first and are not accessible through the editor. Take a look at the Basic style, everything you see is provided by these base files.


    These files are located in wcf/style/ and should not be edited as they will be overwritten during an update. You can review all CSS provided by them online on https://github.com/WoltLab/WCF…setup/install/files/style

    Alexander Ebert
    Senior Developer WoltLab® GmbH

  • I'm having to use !important to overwrite some of the default css values which does not appear in the ACP style editor.


    Using more specific selectors should also work. I rarely have to use !important at all (there might be some cases where it's required, but that is rare).

    "A life is like a garden. Perfect moments can be had, but not preserved, except in memory. LLAP" — Leonard Nimoy


  • Using more specific selectors should also work. I rarely have to use !important at all (there might be some cases where it's required, but that is rare).


    Yea, I've found the same, the only one I had trouble with was the search placeholder text color.


    Thanks for clearing this up everyone!

  • ea, I've found the same, the only one I had trouble with was the search placeholder text color.


    The search placeholder is troublesome either way, since its behavior is heavily browser dependent.

    "A life is like a garden. Perfect moments can be had, but not preserved, except in memory. LLAP" — Leonard Nimoy