View source | Discuss this page | Page history | Printable version   

Skins


Contents

Introduction

This document describes different UI components and most significant files/pieces of code that are needed to build/customize them.

In order to learn how to build a skin module, please go to How to create a New Skin

There is also a skin module available: Project - Repositories

Navigation bar

OB3 NavBar.png

Global

Top margin:

Bottom margin:

Left margin:

Background color:

Closed dropdown button

Background Color:

Over button

Background color:

Border color:

Opened dropdown button

Background color:

Border color:

Create New

Icon:

Icon (RTL):

Recent item icon: shared with "Application Menu: Content icons"

Recent item text:

Label + Combo box: shared with "Form" one

Quick Launch

Icon:

Icon (RTL):

Recent item icon: shared with "Application Menu: Content icons"

Recent item text:

Label + Combo box: shared with "Form" one

Application Menu

Icon:

Content icons:

Content border color:

Icon-Text separator color:

Icon-Text separator color (RTL):

Icon over background color:

Text over background color:

Text over font color:

Alerts

Icon:

Help

Icon:

Item text:

User Profile

Icon:

Form components: shared with "Form" ones

Sub-section border color:

End Session

Icon:

Icon (RTL):

Parent/Top/Main tabs

OB3 Tabs.png

Background

Background color:

Background image:

Bottom border:

Tab button

Selected active:

Selected active over:

Selected inactive:

Selected inactive over:

Unselected:

Unselected over:

Tab overflow buttons

Move left/right buttons:

Pick list button:

Child tabs

Background

Background color:

Background image:

Bottom border:

Tab button

Selected active:

Selected active over:

Selected inactive:

Selected inactive over:

Unselected:

Unselected over:

Tab overflow buttons

Move left/right:

Pick list:

Toolbar

OB3 Toolbar.png

Background

Background:

Icon button

Border:

Icon:

Text button

Background:

Border:

Save view button

OB3 ViewMng.png

Background:

Cell state background:

Border:

Internal separator color:

Status Bar

OB3 StatusBar.png

Background:

Icons:

Buttons:

Link icon:

Link color:

View

Active view left bar background color:

Inactive view left bar background color:

Grid

OB3 Grid.png

Filter row

Background color:

Funnel button background color:

Border color:

Header

Button:

Menu button:

Cells

Border color:

Odd cell background color:

Even cell background color:

Over cell background color:

Selected cell background color:

Grid view buttons

Icons:

Button separator:

Link button (just the text is the link)

Color:

Link cell (the whole cell is the link)

Color:

Border color:

Empty grid link text

Color:

Form

OB3 Form.png

Common

Form background color:

Label color:

Label link color:

Label link hover color:

Label link icon:

Clear icon:

Field border color:

Field background color:

Check box

Icon:

Combo box

Picker icon:

Pick list background color:

Pick list selected background color:

Selector

Search icon:

Pick list background color: shared with "Form: Combo box"

Date field

Icon:

Calendar border:

Calendar buttons:

Calendar buttons hover:

Calendar buttons pressed:

Calendar days:

Spinner

Increase icon:

Decrease icon:

Image field

Upload icon:

Erase icon:

Not Available Image image:

Widget

Border color:

Button

Background:

Border:

Link button

Normal color:

Hover color:

Pressed color:

Notes

Other user note background color:

Delete note text color:

Sections

Sections title underline color:

Sections title underline color (RTL):

Sections icon:

Form layout personalization window

Border color:

Content icons:

Content icons (RTL):

Selected tree element background color:

Popup

OB3 Popup.png

Border

Color:

Header

Background:

Maximize button

Icon:

Border color:

Minimize button

Icon:

Border color:

Restore button

Icon:

Border color:

Close button

Icon:

Border color:

Dialog

OB3 Dialog.png

Text:

Link color:

Workspace

OB3 Workspace.png

Left items

Sections title underline color:

Recent Views icon: shared with "Application Menu: Content icons"

Create new in "Recent views" icon:

Add Widget and Admin Others dialog:

Add Widget combo box: done as "Form" one (but not shared). Defined in:

Admin Others combo box: done as "Form" one (but not shared). Defined in:

Widgets

Border

Color:

Edit button

Icon:

Border color:

Dialog border color:

Dialog background color:

Dialog separator color:

Dialog entry text color:

Dialog disabled entry text color:

Maximize button

Icon:

Border color:

Minimize button

Icon:

Border color:

Restore button

Icon:

Border color:

Close button

Icon:

Border color:

Retrieved from "http://wiki.openbravo.com/wiki/Skins"

This page has been accessed 18,188 times. This page was last modified on 21 May 2012, at 14:28. Content is available under Creative Commons Attribution-ShareAlike 2.5 Spain License.