dotless.NamedThemes – add file-based theme switching in .less css preprocessing

I’ve just released a new project on github and at which helps you provide switchable themes when using the dotless┬áLESS handler.

Here’s what you need to do. First, add it to your projet using the NuGet package;

Then enable the plugin by adding it to the <dotless> element in web.config;

<dotless minifyCss="false" cache="false" web="false">
    <plugin name="NamedThemesPlugin" assembly="dotless.NamedThemes" />

Tell the web.config about the folder that holds your theme files;

        <add key="dotless.NamedThemes:ThemeBaseUrl" value="~/Content/Themes" />

Write files named after your theme;

// ~/Content/Theme/blueTheme.less

Now, the clever bit; in your actual .less file, use the getThemeColor function;

// ~/Content/themeAware.less

And make sure you pass the @theme variable in the url;


Voila! The theme name and the theme-specific colour are retrieved by the plugin.