1. #1
    Sencha Premium Member
    Join Date
    Oct 2011
    Posts
    55
    Vote Rating
    0
    dwb is on a distinguished road

      0  

    Default Panel Header Background Gradation

    Panel Header Background Gradation


    Hello,

    I'm extending the "Ext-theme-gray" theme using SCSS and Sencha Cmd. I'm trying to achieve a panel gradation similar to the "Ext-theme-classic".


    Following the "Themeing" documentation, I've created a "Panel.scss" file in "my-workspace/packages/my-custom-theme/sass/var/panel" directory.


    Sencha Docs says: "$panel-header-background-gradient : string/list - Can be either the name of a predefined gradient or a list of color stops."


    So, I've entered some CSS color stops in the "Panel.scss" file:


    $panel-header-background-gradient:
    color-stop(0%,#ffffff),
    color-stop(1%,#f5f6f8),
    color-stop(49%,#dde0e5),
    color-stop(50%,#e0e2e7),
    color-stop(51%,#cccfd4),
    color-stop(100%,#dde0e5);

    Sencha Cmd fails when it hits the "$panel-header-background-gradient" var. The error is:


    ================================================
    [INF] executing compass using system installed ruby runtime
    remove .sass-cache/
    remove resources/my-custom-theme-all-debug.css
    remove resources/my-custom-theme-all-rtl-debug.css
    error my-custom-theme-all-debug.scss (Line 168 of ../../ext-theme-base/sass/etc/mixins/background-gradient.scss: wrong number of arguments (6 for 2) for `linear-gradient')
    create resources/my-custom-theme-all-debug.css
    error my-custom-theme-all-rtl-debug.scss (Line 168 of ../../ext-theme-base/sass/etc/mixins/background-gradient.scss: wrong number of arguments (6 for 2) for `linear-gradient')
    create resources/my-custom-theme-all-rtl-debug.css
    [ERR]
    [ERR] BUILD FAILED
    [ERR] com.sencha.exceptions.ExProcess: compass jruby process exited with non-zero code : 1
    [ERR]
    [ERR] Total time: 1 minute 3 seconds
    [ERR]
    [ERR] BUILD FAILED
    [ERR] com.sencha.exceptions.BasicException: com.sencha.exceptions.ExProcess: compass jruby process exited with non-zero code : 1
    [ERR]
    [ERR] Total time: 1 minute 6 seconds
    [ERR] com.sencha.exceptions.BasicException: com.sencha.exceptions.ExProcess: compass jruby process exited with non-zero code : 1
    ================================================


    I'm not sure what the problem is. Is it my syntax? Does this error mean that I've entered too many color-stops? If it only allows 2 color-stops then are complicated gradations not supported? Is this because I'm extending the gray theme and should be extending the classic theme?


    I've looked at other settings for "$panel-header-background-gradient" in the classic theme, but didn't see anything like I expected. Here's what the Panel.scss file for the classic theme looks-like:


    $panel-header-background-gradient: 'panel-header' !default;


    So, where's this 'panel-header' definition stored (so I can copy them)? I'm so lost.


    Please help and thank you,
    -Darryl

  2. #2
    Sencha Premium Member
    Join Date
    Oct 2011
    Posts
    55
    Vote Rating
    0
    dwb is on a distinguished road

      0  

    Default Panel Header Background Gradation SCSS Syntax

    Panel Header Background Gradation SCSS Syntax


    Hello,

    While investigating my own issue (I am the original poster), I discovered that the following works... well, sort-of works.

    The effect I was attempting to create looks like this in Photoshop ( see attachement, look left ). And what I've had to surrendered to (see attachment, look right).

    I used this SCSS code in "Panel.scss":
    $panel-header-background-gradient: color-stops(#ffffff, #f5f6f8, #e0e2e7, #cccfd4, #dcdfe4, #dcdfe4, #b7c1d3) !default;
    And, as an additional benefit, I believe that since I accomplished making this gradation in the "SCSS" file, that the "Sencha Slicer" will produce image slices for the handycapped IE browsers.

    -Thanks,
    Darryl
    Attached Images

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