PDA

View Full Version : Theme Demo App - Is there one already built or am I meant to build one



ericatha
26 Jun 2013, 6:09 AM
Hi All,

I'm just getting into theming. I'm in charge of styling the web app but rarely touch the ExtJS, so I'm not very familiar with what things should look like in the app.js...

I've gone through the steps shown here:
http://docs.sencha.com/extjs/4.2.1/#!/guide/theming

But should the theme-demo-app that is built look like this?
http://docs.sencha.com/extjs/4.2.1/extjs-build/examples/themes/index.html

And if not, how can I build a page that looks similar and allows me to test most components?

Thank you in advance.
Eric

Phil Guerrant
26 Jun 2013, 6:43 AM
For now we don't have a streamlined way of doing this. However, it should be easy enough to generate an application (like the Theme Demo App described in the tutorial) and overwrite the contents of app.js with the contents of themes.js from the themes example: http://docs.sencha.com/extjs/4.2.1/extjs-build/examples/themes/themes.js

ericatha
26 Jun 2013, 8:00 AM
That kind of works, but the structure isn't coming out correctly.

What I get when I replace the contents of app.js with themes.js:
http://imgur.com/528sjvq

Are there any other js files that I should try to include?

ericatha
26 Jun 2013, 9:27 AM
I replaced the contents of app.js with themes.js. It almost works, but there are some structural issues.
Seen here:
http://imgur.com/528sjvq

All the panels are positioned from the top left and 100% width it seems and I'm getting "layout run failed" in my console.

Any ideas what may be causing this?

Phil Guerrant
7 Jul 2013, 6:34 AM
try replacing the getSizing() function in themes.js with the following:




function getSizing(id) { return sizing[id].neptune;}

Or if you are extending the classic theme:




function getSizing(id) { return sizing[id].classic;}