ZK Official Themes"
m (→Installation) |
|||
| Line 45: | Line 45: | ||
[[File:atlantic-look-and-feel.png | none | thumb | 300px | Atlantic]] | [[File:atlantic-look-and-feel.png | none | thumb | 300px | Atlantic]] | ||
| + | |||
| + | == Not to Import Google Font == | ||
| + | By default Atlantic theme imports Google font, but some countries (e.g. China) are blocked from accessing that font or there is no internet available for a ZK-based application. Then this blocking will cause the theme displaying incorrectly. In this case, you need to disable importing Google font by the library property in zk.xml | ||
| + | |||
| + | <source lang='xml'> | ||
| + | <library-property> | ||
| + | <name>org.zkoss.theme.atlantic.useGoogleFont.disabled</name> | ||
| + | <value>true</value> | ||
| + | </library-property> | ||
| + | </source> | ||
| + | |||
| + | <!-- | ||
| + | http://tracker.zkoss.org/browse/ZK-2931 | ||
| + | --> | ||
= Tablet Support = | = Tablet Support = | ||
Revision as of 09:36, 12 July 2017
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.
- 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
Trendy design emphasizes on gradient background, rounded corners and shadow effects. 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 the contrary, flat design replaces skeuomorphism (gradient background, rounded corner and shadow effect) with simplicity and visual clarity to communicate. It is easy to create and customize a new theme based on this design. Atlantic is a blueish based theme that supports both desktop and tablets.
See below to take a quick view at the look and feel of Atlantic, click image to view original size.
Not to Import Google Font
By default Atlantic theme imports Google font, but some countries (e.g. China) are blocked from accessing that font or there is no internet available for a ZK-based application. Then this blocking will cause the theme displaying incorrectly. In this case, you need to disable importing Google font by the library property in zk.xml
<library-property>
<name>org.zkoss.theme.atlantic.useGoogleFont.disabled</name>
<value>true</value>
</library-property>
Tablet Support
Currently, Breeze and Atlantic themes both supports tablet devices.
Version History
| Version | Date | Content |
|---|---|---|