1. #1
    Sencha User
    Join Date
    Mar 2012
    Posts
    4
    Vote Rating
    0
    bingles is on a distinguished road

      0  

    Default Unanswered: Possible to pass variables into .sccs file during runtime?

    Unanswered: Possible to pass variables into .sccs file during runtime?


    Hey Guys,

    Was hoping to get some help on figuring out whether or not it is possible to pass variables during run-time into the the .SCSS file. Has anyone achieved this yet or can share some knowledge surrounding it?

    Thanks!

  2. #2
    Sencha User
    Join Date
    Sep 2011
    Posts
    13
    Vote Rating
    4
    thefugal is on a distinguished road

      0  

    Default


    .SCSS files are compiled into .CSS (at compile time). At runtime, the .SCSS is not even used. You'll have to use the variable to directly manipulate the CSS, unfortunately.

  3. #3
    Sencha User
    Join Date
    Mar 2012
    Posts
    4
    Vote Rating
    0
    bingles is on a distinguished road

      0  

    Default


    So it seems possible to dynamically store a variable (say a color override for toolbar), but it will have to target the CSS only. Doesn't seem ideal given the output. Wondering if an ID can be set for the specific item and just have the variable affect that style. Think that could work?

  4. #4
    Sencha User
    Join Date
    Sep 2011
    Posts
    13
    Vote Rating
    4
    thefugal is on a distinguished road

      0  

    Default


    If you mean, put an ID on the specific component you want restyled, and then use variable to restyle that one specific component, then yes this is possible.

    You can do it when defining the component:

    Code:
    {
        xtype: 'toolbar',
        id: 'my-toolbar',
        style: {
            ...
        }
    }
    or change an existing component:

    Code:
    Ext.getCmp('my-toolbar').setStyle(...)

  5. #5
    Sencha User
    Join Date
    Mar 2012
    Posts
    4
    Vote Rating
    0
    bingles is on a distinguished road

      0  

    Default


    Thanks that makes sense.

    I now have an ID set for my toolbar, but was curious as to what my choices were in regards to storing this variable. Does it have to exist in the view js or can is there a place I can set it and have it act as a "global" variable for all instances of the specified ID?

    For example, the default toolbar color is gray (via sccs theme). The hopes would be to use this variable to store a hex value, say for a background color and have an ID of 'green-toolbar' on some component(s) of choice.

    I guess my question is in regards to how to best set this up...assuming it is possible.

  6. #6
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    37,327
    Answers
    3540
    Vote Rating
    850
    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


    I would make different toolbar ui (very easy in SASS) and specify the ui config on the toolbar instead of the id config.
    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.

  7. #7
    Sencha User
    Join Date
    Sep 2011
    Posts
    13
    Vote Rating
    4
    thefugal is on a distinguished road

      0  

    Default


    That's a good point. I was assuming that you needed to be able to completely control the style (e.g., select any color at runtime), not only choose from a few style options. If you have a small, predefined set of "themes" that you will be choosing from, making different ui's in SASS is certainly the way to go.

Thread Participants: 2

Tags for this Thread