1. #1
    Sencha User
    Join Date
    Jul 2012
    Posts
    30
    Vote Rating
    0
    Answers
    1
    sogorman is on a distinguished road

      0  

    Default Unanswered: Theming with SASS

    Unanswered: Theming with SASS


    I am creating a custom theme for my app (dark grey / black) and and with minimal changes to the SASS file am seeing pink icons and shading in my app. Any idea why changing just the base color and active color would result in this?


    Screen Shot 2012-10-04 at 8.06.43 AM.png


    Code:
    $base-color: #505050;
    $active-color: #878787;
    
    
    
    
    $base-gradient: 'glossy';
    $tabs-dark: darken($base-color, 20%);
    $tabs-dark-active-color: saturate($active-color, 20%);
    $tabs-bottom-active-gradient: 'recessed';
    
    
    @import 'sencha-touch/default/all';
    
    
    @include pictos-iconmask('calendar');
    @include pictos-iconmask('home2');
    @include pictos-iconmask('tag');
    
    
    
    
    
    
    
    
    // You may remove any of the following modules that you
    // do not use in order to create a smaller css file.
    @include sencha-panel;
    @include sencha-buttons;
    @include sencha-sheet;
    @include sencha-picker;
    @include sencha-tabs;
    @include sencha-toolbar;
    @include sencha-toolbar-forms;
    @include sencha-indexbar;
    @include sencha-list;
    @include sencha-layout;
    @include sencha-carousel;
    @include sencha-form;
    @include sencha-msgbox;
    @include sencha-loading-spinner;
    Thanks much

  2. #2
    Sencha User jerome76's Avatar
    Join Date
    Apr 2012
    Location
    New Jersey
    Posts
    1,149
    Vote Rating
    99
    Answers
    132
    jerome76 is just really nice jerome76 is just really nice jerome76 is just really nice jerome76 is just really nice jerome76 is just really nice

      0  

    Default


    Try removing the $tabs-dark-active-color: saturate($active-color, 20%); and see if that helps.

  3. #3
    Sencha User
    Join Date
    Jul 2012
    Posts
    30
    Vote Rating
    0
    Answers
    1
    sogorman is on a distinguished road

      0  

    Default


    I had tried that, I have removed all of the variables except base color and still I am getting the red shade on some elements.

  4. #4
    Sencha User
    Join Date
    Jul 2012
    Posts
    30
    Vote Rating
    0
    Answers
    1
    sogorman is on a distinguished road

      0  

    Default


    Some more information - it appears that whenever $base-color and $active-color are a shade of grey (#404040) or (#727272) the result is that red hue. Still can't figure out how to get around it or if there is a SASS variable that I can set in addition to base color and active color.

    Sean

Thread Participants: 1

Tags for this Thread