docs(readme): embed live dracula preview at the top (#16)

The README previously only LINKED to the demo gallery. Pull the dracula
theme inline so a reader can scan every card type + the LY/AT pairs
without leaving the page, and use the demo gallery for the other 64
themes. SVGs resolve against demo/dracula/ which the demo workflow keeps
fresh on every push to main.
This commit is contained in:
2026-04-19 10:24:34 +07:00
committed by GitHub
parent 88397e80a3
commit dab7fe0371
+43 -1
View File
@@ -32,7 +32,49 @@ Cards rendered:
| 13 | **Contributions (all time)** | Area chart across every active year, auto-thinned x-axis labels |
| 14 | **Contributions by year** | One bar per active year, peak year highlighted |
Every available theme rendered against the author's profile — profile details, stats, language donuts, productive-time, heatmap, streak, contributions, top repos — is browsable in the auto-generated [**demo gallery**](./demo). Regenerated on every push to `main` by [`.github/workflows/demo.yml`](./.github/workflows/demo.yml).
## Preview — dracula theme
Live render against the author's profile, committed by [`.github/workflows/demo.yml`](./.github/workflows/demo.yml) on every push to `main`. Other 64 themes in the [**demo gallery**](./demo).
<table>
<tr>
<td><img src="./demo/dracula/profile-details.svg" alt="profile details" /></td>
<td><img src="./demo/dracula/stats.svg" alt="stats" /></td>
</tr>
<tr>
<td><img src="./demo/dracula/streak.svg" alt="streak" /></td>
<td><img src="./demo/dracula/top-starred-repos.svg" alt="top starred repos" /></td>
</tr>
<tr>
<td><img src="./demo/dracula/repos-per-language.svg" alt="repos per language" /></td>
<td><img src="./demo/dracula/contributions-heatmap.svg" alt="contributions heatmap" /></td>
</tr>
<tr>
<td colspan="2" align="center"><img src="./demo/dracula/contributions-by-year.svg" alt="contributions by year" /></td>
</tr>
</table>
### Last year vs all time
<table>
<tr><th>Last year</th><th>All time</th></tr>
<tr>
<td><img src="./demo/dracula/most-commit-language.svg" alt="most commit language last year" /></td>
<td><img src="./demo/dracula/most-commit-language-all-time.svg" alt="most commit language all time" /></td>
</tr>
<tr>
<td><img src="./demo/dracula/productive-time.svg" alt="productive time last year" /></td>
<td><img src="./demo/dracula/productive-time-all-time.svg" alt="productive time all time" /></td>
</tr>
<tr>
<td><img src="./demo/dracula/productive-weekday.svg" alt="productive weekday last year" /></td>
<td><img src="./demo/dracula/productive-weekday-all-time.svg" alt="productive weekday all time" /></td>
</tr>
<tr>
<td><img src="./demo/dracula/contributions.svg" alt="contributions last year" /></td>
<td><img src="./demo/dracula/contributions-all-time.svg" alt="contributions all time" /></td>
</tr>
</table>
## In the wild