Hi! I would like to style a single table in a post. The table is generated by dataview. I know I can apply a css class to the whole note but I just want this single table to look different. Is there any way to add a css class to a specific table?
take a look at German Dictionary - inline Dataview
which covers the same concept to a degree. in this case it calls out by the Yaml and affects all tables in the page.
You could use nth-of-type (along with a class added to the note) to target the table. This is obviously hacky and fragile — you may need to update the style if the number of tables in the note changes.
You could also just write that table in HTML and add a class directly to it.
Using HTML tables is a great idea if the tables are static. I wonder if there is a way to add a class tag to a table generated from dataview.
There’s a way to do that, but you need to use the javascript side: using DVJS instead of DQL. You need to use the dv.view() method: Codeblock Reference - Dataview.
I only tried it once, so I have no great experience to give you the right instructions.
Thanks! I also tried dv.view() already. It supports to specify a css file, but it will be applied to the whole note.
I found a different solution. dv.container gives you access to the container HTML element of the current code block. You can modify the class list of it like this:
```dataviewjs
dv.table(["period"], dv.pages("#job").map(b => [b.period]))
dv.container.classList.add("cv-jobs");
I didn’t noticed that dv.view() method is applied to the whole note.
About the dv.container, in fact I already see it somewhere but never tried…
This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.