GWT theme style overrides my css style

Question

I have some html files with their own css. I want to use them in a gwt application so i copied the html and the css files in the application.

The problem is when i open the html it uses the gwt theme style. For example in my css the html 'body' background color is black, but it looks white unless i deactivate the theme.

How could I override the gwt theme style and use my css styles?

Answer 1

This post on the GWT mailing list describes an alternative solution. You have to create a new ClientBundle which references your CSS file:

import com.google.gwt.core.client.GWT; import com.google.gwt.resources.client.ClientBundle; import com.google.gwt.resources.client.CssResource;  public interface Resources extends ClientBundle {        public static final Resources INSTANCE = GWT.create(Resources.class);         @Source("style.css")       @CssResource.NotStrict       CssResource css(); } 

And then inside your onModuleLoad() method you have to inject the CSS file:

public class YourApp implements EntryPoint {      public void onModuleLoad() {         //...         Resources.INSTANCE.css().ensureInjected();          //...     } 

In my opinion this is the cleanest and easiest way to override the styles.