Vaadin TextField readonly style

Question

How can I change the style of a readonly TextField in Vaadin?

Now the default style after setting setReadOnly(true) is following:

I want this style with no border and an other backgroundcolor:

How can I achieve this?

Answer 1

you could try with this code for that particular text field you want to modify:

TextField textField = new TextField();
        textField.setReadOnly(true);

        // Remove border and set background color to gray
        textField.getElement().getStyle().set("border", "none");
        textField.getElement().getStyle().set("background-color", "gray");

it is worth noticing that if you want the whole application with that style please follow the documentation.
in there you can find how to customize all the text fields in your application.