In order to replace default element images you need to modify servoy default css. See Customizing the Web Client for more info. The following examples are css classes that can be added in default css in order to modify default images.
- Replace the calendar field image:
.calendar img { background: url("http://www.servoy.com/developer/6xx_intro/resources/servoy_donut16x16.ico") repeat scroll 0 0 rgba(0, 0, 0, 0); height: 0; padding: 8px; width: 0; }
- Replace accordion open/closed image
.ui-state-default .ui-icon { background-image: url("http://www.servoy.com/developer/6xx_intro/resources/servoy_donut16x16.ico") !important; background-position: 0 center; } .ui-state-default .ui-icon { background-image: url("http://www.servoy.com/developer/6xx_intro/resources/servoy_donut16x16.ico") !important; background-position: 0 center; }
- Replace db treeview node image (this can be also done from scripting)
.icon-panel img { background: url("http://www.servoy.com/developer/6xx_intro/resources/servoy_donut16x16.ico") repeat scroll 0 0 rgba(0, 0, 0, 0); height: 0; padding: 8px icon-panel !important; width: 0; }
Note
The url from css can also be embedded data url, for example:
background-image: url(data:image/gif;base64,R0lGODlhEAAQAMQAAORHHOVSKudfOulrSOp3WOyDZu6QdvCchPGolfO0o/XBs/fNwfjZ0frl3/zy7////wAAAA AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAkAABAALAAAAAAQABAAAAVVICSOZGlCQAosJ6mu7fiyZeK qNKToQGDsM8hBADgUXoGAiqhSvp5QAnQKGIgUhwFUYLCVDFCrKUE1lBavAViFIDlTImbKC5Gm2hB0SlBCBMQiB0UjIQA7);
See http://css-tricks.com/data-uris/ for more info on exact syntax.
- New calendar picker style (working from Servoy 7.4). New css just has to be added in default servoy css
addition_to_servoy_web_client_default.css
Overview
Content Tools
Activity