1. #1
    Sencha User
    Join Date
    Jun 2011
    Posts
    20
    Vote Rating
    0
    jmefford is on a distinguished road

      0  

    Default Theming: change where theme-image() function points?

    Theming: change where theme-image() function points?


    I have been working with the Ext theming stuff with compass and I basically have what I need done, but i just have one more piece of the puzzle before it is up and working. I have moved a bunch of things around to fit my current directory structure, which looks something like this now:

    public/
    --CSS/
    ----Ext/
    ------css/
    ------sass/
    ------themes/
    --Javascript/
    ----Ext/
    --images/
    ----Ext/
    ------themes/
    --------images/

    my config.rb looks like this:
    Code:
    $ext_path = "../"
    
    sass_path = File.dirname(__FILE__)
    
    css_path = File.join(sass_path, "..", "css")
    
    images_dir = File.join(sass_path,'..','..','..','images','Ext','themes','images','default')
    
    output_style = :expanded
    
    load File.join(File.dirname(__FILE__), $ext_path, 'themes')
    And my theme.scss looks like:
    Code:
    $include-default: true;
    $base-color: #621476;
    $color : #546137;
    @import 'ext4/default/all';
    $relative-image-path-for-uis: "../../../images/Ext/themes/images";
    but the generated .css file is looking for my images in:

    /css/Ext/resources/themes/images/

    instead of:

    /images/Ext/themes/images/

    I see in the ext scss files a function called theme-image(), ex:
    Code:
    theme-image($theme-name, 'grid/grid3-hd-btn.gif')
    How do I change what URL this theme-image function is pumping out?

  2. #2
    Sencha User
    Join Date
    Jun 2011
    Posts
    20
    Vote Rating
    0
    jmefford is on a distinguished road

      0  

    Default


    I finally found where this is at. In the themes/lib/utils.rb is where the theme-image function is found. I made some minor modifications to it that allow me much more flexibility. Now my new setup is as follows:

    config.rb
    Code:
    $ext_path = "../"
    
    sass_path = File.dirname(__FILE__)
    
    css_path = File.join(sass_path, "..", "css")
    
    $images_dir = '../../../images/Ext/themes/images'
    
    output_style = :expanded
    
    load File.join(File.dirname(__FILE__), $ext_path, 'themes')
    utils.rb
    Code:
    ...
    def theme_image(theme, path, without_url = false, relative = false)
              path = path.value
              theme = theme.value
              without_url = (without_url.class == FalseClass) ? without_url : without_url.value
              
              relative_path = "../images/"
              
              if relative
                if relative.class == Sass::Script::String
                  relative_path = relative.value
                  relative = true
                elsif relative.class == FalseClass || relative.class == TrueClass
                  relative = relative
                else
                  relative = relative.value
                end
              else
                relative = false
              end
              
              if relative
                image_path = File.join(relative_path, theme, path)
              else
                images_path = File.join($images_dir, theme)
                image_path = File.join(images_path, path)
              end
              
              if !without_url
                url = "url('#{image_path}')"
              else
                url = "#{image_path}"
              end
              
              Sass::Script::String.new(url)
    ...

  3. #3
    Ext JS Premium Member
    Join Date
    Dec 2009
    Posts
    65
    Vote Rating
    3
    oklymenko is on a distinguished road

      0  

    Default


    I just started playing in this area myself and can't figure out why the function theme_image has an underscore in utils.rb, but is called from _theme-background-image.scss with a dash, as theme-image. The theme_image_exists function is used in both cases with an underscore. Where is the magic?

    I would appreciate your answer,
    Alex.

  4. #4
    Ext JS Premium Member
    Join Date
    Dec 2009
    Posts
    65
    Vote Rating
    3
    oklymenko is on a distinguished road

      0  

    Default


    Figured it out: http://www.themer.me/blog/tutorials/...s-in-sass-scss

    ...In SASS it doesn’t matter whether your variable has an underscore or a dash – they work both ways.

  5. #5
    Sencha User
    Join Date
    Dec 2010
    Posts
    126
    Vote Rating
    0
    varunach is on a distinguished road

      0  

    Default


    Thanks for the soultion. I was stuck in a similar problem. One doubt. The path in the $image_dir is relative to what? The config.rb file or the util.rb file?

Thread Participants: 2

film izle

hd film izle

film sitesi

takipci kazanma sitesi

takipci kazanma sitesi

güzel olan herşey

takipci alma sitesi

komik eğlenceli videolar