-
14 Feb 2013 11:58 AM #1
[ext.4.2.0.489] Objects doesn't have backgrounds - CSS???
[ext.4.2.0.489] Objects doesn't have backgrounds - CSS???
I just tried out the brand-new ext.4.2.0.489 beta-release. Everything works fine, except the look-and-feel either in the classic ext-all-gray theme as in the ext-neptune theme.
My problem is, that a lot of user-interface elements (buttons, grid-columns, windows, context-menus) doesn't have a background anymore, that is they are transparent.
As far as I read in the release-notes, the classic and the neptune-theme extend the neutral-theme but there is no ext-all-neutral.css in the sources so this might be the reason for my problems??
-
14 Feb 2013 12:41 PM #2
Perhaps post a screenshot, I'm not really sure what you mean.
Evan Trimboli
Sencha Developer
Twitter - @evantrimboli
Don't be afraid of the source code!
-
15 Feb 2013 2:43 AM #3
Screenshots attached...
Screenshots attached...
Hi Evan,
I attached two screenshots.
1st. ExtJs 4.1.1a GPL with ext-all-gray.css
2nd ExtJs 4.2.489-beta with ext-all-gray.css(ext-theme-gray.css)
-
15 Feb 2013 2:51 AM #4
-
17 Feb 2013 4:21 PM #5
This doesn't happen in the online examples, it looks like you're using custom styling there, it's likely having an impact, difficult to say what.
Evan Trimboli
Sencha Developer
Twitter - @evantrimboli
Don't be afraid of the source code!
-
17 Feb 2013 4:39 PM #6
I suspect this issue is coming from changes to the menu styling in 4.2 and how you have customized that styling. Perhaps using the variables provided by the Classic theme (there are many more in 4.2) you can get the result you are after.
Theme inheritance is part of the SASS build process and results in a "flattened" CSS file. The Neutral and Base themes are technically abstract bases in that they depend on variables being defined for which there aren't good defaults. Rather than have them make up something we decided it was best to "force" the derived theme to state its intentions on these.
There are 3 fundamental approaches folks take here to create a theme (the first two are basically the same as 4.1):
1. Add your own CSS around the generated CSS from the framework theme (not recommended in 4.1 or 4.2).
2. Add your own SASS and import the generated "all.scss" file from the framework theme (recommended in 4.1 / supported in 4.2)
3. Create a theme package that derives from the desired theme, customizes variables and extends rules as needed (new to 4.2 / and recommended in 4.2).
I'm not sure which path you are on, but as part of moving to 4.2 I would consider option #3 - it should give you the easiest maintenance and most flexibility for your theme. Both Neptune and Classic are implemented this way (deriving from Neutral) and you can pick one (looks like Classic?) as a starting point for your own.
To get started on that path, you could use Sencha Cmd to generate a theme package or copy "ext-theme-classic", remove the parts you don't need (like most of the ./sass and ./resources folders) and change the package.json properties name, extend and requires.
Apologies that the guides are not yet online for this area - we are working hard to get them refreshed and posted.Don Griffin
Ext JS Development Team Lead
Check the docs. Learn how to (properly) report a framework issue and a Sencha Cmd issue
"Use the source, Luke!"
Wait! Looks like we don't have enough information to add this to bug database. Please follow this template bug format.


Reply With Quote
