Change height and font-size below the size="small"

[goosedeersolutions]

I am trying to add an input into a data table of mine but it is too tall, even with size="small"

I have tried the following with not luck:

 wa-input {
  .input {
    height: 1px !important;
    font-size: 1px !important;
  }
}

 wa-input {
  ::part(base) {
    height: 1px !important;
    font-size: 1px !important;
  }
}

I can see in the browser console that the element with part="base" have the following:

but for the life of me I cannot get the input to change height.

[claviska]

For more granular changes, you need to hook into CSS Parts.

wa-input::part(base) {
  font-size: 10px;
  height: 16px;
}

wa-input::part(input) {
  height: inherit;  
}

CSS parts are listed in the docs for each component. We're working on improving how to describe component anatomy and parts to make this more clear :)

[goosedeersolutions]

Thank you very much.