Overriding error style for Input

[AdrianG]

Hi

I’m trying to learn CSS and is in a situation where I’m looking for a way to override the style when error prop in Input field is set to true
The simple change is just to get rid of the icon, while keeping the red borders. I’m not sure if it’s possible just to get rid of the icon, so I might have to create a new style just to add the red border

I tried to go through the styles used for the elements in Input field to see if I could figure out how to do it, but so far no luck

Any help would be greatly appreciated

[s.molinari]

An easy way to remove the icon via CSS is to add this to your component.

.q-icon {
  display: none;
}

However, that would mean you can’t use any icons for other purposes, and that wouldn’t be very useful.

What you can do is simply empty the icon definition for the error icon. See this codepen for how:

https://codepen.io/smolinari/pen/GRJbmWQ?editors=1010

Scott

[AdrianG]

@s-molinari
Great, thanks
I’m using the option for removing the icon from the iconset. I can it only hides the icon, but still keeps space for it, causing the label not to use the full space. This is fine as I’ll just use stack-label on the fields