1. #1
    Sencha User
    Join Date
    Mar 2011
    Posts
    9
    Vote Rating
    0
    ivan.marquez is on a distinguished road

      0  

    Default Unanswered: Styling Select Field

    Unanswered: Styling Select Field


    Hi, i need a huge help. Im trying to theming my sencha app but i dont know how to edit the select field css, i need it should looks like this http://www.wehaa-server2.com/americanrotary/int5.php (label at top and select field at bottom)

    could somebody help me?

  2. #2
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    37,547
    Vote Rating
    873
    Answers
    3566
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      0  

    Default


    Have you checked the SASS and how to compile SASS?
    Mitchell Simoens @SenchaMitch
    Sencha Inc, Senior Forum Manager
    ________________
    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

  3. #3
    Sencha User
    Join Date
    Mar 2011
    Posts
    9
    Vote Rating
    0
    ivan.marquez is on a distinguished road

      0  

    Default


    Quote Originally Posted by mitchellsimoens View Post
    Have you checked the SASS and how to compile SASS?

    Yes i know about sass, what I meant is how to change select field look and feel, cause now Ext.field.select show label (float: left), input select (float: right) and I wanted label (display block, top), select field (display block, bottom ).

    So i resolved it overwriting the css with sass:

    Code:
    .selectfield {
        display: block;
        
        .x-label-align-left {
            &:first-child {
              .x-form-label {
                @if $include-border-radius { @include border-top-right-radius($form-fieldset-radius); }
              }
            }
            
            &:last-child {
              .x-form-label {
                @if $include-border-radius { @include border-bottom-left-radius(0); }
              }
            }        
        }
        .x-form-label {
            span {
              font-size: 14px;
            }
        }    
        .x-component-outer {
            &:after {
                margin-top: .5em;
            }
            &:before {
                background: none;
            }
            .x-field-input{
                font-size: 14px;
            }
        }
    }

Thread Participants: 1

Tags for this Thread