PDA

View Full Version : How to learn SASS, docs seem weak



blomasky
28 Dec 2013, 10:35 AM
I am using SA 3 and this makes changing the theme REALLY easy, but I see parameters like "matte" in a gradient field. and "button-glossy" on the button tab. Where can I find what some of these options are? Is there documentation file on the options for the neptune theme? Is there some good book to get me jump-started?

thanks

Bruce

Kevin Jackson
30 Dec 2013, 8:16 AM
Bruce
Based on the title for your question, Sass is a language separate from Sencha. To learn about it and it's capabilities, http://sass-lang.com/ (the official site) There is also http://thesassway.com/ and this http://alistapart.com/article/why-sass which is info about it.

As to our Theming, There is the Theming Guide
http://docs.sencha.com/extjs/4.2.2/#!/guide/theming

Here are several long presentations from last years SenchaCon that you might find helpful. They go into more depth
http://vimeo.com/search?q=Phil+Guerrant

We also have a brand new Advanced Theming Course
http://www.sencha.com/company/events/jan-27-31-advanced-theming-for-sencha-ext-js-training-live-online/

blomasky
30 Dec 2013, 12:15 PM
Thanks for the reply Kevin.. You did give me some good pointers, but let me try to be more focused. I have read the books on SASS, and the rules are pretty simple, I did read the theming guide and that answered some questions, but where do I find out what are valid choices when overriding the themes in S.A. Like what I asked. where is "button-glossy" defined?thanks

Kevin Jackson
30 Dec 2013, 1:34 PM
There are a list of options here
http://docs.sencha.com/extjs/4.2.2/#!/api/Global_CSS-css_mixin-background-gradient
(http://docs.sencha.com/extjs/4.2.2/#!/api/Global_CSS-css_mixin-background-gradientThen)
Then in Ext there are four main CSS mixin areas
Buttons
http://docs.sencha.com/extjs/4.2.2/#!/api/Ext.button.Button-css_mixin-extjs-button-ui
(http://docs.sencha.com/extjs/4.2.2/#!/api/Ext.button.Button-css_mixin-extjs-button-ui)Panels
http://docs.sencha.com/extjs/4.2.2/#!/api/Ext.window.Window-css_mixin-extjs-panel-ui
Windows
http://docs.sencha.com/extjs/4.2.2/#!/api/Ext.window.Window-css_mixin-extjs-window-ui
Toolbar
http://docs.sencha.com/extjs/4.2.2/#!/api/Ext.toolbar.Toolbar-css_mixin-extjs-toolbar-ui

Their usage is best described in the videos I posted previously or in the Course.