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.


Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s