Removing Valo results in SEVERE: CSS files may have not loaded properly."

Flow
1

Hi,

I am trying to integrate Bootstrap into Vaadin. This is nearly working now, but I still have one persistent issue. I need to remove the Valo theme, as it interferes with Bootstrap. So I’ve commented out the import and include lines in my bootstrap-test-theme.scss file, like this:

[code]
/* @import “…/valo/valo.scss”; */

@mixin bootstrap-test-theme {
/* @include valo; */

}
[/code]The result is a web page that looks correct, but I see this error message in the browser’s console:

vaadinbootstraptest.BootstrapTestWidgetset-0.js:6170 Sun May 01 16:15:56 GMT+200 2016 com.vaadin.client.ApplicationConnection
SEVERE: CSS files may have not loaded properly.

Also, the page takes a long time to load as it wait for some timeout before displaying this error message.

So what I’m wondering is, how can I remove the Valo theme completely without breaking things? Can I replace Valo with some minimal theme just to avoid this error?

2

You need to have an explicit size defined for the loading indicator element, the client side engine measures that and determines that the theme has been loaded once that element has a non-zero height.

See here for reference:
https://github.com/vaadin/vaadin/blob/master/themes/src/main/themes/VAADIN/themes/base/common/common.scss#L190-206

Also, have you seen my (very old) bootstrap integration prototype?
https://github.com/jouni/bootstrap-for-vaadin