JuiceUI Change Theme / Style

Question

Is there an option to change the styles of JuiceUI controls? Any predefined themes? (If yes, I couldn't find any documentation on it.) Do I style them with regular CSS like other controls? (That didn't seem to work either.)

TIA

Edit: Here's how the button looks: (I had no preinstalled jquery themes in this one - this is a new website.)


I did notice JuiceUI installed a content - themes folder with base, Fresh-Squeezed and Supercharged.

Don't know where it's being referenced though and how to change it.

Answer 1

At the moment, the source for JuiceUI can be your best friend. Check out this line: https://github.com/appendto/juiceui/blob/master/Juice/JuiceApp.cs#L52

This is what you'll want to add to Global.asax.cs:

CssManager.CssResourceMapping.AddDefinition("juice-ui", new CssResourceDefinition {
    Path = "~/Content/themes/[Name of custom theme dir]/jquery-ui-1.8.18.custom.css",
    DebugPath = "~/Content/themes/[Name of custom theme dir]/jquery-ui-1.8.18.custom.css"
});

This will redefine the location of the "juice-ui" rendered theme, and you'll see that output in each page juice is used on.

Sorry this isn't more obvious at the moment. We're planning on a series of articles to cover topics such as these and updating the documentation on the site is already in the works.