Custom theme works only if I don't change anything!

I’m trying to customize the Runo theme. My VAADIN/themes/mytheme/styles.css file:


@import url(../runo/styles.css)

/* Lay the options horizontally */
.v-select-optiongroup-horizontal .v-select-option {
    display: inline-block;
}

The above results in no Runo CSS being shown by the browser (tried most recent Chrome and Firefox).

If I remove my single custom (test case) and go with


@import url(../runo/styles.css)

then everything works fine. I get the same behavior using reindeer and chamleon-blue. Any time I put any of my own CSS before or after the @import url(…/runo/styles.css) I get no CSS styling from that builtin theme.

I’m using Vaadin 6.8.1.

I’m beating my head on the desk an quick a bit on this one! Help!

mike

I really don’t see any reason why this could happen.

Check the file permissions to be sure that you haven’t accidentally changed their owner or something like that. Then check with Chrome inspector or FireBug (Network tab) whether there are any errors loading some of the files, and what CSS files it actually tries to load.

Hi Henri,

There are no file permission problems.

Using Chrome’s console I can see Chrome load all the css files fine when my vaadin styles.css has only the import of the runo theme. When I add some simple css to the same styles.css file and reload the html page, Chrome does not load the VAADIN/theme/runo css at all. The Chrome console shows no errors.

There is a noticable delay of about 1-2 seconds loading the Vaadin app in the browser when using a customized styles.css. The same page loads almost instantly when styles.css has only the import of runo.

Attached are the generated HTML pages for the working and broken cases. The pages are the same except for some kind of identifier value.

I’m really pulling my hair out over this one! Good thing I don’t keep any guns near my desk. :slight_smile:

mike
12456.html (2.51 KB)
12457.html (2.51 KB)

Could it be a missing semicolon at the end of the import?

@import url(../runo/styles.css);

I forgot the semi-colon!!! Yup, that was the problem indeed. I fill pretty stupid. :frowning:

Thank you very much Jens!

mike