How to: Dataview table alternate colors

Help
3

This is the CSS I use to center and color all tables (including Dataview tables):

/*
 * ========================================================
 * PREVIEW MODE
 * ========================================================
 */

/* Center tables on the page */
.markdown-preview-view table {
    margin-left: auto;
    margin-right: auto;
}

/* Color odd and even rows */
.markdown-preview-view th {
      background-color: var(--background-secondary-alt);
}
.markdown-preview-view tr:nth-child(odd) {
      background-color: var(--background-primary);
}
.markdown-preview-view tr:nth-child(even) {
      background-color: var(--background-secondary);
}

/*
 * ========================================================
 * LIVE PREVIEW MODE
 * ========================================================
 */

/* Center tables on the page */
.markdown-rendered table {
    margin-left: auto;
    margin-right: auto;
}

/* Color odd and even rows */
.markdown-rendered th {
      background-color: var(--background-secondary-alt);
}
.markdown-rendered tr:nth-child(odd) {
      background-color: var(--background-primary);
}
.markdown-rendered tr:nth-child(even) {
      background-color: var(--background-secondary);
}
3 Likes