ZK Official Themes"
m (→Installation) |
|||
Line 26: | Line 26: | ||
= Trendy Design Theme = | = Trendy Design Theme = | ||
− | In this design, we use gradient | + | In this design, we use gradient backgrounds, rounded corners and shadow effects for most components. '''Breeze''' is a greyish based theme that supports desktop and tablet, '''sapphire''' is a blueish based theme that supports desktop only and '''silvertail''' is a silverish based theme that also support desktop only. |
− | + | See below to take a quick view at the look and feel of Breeze, Sapphire and Silvertail, click image to view original size. | |
[[File:breeze-look-and-feel.png | left | thumb | 269px | Breeze]] | [[File:breeze-look-and-feel.png | left | thumb | 269px | Breeze]] |
Revision as of 04:48, 14 November 2013
Currently, ZK provides_ the following different themes: Breeze (built-in theme), Sapphire, Silvertail and Atlantic. Breeze, Sapphire and Silvertail themes uses the same Trendy Design with just different colors while ZK 7's Atlantic theme adopts the new trend in user interface design --Flat Design .
Installation
- Download the preferred theme.jar file.
- Breeze - built-in theme, no need to download and register.
- Sapphire - from google code
- Silvertail - from google code
- Atlantic - from github
- Place theme.jar file under "projectName/WEB-INF/lib" folder.
- Register preferred theme by library property in zk.xml file under "projectName/WEB-INF" folder
<!-- zk.xml -->
<library-property>
<name>org.zkoss.theme.preferred</name>
<value>sapphire</value> <!-- or silvertail, atlantic -->
</library-property>
Trendy Design Theme
In this design, we use gradient backgrounds, rounded corners and shadow effects for most components. Breeze is a greyish based theme that supports desktop and tablet, sapphire is a blueish based theme that supports desktop only and silvertail is a silverish based theme that also support desktop only.
See below to take a quick view at the look and feel of Breeze, Sapphire and Silvertail, click image to view original size.
Flat Design Theme: Atlantic
On contrary to trendy design, gradient background, rounded corner and shadow effect are removed. It is easy to customize and create a new theme based on this design. Atlantic is blueish based theme that support desktop and tablet.
The look and feel of Atlantic theme, click on image to view original size.
Tablet Support
Currently, Breeze and Atlantic themes support tablet device.
Version History
Version | Date | Content |
---|---|---|