Best way to display read only & read write fields mixed together in web

I have web page form with 5 sections and almost 30 text fields. Out of which 15 are read-only and remaining are read-write. The form is built in material design.

In my case, in section 1, I have 3 read-write fields and 10 read only fields.

I tried to display the read-only fields in material design, but it does not look good.

Are there any examples of best read-only & read-write field combination of forms?

What are the best practices?

The entire form is not looking good with material design. I think material design doesn't suit the web, maybe for mobile it looks good, but not on the web.

Expecting many answers.