Attribute: css-override
The css-override attribute of the <comentario-comments> tag allows to override comment styling
The css-override attribute of the comments tag can be used to change or disable standard Comentario styles for embedded comments.
Its value can be:
- A string specifying URL of a custom CSS stylesheet. It will be downloaded and applied after the standard Comentario stylesheet (
comentario.css), thus overriding any default styles. false, in which case all standard styling will be disabled. To get comments to work, you will need to include a link to a compatible stylesheet on your page. This is far from trivial: you can have a look at the SCSS directory for details.
Changing the value on-the-fly
This attribute is reactive: changing it on an already-embedded tag reinitialises Comentario, loading the newly referenced stylesheet, without reloading the browser page:
document.querySelector('comentario-comments').setAttribute('css-override', 'https://example.com/custom.css');
The previously applied override is removed from the page in the process, so the stylesheets never pile up: switching between several overrides at runtime always leaves exactly one of them in effect. Setting the value to false removes the standard stylesheet as well, and removing the attribute altogether goes back to the standard stylesheet alone.
<comentario-comments> tags: a stylesheet shared by them only disappears once the last tag using it has let it go.If you merely need to switch between a light and a dark appearance, prefer the theme attribute: it’s handled purely in CSS and doesn’t reinitialise the widget.