17 Feb 2011 6:32 AM #1
Compass / SASS questions?
Compass / SASS questions?
Not sure where to post Compass/SASS questions so let me know if there is a better place for this:
Trying to create an application.css file for my new Touch app...getting compass compile error about not finding the mixin 'sencha-panel' ...but really I think it can't find any of them. So probably don't have the config.rb setup properly, or I am completely missing the boat on something else.
I copied the whole resources dir 1.0.2 to a client specific folder off the root of c: (c:\themes\myclient\resources). So that file has all the directories and files from Touch resources dir.
I then cleaned out the resources\sass dir and placed my own config.rb and application.scss files in there, adjusted to my needs. These look like the following:
# Delineate the directory for our SASS/SCSS files (this directory) sass_path = File.dirname(__FILE__) # Delineate the CSS directory (under resources/css in this demo) css_path = File.join(sass_path, "..", "css") # Delinate the images directory images_dir = File.join(sass_path, "..", "img") # Load the sencha-touch framework load File.join(sass_path, '..', '..', '..', '..', 'resources', 'themes') # Specify the output style and environment # For production use: :compressed # For debug use: :expanded output_style = :expanded environment = :production
// Variable overrides $base-color: #00275E; // Options: ‘matte’, ‘bevel’, ‘glossy’, ‘recessed’, and ‘flat’. $base-gradient: 'glossy'; // Include Sencha Touch styles //@import 'sencha-touch/default/all'; @include sencha-panel; @include sencha-buttons; @include sencha-sheet; @include sencha-picker; @include sencha-toolbar-forms; @include sencha-tabs; @include sencha-toolbar; @include sencha-carousel; @include sencha-indexbar; @include sencha-list; @include sencha-layout; @include sencha-form; @include sencha-loading-spinner; // Custom controls @include sencha-button-ui('yellow', #FEB729, 'glossy'); @include sencha-toolbar-ui('aqua', #6D98AB, 'glossy');
"error application.scss <line 9: Undefined mixin 'sencha-panel'.> Sass:: Syntax error on line ["9"] of C: Undefined mixin 'sencha-panel'."
What am I doing wrong?
17 Feb 2011 2:37 PM #2
Looks like when you moved the Sencha css you moved the rerference to the sencha files. so now when you try to include ANY sencha-* compass will not be able to find them.
I have my project set up like this.
# my project specific config
# location of sencha 1.0.1 includes; docs, resources, examples, etc.
sass_path = File.dirname(__FILE__) css_path = File.join(sass_path,'..','..','media','css') images_dir = File.join(sass_path,'..','..','media','sencha','resources','themes','images','default','pictos') load File.join(sass_path,'..','..','media','sencha','resources','themes') output_Style = :expanded environemnt = :developmen
# Delinate the images directory images_dir = File.join(sass_path, "..", "img") # Load the sencha-touch framework load File.join(sass_path, '..', '..', '..', '..', 'resources', 'themes')
17 Feb 2011 8:37 PM #3
Thanks @gcallaghan for the response, don't get many of those in the Touch forum.
As powerful as this technology is, the directions for setting it up are pretty weak. In any event, I kinda neglected to mention that this was on a Windoze box, not that it matters. This guys article did the trick for me. I would also recommend that instead of using the config.rb in the theming article (or this article), I would copy the config.rb in Sencha's sass directory to your scss directory that you create at the same level. That way I think you are more likely to not have any pathing issues in case Sencha makes dir changes from when these articles are written.
Anyway, thanks again for the repsonse, appreciate it
By SimonFlack in forum Sencha Touch 1.x: DiscussionReplies: 11Last Post: 7 Jan 2011, 2:08 PM
By estesbubba in forum Sencha Touch 1.x: DiscussionReplies: 0Last Post: 10 Dec 2010, 12:22 PM
By tvpittner in forum Sencha Animator Help & DiscussionReplies: 3Last Post: 16 Nov 2010, 5:55 AM
By emroot in forum Sencha Touch 1.x: DiscussionReplies: 0Last Post: 8 Oct 2010, 7:53 AM
By willi in forum Sencha Touch 1.x: DiscussionReplies: 3Last Post: 9 Sep 2010, 2:06 AM