19

In a project I'm working on we have a /themes/ directory with all the jQuery ui-themes in it. I get that they overwrite certain styles of the base class, but why are there two different css files (jquery.ui.theme.css and jquery-ui.css)? AND why are they seperate? Do I need to include both, or just one?

0

5 Answers 5

29

Docs say that jquery-ui.css is just jquery-ui.theme.css appended to jquery-ui.structure.css. If you download these files from ThemeRoller both jquery-ui.css and jquery-ui.theme.css will contain custom changes. jquery-ui.structure.css remains the same across customizations.

The theme file is responsible for the look and feel whereas the structure file is responsible for the layout and functionality.

Some reasons for not using jquery-ui.css

It makes sense to offer a split version of these files in order to use something like cdnjs for jquery-ui.structure.css but your own server (or CDN solution) to deliver your customized jquery-ui.theme.css.

Or if you use multiple themes on your site it allows for smaller data traffic because the browser might already have a cached version of jquery-ui.structure.css when encountering an uncached theme (jquery-ui.theme.css).

Sign up to request clarification or add additional context in comments.

2 Comments

I'm still not sure what is this mean? I'm looking at themeroller files and there is only one css file in it (one min and one expanded) but you are saying themeroller modifying both files. Are you saying I should use ui-structure.css and themeroller theme (e.g, start.css) and jquery-ui.css and ui.theme.css or just structure and themeroller file?
@AaA I don't know about start.css. Also when I look at a newly created themeroller zip then there are all the files mentioned in my answer, not just one css file. If you are unsure about the whole thing you can just use jquery-ui.css and it will contain everything including the customizations you made before downloading the zip.
6

I'm not sure if this is a common idiom in jquery, but the content of jquery.ui.theme.css was a subset of the content in jquery-ui.css. It seems that the latter also had CSS styling for many of the common ui components. So I've deleted jquery.ui.theme.css and kept jquery-ui.css.

Comments

6

Simply answer is --> The jquery-ui.css file contains both jquery-ui.structure.css and jquery-ui.theme.css.

Comments

1

Stole this quote word for word from the JQuery Docs. This is exactly what you were asking for.

Since the framework styles only cover look and feel, plugin specific stylesheets are separated. These contain all the additional structural style rules required to make the widget functional, such as dimensions, padding, margins, positioning, and floats. When downloading jQuery UI, these can be found in jquery-ui.structure.css.

Comments

-1

Jquery- ui- theme is a folder or link or file to access different themes or styles(.css) of jquery ui; such as 'smoothness', 'black-tie', 'blitzer', 'cupertino', 'dark-hive', 'humanity', 'sunny', 'vader', etc. example:

<link href="jquery_ui/jquery-ui-themes-1.10.2/themes/vader/jquery-ui.css" rel="stylesheet">

Jquery -ui- css is a folder or link or file to access the 'default theme' or default style sheet of jquery ui which is 'smoothness'.

2 Comments

How is this a "perfect" answer? The reply indicates that "Jquery-ui-theme" is a "folder or link or file"... So which is it? The question is not about folders or links. It is specifically about the difference between two .css files provided by the jQuery UI ThemeRoller engine, which are: jquery.ui.theme.css and jquery.ui.css. Also, question asked if both are necessary, which answer did not address. Answer suggests that jquery-ui is only a default so that tells me that if using a theme then it wouldn't be needed... It would be nice to get a more details here because I have same questions as O.P.
Also, the ThemeRoller tool doesn't produce anything called jquery.ui.theme.css; it produces theme.css and jquery-ui.css. Once again, I would like to know the detailed difference between the two of these and why you would use one versus the other--or, if both are needed, in what order should they appear when referenced?

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.