1. #1
    Ext JS Premium Member
    Join Date
    Apr 2010
    Location
    Omaha, NE
    Posts
    557
    Vote Rating
    25
    estesbubba will become famous soon enough estesbubba will become famous soon enough

      0  

    Default Trying to change button gradient

    Trying to change button gradient


    I've developed a Touch application so I'm a little familiar with SASS/Compass. I'm working on changing some things with the Ext JS 4 theme and am stumped how to change the gradient for buttons. There is this definition:

    $button-default-background-gradient: 'glossy-button';

    After a lot of digging it appears that 'glossy-button' eventually gets passed to _background-gradient.scss and a long if-else statement does:

    @include background-image(linear-gradient($direction, color_stops(#F7F7F7, #F1F1F1 48%, #DADADA 52%, #DFDFDF)));

    So changing the background image of buttons seems different than just changing a variable. How is this done? I don't think I want to change _background-gradient.scss or any of the supplied theme files.

    Also, are any of the new Ext JS 4 themes available yet? That would probably give a good example of how to do this.

  2. #2
    Sencha User tobiu's Avatar
    Join Date
    May 2007
    Location
    Munich (Germany)
    Posts
    2,681
    Vote Rating
    112
    tobiu is a name known to all tobiu is a name known to all tobiu is a name known to all tobiu is a name known to all tobiu is a name known to all tobiu is a name known to all

      0  
    Best regards
    Tobias Uhlig
    __________

    S-CIRCLES Social Network Engine

  3. #3
    Ext JS Premium Member
    Join Date
    Apr 2010
    Location
    Omaha, NE
    Posts
    557
    Vote Rating
    25
    estesbubba will become famous soon enough estesbubba will become famous soon enough

      0  

    Default


    Thanks for the reply. So that thread says the Ext JS 4 themes aren't available yet. So what about being able to them the standard button?

  4. #4
    Ext JS Premium Member
    Join Date
    Apr 2010
    Location
    Omaha, NE
    Posts
    557
    Vote Rating
    25
    estesbubba will become famous soon enough estesbubba will become famous soon enough

      0  

    Default


    Any update on if button and panel gradients can be changed yet in PR3?

  5. #5
    Sencha User
    Join Date
    Oct 2011
    Location
    Oslo, Norway
    Posts
    10
    Vote Rating
    1
    tore.erstad is on a distinguished road

      1  

    Default I know this is an old post, but I just found a solution

    I know this is an old post, but I just found a solution


    Try this in your my-ext-theme.scss:
    $button-default-background-gradient: color-stops(yellow, red);

Similar Threads

  1. Gradient transform
    By mitchellsimoens in forum Ext: Discussion
    Replies: 2
    Last Post: 25 Aug 2011, 6:20 AM
  2. SASS & Sencha Touch: how do I apply a gradient to a pressed list item?
    By bklaas in forum Sencha Touch 1.x: Discussion
    Replies: 1
    Last Post: 26 Feb 2011, 1:30 PM
  3. Replies: 2
    Last Post: 13 Jul 2010, 5:08 AM
  4. Need to render button with Microsoft.Gradient
    By babai in forum Ext 3.x: Help & Discussion
    Replies: 1
    Last Post: 3 May 2010, 5:00 AM
  5. Toggle button: change button icon when pressed?
    By dbadke in forum Ext 1.x: Help & Discussion
    Replies: 2
    Last Post: 26 Mar 2007, 7:14 AM

Thread Participants: 2