summaryrefslogtreecommitdiffstats
path: root/assets/css/main.css
diff options
context:
space:
mode:
authorDanilo M. <danix@danix.xyz>2026-05-08 17:39:07 +0200
committerDanilo M. <danix@danix.xyz>2026-05-08 17:39:29 +0200
commita865dcbb69b0541ccdab941eede8c3005dfed9c7 (patch)
tree7d9ceec5f417e859e5911f0e3dc593b7471326bc /assets/css/main.css
parent9d5f690b8f98c6e9cf7d54b7279c5097e7a1d3a4 (diff)
downloaddanixxyz-theme-a865dcbb69b0541ccdab941eede8c3005dfed9c7.tar.gz
danixxyz-theme-a865dcbb69b0541ccdab941eede8c3005dfed9c7.zip
feat: add contribution graph widget
Sidebar (/is pages, cellSize=8) and footer (sitewide, cellSize=6). Fetches /contributions.json, split-cell linear-gradient rendering (gitolite=green/accent2, github=purple/accent), opacity intensity levels, month labels, tooltip, i18n IT/EN. WCAG 2.1 AA compliant. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Diffstat (limited to 'assets/css/main.css')
-rw-r--r--assets/css/main.css69
1 files changed, 69 insertions, 0 deletions
diff --git a/assets/css/main.css b/assets/css/main.css
index 3aafd4f..04f737d 100644
--- a/assets/css/main.css
+++ b/assets/css/main.css
@@ -1923,3 +1923,72 @@ html.theme-light .prose-invert .cta-block a {
vertical-align: -0.1em;
margin: 0;
}
+
+/* ============================================================
+ Contribution Graph Widget
+ ============================================================ */
+
+.contrib-graph-wrap {
+ overflow-x: auto;
+}
+
+.contrib-month-row {
+ display: grid;
+ grid-auto-flow: column;
+ gap: var(--contrib-gap, 2px);
+ margin-bottom: 2px;
+ width: fit-content;
+ min-width: 100%;
+}
+
+.contrib-month-label {
+ font-size: 0.55rem;
+ color: var(--text-dim);
+ font-family: monospace;
+ white-space: nowrap;
+ overflow: hidden;
+}
+
+.contrib-grid {
+ display: grid;
+ grid-template-rows: repeat(7, var(--contrib-cell-size, 8px));
+ grid-auto-flow: column;
+ gap: var(--contrib-gap, 2px);
+ width: fit-content;
+}
+
+.contrib-cell {
+ width: var(--contrib-cell-size, 8px);
+ height: var(--contrib-cell-size, 8px);
+ border-radius: 1px;
+ background: var(--border);
+ cursor: default;
+}
+
+.contrib-tooltip {
+ position: fixed;
+ background: var(--bg2);
+ border: 1px solid var(--border);
+ border-radius: 4px;
+ padding: 5px 8px;
+ font-size: 0.65rem;
+ line-height: 1.5;
+ color: var(--text);
+ font-family: monospace;
+ pointer-events: none;
+ z-index: 50;
+ white-space: nowrap;
+ display: none;
+}
+
+.contrib-tooltip.visible {
+ display: block;
+}
+
+.contrib-summary {
+ font-size: 0.65rem;
+ color: var(--text-dim);
+ margin-top: 6px;
+ font-family: monospace;
+ display: block;
+}