Vaadin TextField: disabling underline

Flow
5

Nkosi Phillip:
I created a module and it worked. I am using it in my HTML file but something is telling me there is a better place for it. Does this also work in shared-styles? I am using polymer 3.

Since you mention “shared-styles” and Polymer 3 I guess you’re using Vaadin 14 in npm mode?

Afaik it should work if you just put the whole <dom-module id="my-text-field" theme-for="vaadin-text-field"> into the HTML block in your shared-styles.js.

E.g.
shared-styles.js:

const $_documentContainer = document.createElement('template');

$_documentContainer.innerHTML = `
<dom-module id="my-text-field" theme-for="vaadin-text-field">
  <template>
    <style>
      :host([theme~="my-special-text-field"]
) [part="input-field"]
 {
        ...
      }
    </style>
  </template>
</dom-module>

<!-- more custom styles may be defined... -->
`;

document.head.appendChild($_documentContainer.content);