CODEWITHSUNDEEP
polymer
fozziethebeat
fozziethebeat

Reputation: 1180

Set paper-input font size in Polymer

I've attempted to style a paper-input element in my app using the CSS mixing described in the Polymer Guides but I can't quite get it to work for font size and paper-input.

I've tried the following custom element:

<dom-module id="test-element">
  <style>
    :host {
      --paper-input-container-input {
        font-size: 30px;
      };
    }
  </style>
  <template>
    <paper-input></paper-input>
  </template>
  <script>
    Polymer({
      is: 'test-element',
    });
  </script>
</dom-module>

When running this, the font size remains unchanged. Has anyone been able to modify paper-input's font size?

Upvotes: 1

Views: 1173

Answers (1)

Alan D&#225;valos
Alan D&#225;valos

Reputation: 2698

You're missing a colon (:) in the style, it should be like this

<style>
:host {
  --paper-input-container-input: {
    font-size: 30px;
  };
}
</style>

Here's a working example

Upvotes: 4

Related Questions