Unfortunately, I don't the styling system supports this very well today. It
would be a different story if we supported <style is="custom-style"
href="file.css">. That way you could compile file.css with your sass/less
variables and it would still
be processed by polymer's styling system on the client.

+Steve Orvell <[email protected]> if he has ideas


On Wed, Aug 12, 2015 at 8:48 AM Robert Stone <[email protected]> wrote:

> I'm gradually adding polymer components to an existing application that
> makes heavy use of LESS files and have found a bit of a 'pain' point.
>
> We have a LESS file that contains a lot of theme style declarations
> (colours, font sizes etc.), this file is then included in various other
> LESS files where necessary.
>
> One of the polymer components I'm using is the progress bar, and I wish to
> change the 'active' colour to match a colour defined in one of our LESS
> files. Initially I did this the 'wrong' way by forcing the background
> colour of element used in the progress-bar to the value I want via standard
> LESS/CSS ie.
>
>     paper-progress {
>         #activeProgress {
>             background-color: @hilite-blue !important;
>         }
>     }
>
>
>
> This worked OK, but obviously when Shadow DOM finally becomes the norm my
> custom styling would end up being broken.
>
> I've now investigated styling it the 'correct' way using a custom style
> import (as described here
> https://www.polymer-project.org/1.0/docs/devguide/styling.html#custom-style).
> This works perfectly and should (I hope) be future proof.
>
> The problem I have is that I now have to declare my style constants in two
> different places, the LESS file and the custom style .html file. This could
> cause maintenance issues if the colours aren't both changed at the same
> time.
>
> What would be ideal is if there was a way of 'importing' CSS declarations
> into the custom styling file from an external resource. This would allow
> LESS/SASS to be used to create the CSS portion of the custom style file.
>
> Any thoughts on this, or suggestions as to how integration with existing
> styling could be handled in a better way?
>
> 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/993af31e-cb06-4e85-932c-eecc9c460c78%40googlegroups.com
> <https://groups.google.com/d/msgid/polymer-dev/993af31e-cb06-4e85-932c-eecc9c460c78%40googlegroups.com?utm_medium=email&utm_source=footer>
> .
> For more options, visit https://groups.google.com/d/optout.
>

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/CACGqRCAi%2BnoQK_faDJMGgsj54t2MRg_J2cM7%2Bn_B-AJNa2HRdA%40mail.gmail.com.
For more options, visit https://groups.google.com/d/optout.

Reply via email to