Hi there,

I've been battling with this for a while now and I can't figure it out.
I'm unable to get even a simple custom css property working using polymer.

Here ismy component definition have:

<!-- Import Polymer -->
<link rel="import" href="bower_components/polymer/polymer.html">

<!-- Define your custom element -->
<dom-module id="edit-label">

    <template>
        <style >

            .someLabel {
                background-color: var(--edit-label-title-color,blue);
            }

        </style>


        <div hidden$="{{inEditMode}}">
            <label class=" someLabel ">{{label}}</label>
            <span id="editLabel" class="icon-compose"></span>
        </div>
        <div hidden$="{{!inEditMode}}">
            <input id="labelInput" value="{{label::input}}"></input>
            <span id="saveLabel" class="edit icon-compose"></span>
        </div>

    </template>


    <script src="bower_components/jquery/dist/jquery.min.js"></script>
    <script src="bower_components/rxjs/dist/rx.all.js"></script>
    <script>
        Polymer({
            is:'edit-label',
            properties: {
                label:{
                    type:String,
                   notify:true
                }
            },
            ready: function() {
                var $this = this;
                this.inEditMode = false;

                Rx.Observable.fromEvent(this.$.editLabel, 
'click').subscribe(function (){
                    $this.inEditMode = true;
                });

                Rx.Observable.fromEvent(this.$.saveLabel, 
'click').subscribe(function (){
                    $this.inEditMode = false;
                });
            },
            attached: function() {
            }
        });
    </script>

</dom-module>

When I run this in Chrome  without  setting the property I expect the label to 
be blue, but instead it keeps it's default user agent color (black).
When I open the chrome dev tool, and I inspect the CSS, I get a warning 
"Invalid property value".

So something is not happening.

Any ideas ?



________________________________

This e-mail is for the sole use of the intended recipient and contains 
information that may be privileged and/or confidential. If you are not an 
intended recipient, please notify the sender by return e-mail and delete this 
e-mail and any attachments. Certain required legal entity disclosures can be 
accessed on our website.<http://site.thomsonreuters.com/site/disclosures/>

Follow Polymer on Google+: plus.google.com/107187849809354688692
--- 
You received this message because you are subscribed to the Google Groups 
"Polymer" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to [email protected].
To view this discussion on the web visit 
https://groups.google.com/d/msgid/polymer-dev/F9270B849A6A7C478D3C26FDFA973DE9236AAFBE%40C111SMZLMBX01.ERF.thomson.com.
For more options, visit https://groups.google.com/d/optout.

Reply via email to