RichTextArea readonly background color

Support
#1

Hello,
I’m trying to extend the hover theme in order to change the background color of read-only ricxtextarea component.
What is the name of that attribute to assign the new color to?
(must be something like background-something- color)

Alternatively, whats the attribute name for the read-only TextArea?

Thanks

#3

Hello,

You can use background-color or background properties. The background just collect all properties with background-*** name. For instance:

.v-richtextarea.v-readonly {
  background: green;  /* or background-color: green; */
}

To change color for all readonly fields in the app you can use the following variable in the hover-ext-defaults.scss file:

$v-textfield-background-color--readonly: green;
#5

Thank you.

It works nicely.
However, let’s say that we have two readonly richtextareas on the page, and we want to apply a different style for each, so each is of a different color?

e.g.
style test1 is red, and style test2 is blue.
richTextArea1 would have style test1, and richTextArea2 would have style test2.

#6

Create two styles:

.v-richtextarea.v-readonly.test1 {
  background: red;
}
.v-richtextarea.v-readonly.test2 {
  background: blue;
}

<richTextArea id="rta1" editable="false" stylename="test1"/>
<richTextArea id="rta2" editable="false" stylename="test2"/>
#7

Thank you.