Results 1 to 3 of 3

Thread: How to design the docked buttons??

  1. #1
    Sencha User roymj88's Avatar
    Join Date
    Nov 2011
    Location
    India
    Posts
    19
    Vote Rating
    0
      0  

    Default How to design the docked buttons??

    Hi,

    Is it possible to change the design of the buttons like submit, back etc which are used in the docked toolbars.

    For eg :-

    I have used the following button,

    Code:
    {
           xtype:'button',
           class:'submitbutton',
           text:'Submit',
           handler:function(){
                 Test.Viewport.setActiveItem('second',{type:'slide', direction:'left'});  
           }
    }
    I had named it to a different class and gave style accordingly :

    Code:
    .submitbutton{
        background-color:#FFF;
        border-radius:7px;
        color:#000;
        padding:10%;    
    }
    But the styles are having no effect. Please let me know how can i change the designs of the buttons.

    Thanks

    Roy M J

  2. #2
    Sencha - Sr Software Engineer mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    39,556
    Vote Rating
    1272
      0  

    Default

    Instead of using 'class', use 'cls'
    Mitchell Simoens @LikelyMitch
    Sencha Inc, Senior Software Engineer
    ________________
    Learn BBCode and use it! Checkout the CODE tag!

    Check out my GitHub, lots of nice things for Ext JS and Sencha Touch
    https://github.com/mitchellsimoens

  3. #3
    Sencha User rdougan's Avatar
    Join Date
    Oct 2008
    Posts
    1,159
    Vote Rating
    7
      0  

    Default

    I suggest you use `ui` instead of `cls`, and use the SASS mixins to generate a new style of button for your application.

    Documentation here: http://docs.sencha.com/touch/2-0/#!/...ncha-button-ui
    Sencha Inc.
    Robert Dougan - @rdougan
    Sencha Touch 2 and Ext JS 4 Core Team Member, SASS/Theming Wizard.

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •