Changing the case of the paper entry element

I have the following I / O item

      <paper-input floatinglabel required
        id="size-ppr-input"
        label="Size">
      </paper-input>

      <paper-icon-button floatinglabel required
        id="size-ppr-input"
        label="Size">
      </paper-icon-button>

      

The default font for elemeent is uppercase, determined by the core of the paper element, and black (usually).

How can I change case to omit, or suggestion case, etc. and change the color.

thank

+3


source to share


1 answer


You can set the color of the label with

  paper-input /deep/ #label, paper-input /deep/ div#floatedLabel.focused {
    color: green;
  }

      

The first part is for labeling when the input has no focus.
The second is for a floating label.

If you add this styling outside of the polymer element (on the login page or in the css file linked to the input page), remember to add browser selectors that don't support the shadow DOM function



  paper-input /deep/ #label, paper-input /deep/ div#floatedLabel.focused,
  paper-input #label, paper-input div#floatedLabel.focused {
    color: green;
  }

      

To reset all-caps font for normal font for button-button use

  paper-icon-button {
    text-transform: none;
  }

      

+2


source







All Articles