Skip to content

Alternate coloring of months to improve readability #111

@lksrpp

Description

@lksrpp

First of all: Thanks for this plugin, I really like it!

I have a proposal to improve the readability of the graphs by adding a alternate coloring for different months. A subtle difference in the shade of grey would go a long way to enhance the visual separation of different months.

This could be easily implemented by adding a css class like "month-even" and "month-odd" when rendering the calendar. The css class could be easily styled; for a more accessible approach this could be made configurable in the setup modal as well.

For example, adding some lines here: https://github.com/vran-dev/obsidian-contribution-graph/blob/8a4a85cc369849be8c29052e2d977ef7d4679960/src/render/gitStyleTrackGraphRender.ts in line 109

 // For each day cell, add month-odd / month-even classes
+       if (contributionItem.date !== "$HOLE$") {
+           const monthIndexCell = contributionItem.month + 1; // 1-based
+           if (monthIndexCell % 2 === 0) {
+               cellEl.classList.add("month-even");
+           } else {
+               cellEl.classList.add("month-odd");
+           }
+       }

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions