Not sure how this all works, but looking here and there I cooked up an attempt at customizing the text field being used on a custom collection with a CSS class made available via an addon that I’m working on.
I have placed the following inside the “options” attribute of the field in question:
The “myaddon-readonly-field” is for now just a dummy class made available by the CSS file being loaded by the addon. I have already tested said CSS file by setting the background color of the “body” tag and that worked OK.
What is puzzling me is that the “readonly” attribute is being picked up (the field is marked as readonly when creating/updating entries), but the “cls” attribute however is not working.
I have even placed a console.log(opts) line inside the this.on(“mount”, function () { … }); of the “field-text” (riot?) component inside the cockpit/modules/Cockpit/assets/components.js file, and this is what is logged to the console:
BTW, the “default” attribute also works (I’m using that on another text field), with the informed default value being picked up and shown/used.
Any help on how to handle all this will be greatly appreciated.
Not sure if I’m doing this right, but I tried applying your fix but now I get the following error on the console whenever I visit a collection’s entry page:
Uncaught Error: Parser “js.view/script” not found.
Tried to fix it by issuing an npm install && npm run build inside the cockpit folder, but to no avail.
I guess this happened because I applied your patch before updating Cockpit itself to its latest version. Having done that, now the error has gone away. My custom class is now being applied, but somewhere in the hierarchy it’s being overwritten/cancelled.
I had to apply a !important rule to the background-color property so to make it stick. I’m no expert in CSS matters, but without that rule the property was apparently being overwritten down the line.
