gwt 2.7.0 background-image for body

Question

I'd like my login page to have a background image in the body. Here's what I have so far:

public interface MyResources extends ClientBundle {
    public static final MyResources INSTANCE = GWT.create(MyResources.class);

    @Source("css/login.css")
    public MyLoginCssResource loginCss();

    @Source("css/GWT_App.css")
    public CommonCss commonCss();

    @Source("img/logo.png")
    @ImageOptions(repeatStyle = RepeatStyle.Both)
    ImageResource backgroundImage();
}

public interface CommonCss extends CssResource {

    String body();
}

.body {
    background-color: white;
    gwt-image: 'backgroundImage';
}

How do I reference the commonCSS in my ui.xml-file if I already have the loginCss referenced?

<ui:with field='res' type='client.resources.MyResources' />

<g:HTMLPanel addStyleNames="{res.loginCss.maindiv}">
</g:HTMLPanel>
</ui:UIBinder>

and also, how can I set a style for the body tag in a ui.xml-file?

Answer 1

How do I reference the commonCSS in my ui.xml-file if I already have the loginCss referenced?

<g:HTMLPanel addStyleNames="{res.loginCss.maindiv} {res.commonCss.body}"/>

and also, how can I set a style for the body tag in a ui.xml-file?

As far as i know you can't access body from ui.xml file. There're a few ways to have this background ONLY in the login page. The simplest one is to wrap all the page in a container block

    <g:FlowPanel addStyleNames="{res.commonCss.body}">
       <g:HTMLPanel addStyleNames="{res.loginCss.maindiv} "/>
   </g:FlowPanel>

So on the navigation from the login page - the background won't stay there.

And in case you want a permanent effect - you can just add css in your index.html file, as a regular css for body tag