0

Refresh with Five New ZK Themes!

asked 2009-02-03 02:40:52 +0800

ivanchang gravatar image ivanchang
45 1 1 1

Thank for Luca Vidoni's contribution. Download five new ZK themes to refresh the layout of your Web application. They are green, gray, orange, red, yellow!

delete flag offensive retag edit

40 Replies

Sort by ยป oldest newest

answered 2009-02-03 16:46:56 +0800

oberinspector gravatar image oberinspector
219 2 2

updated 2009-02-03 16:53:04 +0800

Could any one provide a small HowTo use the new ZK-Themes!?

I put the jar in the lib and added

<zk>
	<desktop-config>
		<disable-theme-uri>~./zul/css/norm*.css.dsp*</disable-theme-uri>
		<theme-uri>~./GreyTheme/img.css.dsp</theme-uri>
	</desktop-config>
</zk>

to zk.xml... but nothing changed...

Thanks, Thomas

EDIT: after a second try it works as decribed above

link publish delete flag offensive edit

answered 2009-02-03 22:41:01 +0800

geramaya gravatar image geramaya
36

updated 2009-02-03 22:41:22 +0800

hey all,

can someone send some screenshots of the new themes?
It could be easier as install by myself :P

Geramaya

link publish delete flag offensive edit

answered 2009-02-04 09:46:55 +0800

kvegter gravatar image kvegter
54 2

Hi

You should not disable ~./zul/css/norm*.css.dsp* in the desktop config. Then the UI is not good.
In fact adding the theme jar to your WEB-INF/lib and restart the server will work.

So without adding a <theme-uri> for the GreyTheme in the zk.xml file my theme provider listing is as follows:
MyThemeProvider.java :> uri ~./zul/css/norm*.css.dsp*
MyThemeProvider.java :> uri ~./zkex/zul/css/zkex*.css.dsp*
MyThemeProvider.java :> uri ~./zkmax/zul/css/zkmax*.css.dsp*
MyThemeProvider.java :> uri ~./GreyTheme/img.css.dsp
MyThemeProvider.java :> uri ~./js/ext/timeplot/api/styles/timeplot-bundle.css

this is with the ZKTheme-3.5.2-01-16-Grey.jar in my WEB-INF/lib

gr KV

link publish delete flag offensive edit

answered 2009-02-04 16:02:35 +0800

oberinspector gravatar image oberinspector
219 2 2

yes... my mistake... the themes where not shown in the visual editor in my maven ganymede project. Simply adding one of the theme jars in WEB-INF/lib works with an external browser...

Thanks for this themes!

link publish delete flag offensive edit

answered 2009-02-09 07:52:34 +0800

alexbally gravatar image alexbally
15

Hi, the new Themes don't display the calendar icon. It's a bug? I have only put the jar in WEB-INF/lib.

Thanks.
Alex.

link publish delete flag offensive edit

answered 2009-02-09 10:06:32 +0800

alexbally gravatar image alexbally
15

ok. solved for ZKTheme-3.5.2-01-16-Green.

I changed the img.css.dsp file and replaced the line

.z-datebox .z-datebox-img {
background-image : url(${c:encodeURL(c:cat3('~./',project,'/zul/button/DateButton-gray.gif'))});
}


with:

.z-datebox .z-datebox-img {
background-image : url(${c:encodeURL(c:cat3('~./',project,'/zul/button/datebtn.gif'))});
}

now work.

link publish delete flag offensive edit

answered 2009-02-12 22:07:57 +0800

terrytornado gravatar image terrytornado flag of Germany
9393 3 7 16
http://www.oxitec.de/

@all

After reading this thread i'm confusing on how to change the current blue theme.
Have someone a little HowTo of changing the Themes???

It's possible to change the theme per java-code at runtime?

thanks
Stephan

link publish delete flag offensive edit

answered 2009-02-14 13:13:22 +0800

aliyuagama gravatar image aliyuagama
3

how can i change ma zk theme while my program is runnin

link publish delete flag offensive edit

answered 2009-02-17 09:05:18 +0800

hoiliu gravatar image hoiliu
3

After using the jar file, I got this. Some border remain in blue. Is there a bug in the theme file?

thanks
Hoi

link publish delete flag offensive edit

answered 2009-02-17 14:17:52 +0800

alexbally gravatar image alexbally
15

Hi hoiliu, I solved the problem with this:


/*
Theme Name: default.css
Theme URI: ZKTheme-3.5.2-01-16-Green
Description:
Version:
ZK Version: 3.5.2
Author: [email protected]
Author URI:
*/

/* ----------- datebox ----------- */
.z-datebox-calyear td { background: #CDE69A; }
.z-calendar-calmon td.z-calendar-seld, .z-calendar-calday td.z-calendar-seld,
.z-datebox-calmon td.z-datebox-seld, .z-datebox-calday td.z-datebox-seld { background: #FFFF8E; border: 1px solid #FFFF8E; }
.z-datebox-over{ background: #CDE69A; }
/* ----------- datebox ----------- */

/* ----------- listbox ----------- */
div.z-listbox-header th.z-list-header { border-right:#CDE69A; }
div.z-listbox { background: #CDE69A; border: 1px solid #9ED235; overflow: hidden; zoom: 1; }
div.z-listbox-footer { background: #CDE69A; border-top: 1px solid #9ED235; }
/* Odd rows in a listbox */
tr.odd td.gc, tr.odd, tr.z-listbox-odd, tr.z-grid-odd td.z-row-inner,
tr.z-grid-odd { background: #F4F7E5 none repeat scroll 0 0; }
/* Selected rows in a listbox */
tr.seld, td.seld, tr.z-list-item-seld { background: #FFFF8E none repeat scroll 0 0; }
/* Selected rows with the mouse hovering over them */
tr.overseld, td.overseld, tr.z-list-item-over-seld { background: #E6F3CD none repeat scroll 0 0;}
/* Unselected rows with the mouse hovering over them */
tr.overd, td.overd, tr.z-list-item-over { background: #E6F3CD none repeat scroll 0 0; }
/* ----------- listbox ----------- */

/* ----------- tree ----------- */
div.z-filetree { border: 1px solid #F4F7E5; }
tr.z-tree-row-seld { background: #FFFF8E; }
tr.z-tree-row-over-seld { background: #E6F3CD; }
tr.z-tree-row-over { background: #E6F3CD; }
/* ----------- tree ----------- */

/* ----------- borderlayout ----------- */
.z-north-collapsed { background: #E4EFCB; border: 1px solid #CDE69A; }
.z-west-collapsed { background: #E4EFCB; border: 1px solid #CDE69A; }
.z-west-split { background: #E4EFCB; }
.z-border-layout { background: #E4EFCB; }
/* ----------- borderlayout ----------- */

/* ----------- toolbar ----------- */
.z-toolbar { background: #E4EFCB; border-color: #CDE69A; }
.z-toolbar a, .z-toolbar a:visited, .z-toolbar a:hover { background: #E4EFCB; border-color: #E4EFCB; }
/* ----------- toolbar ----------- */

/* ----------- tabbox ----------- */
.z-tabs .z-tabs-cnt { border-color: #CDE69A; }
.z-tabs { background: #E4EFCB; border-color: #CDE69A; }
.z-tabpanel { border-color: #CDE69A; }
.z-tabs-header { border-color: #CDE69A; }
/* ----------- tabbox ----------- */

/* ----------- menubar ----------- */
.z-menubar-hor { border-color: #CDE69A; }
/* ----------- menubar ----------- */

/* ----------- grid ----------- */
div.z-grid { border: 1px solid #CDE69A; }
/* ----------- grid ----------- */

/* ----------- combobox ----------- */
.z-combobox-pp .z-combo-item-seld { background: #FFFF8E; }
.z-combobox-pp .z-combo-item-over { background: #CDE69A; }
/* ----------- combobox ----------- */


and include in your zk.xml:

<desktop-config>
<theme-uri>/css/default/default.css</theme-uri>
</desktop-config>


bye.

link publish delete flag offensive edit
Your reply
Please start posting your answer anonymously - your answer will be saved within the current session and published after you log in or create a new account. Please try to give a substantial answer, for discussions, please use comments and please do remember to vote (after you log in)!

[hide preview]

Question tools

Follow

RSS

Stats

Asked: 2009-02-03 02:40:52 +0800

Seen: 10,734 times

Last updated: Dec 11 '12

Support Options
  • Email Support
  • Training
  • Consulting
  • Outsourcing
Learn More