How to Modify Background Image

Overview

It is possible to change properties style of WEB POS using CSS files. In RMP32 has been added a CSS file in login screen, where the background image is defined.

In RMP32, only the background image and background color can be modified. In next versions more properties style will be added.

How to change the background image from a module

To change the background image, it is needed two steps:

• create a new CSS with the new definition of style (in this case, associate a new URL to background property):

 
.ob-body-standard {
  background-color: blue;
  background: url('./../../org.openbravo.howToChangeBackgroundImage/css/NewImage.jpg') top left;
}

where the new image is located in the path: modules/org.openbravo.howToChangeBackgroundImage/css/NewImage.jpg

• add the CSS file in ComponentProvider file of the module

 
...
final String cssPrefix = "web/" + MODULE_JAVA_PACKAGE + "/css/";
...
final String[] cssDependency = { "ob-new-style" };
for (String resource : cssDependency) {
      globalResources.add(createComponentResource(ComponentResourceType.Stylesheet, cssPrefix
          + "../css/" + resource + ".css", POSUtils.APP_NAME));
}
 
...

where the name of new CSS is "ob-new-style.css" and it is located in the path: modules/org.openbravo.howToChangeBackgroundImage/web/org.openbravo.howToChangeBackgroundImage/css/ob-new-style.css