Role doesn't work for TextBox

[duncan_richards12]

What I’m trying to do:
Set a role to work on a TextBox
What I’ve tried and what’s not working:

I tried setting up the role below, but it doesn’t work unless I set every property to important for a Textbox, but it works without important for Label.

Seems to be related to this post:

Custom CSS Role for TextBox not working

I’ve been trying for some time now to get a custom role to work on my text boxes with no luck. I have added for example this custom role in the .css asset: .anvil-role-red { color: #ff0000; } I also created the corresponding role in the Roles section both restricted to TextBox and for all components. I’m sure there is a simple solution to this, but it has eluded me.

but that never got proper closure, so starting this thread.

Code Sample:

.anvil-role-inline-popup {
  box-shadow: 0px 10px 30px rgba(0, 0, 0, 0.8);
  padding: 10px;
  margin: 10px;
  border: 1px solid #ccc;
  border-radius: 4px;
  background-color: blue;
  color: red;
}```` 

Clone link:
share a copy of your app

[hugetim]

It works for me if I add input.anvil-component.anvil-role-inline-popup like so:

input.anvil-component.anvil-role-inline-popup, .anvil-role-inline-popup {
  box-shadow: 0px 10px 30px rgba(0, 0, 0, 0.8);
  padding: 10px;
  margin: 10px;
  border: 1px solid #ccc;
  border-radius: 4px;
  background-color: blue;
  color: red;
}