Hi @veitch
See if this helps you any. It is for table dataviews but some of it may help with what you are doing. I pieced it together from a post by Flexit and some help from @ariehen and a bit from a post by scholarInTraining.
/* Light Mode */
.theme-light {
--dvTotalCount: #555
}
/* Dark Mode */
.theme-dark {
--dvTotalCount: #333
}
/*
Adapted from Yellow cab table by Flexit
https://forum.obsidian.md/t/css-stylesheet-for-dataview-table/56905
*/
.tableDV table {
border-collapse: collapse;
}
.tableDV table th {
font-family: 'Montserrat', sans-serif;
font-size: 20px;
font-weight: 700;
}
/* Header */
.tableDV table thead th {
padding: 5px 10px;
background-color: #aa720b !important;
color: #000000;
}
/* Cell padding High wide*/
.tableDV td,
.tableDV th {
border: 1px solid #000000;
padding: 0px 3px;
}
/* Table Row Text and table border lines */
.tableDV table td {
font-family: 'Arial Black';
font-size: 18px;;
color: #000000;
word-wrap: break-word;
border-left: 1px solid #000000 !important;
}
/* Hover over Header highlight */
.tableDV thead th:hover {
background-color: #ffba00 !important;
}
/* alternating rows */
.tableDV tbody tr:nth-of-type(odd) {
background-color: #EBDDCFff;
}
/* alternating rows */
.tableDV tbody tr:nth-of-type(even) {
background-color: #EBDDCFbb;
}
/* Hover over Table Rows highlight */
.tableDV tbody tr:hover td,
.tableDV tbody tr:hover td strong,
.tableDV tbody tr:hover td a {
background-color: #555 !important;
color: yellow;
}
/* << EDITING link color INTERNAL >> */
.cm-s-obsidian span.cm-hmd-internal-link {
font-weight: 400;
color: #ffba00 !important;
}
/* << READING link color INTERNAL >> */
.markdown-preview-view .internal-link {
font-weight: 400;
color: #ffba00 !important;
}
/* Color the links
ariehen
https://forum.obsidian.md/t/change-link-color-but-not-button-color/56939 */
body {
--link-color: #000;
--link-external-color: #0f0;
}*/
body :is(.block-language-dataview) {
--link-color: #000;
--link-external-color: #Ff0;
}
/*
Total Count color in heading scholarInTraining
*/
.dataview.small-text {
color: var(--dvTotalCount) !important;
}
Here is what it looks like:
