<!DOCTYPE ui:UiBinder SYSTEM "http://dl.google.com/gwt/DTD/xhtml.ent">
<ui:UiBinder
  xmlns:ui='urn:ui:com.google.gwt.uibinder'
  xmlns:m='urn:import:com.google.gwt.mobile.client'
  xmlns:g='urn:import:com.google.gwt.user.client.ui'
  xmlns:a='urn:import:com.google.gwt.sample.gaerequest.client'>
  xmlns:r='urn:import:com.google.web.bindery.requestfactory.ui.client'

  <ui:image field='add'/>
  <ui:image field='refresh'/>

  <ui:style field='mobile' src='mobile.css'>
    @sprite .refresh {
       gwt-image: "refresh";
     }
    @sprite .add {
       gwt-image: "add";
     }
     .button {
        cursor: pointer;
      }
      .backButton {
        cursor: pointer;
      }
      .customButton {
        cursor: pointer;
      }
  </ui:style>
  
  <g:HTMLPanel>
    <a:LoginWidget styleName='{mobile.login}' ui:field="loginWidget"/>
    <div class='{mobile.bar}'>
      <g:HTML ui:field='backButton' styleName='{mobile.backButton}'><div>Back</div></g:HTML>
      <g:HTML ui:field='addButton' addStyleNames='{mobile.button}'><div class='{mobile.add}'/></g:HTML>
      <g:HTML ui:field='customButton' styleName='{mobile.customButton}'/>
      <g:HTML ui:field='refreshButton' styleName='{mobile.button}'><div class='{mobile.refresh}'/></g:HTML>
      <div class='{mobile.title}' ui:field='titleSpan'>Expenses</div>
    </div>
    <g:SimplePanel ui:field='container'/>
  </g:HTMLPanel>
</ui:UiBinder>