Bookhoard/bookhoard
0
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 12 Wiki Activity

Remove custom CSS from main user templates

Browse Source 
Remove <style> tags from analytics, bookshelf, conflicts, and dashboard
templates. Convert custom CSS classes (.stat-card, .shelf, .book-item,
.conflict-card, etc.) to TailwindCSS utility classes. Rely on
centralized theme CSS variables in input.css.
This commit is contained in:
john-okeefe
2026-02-02 10:27:53 -05:00
parent 605beb31e5
commit fa16a3d78a
4 changed files with 36 additions and 339 deletions
Download Patch File Download Diff File Expand all files Collapse all files
templates/analytics.templ
+4 -13
View File
@@ -12,15 +12,6 @@ templ Analytics(user User) {
<link href="/static/style.css" rel="stylesheet">
<script src="/static/theme.js"></script>
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
<style>
.stat-card {
transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.stat-card:hover {
transform: translateY(-2px);
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}
</style>
</head>
<body class="theme-{ user.Theme }">
@Header(user, "/analytics")
@@ -54,19 +45,19 @@ templ Analytics(user User) {
<!-- Stats Cards -->
<div class="grid grid-cols-1 md:grid-cols-4 gap-6 mb-8" id="stats-container">
<div class="stat-card card p-6 rounded-lg border" style="background-color: var(--bg-secondary); border-color: var(--border);">
<div class="card p-6 rounded-lg border transition-all duration-200 ease hover:-translate-y-0.5 hover:shadow-lg" style="background-color: var(--bg-secondary); border-color: var(--border);">
<h3 class="text-lg font-semibold mb-2" style="color: var(--text-secondary);">Books Read</h3>
<p id="total-books" class="text-3xl font-bold" style="color: var(--text-primary);">-</p>
</div>
<div class="stat-card card p-6 rounded-lg border" style="background-color: var(--bg-secondary); border-color: var(--border);">
<div class="card p-6 rounded-lg border transition-all duration-200 ease hover:-translate-y-0.5 hover:shadow-lg" style="background-color: var(--bg-secondary); border-color: var(--border);">
<h3 class="text-lg font-semibold mb-2" style="color: var(--text-secondary);">Pages Read</h3>
<p id="total-pages" class="text-3xl font-bold" style="color: var(--text-primary);">-</p>
</div>
<div class="stat-card card p-6 rounded-lg border" style="background-color: var(--bg-secondary); border-color: var(--border);">
<div class="card p-6 rounded-lg border transition-all duration-200 ease hover:-translate-y-0.5 hover:shadow-lg" style="background-color: var(--bg-secondary); border-color: var(--border);">
<h3 class="text-lg font-semibold mb-2" style="color: var(--text-secondary);">Reading Time</h3>
<p id="reading-time" class="text-3xl font-bold" style="color: var(--text-primary);">-</p>
</div>
<div class="stat-card card p-6 rounded-lg border" style="background-color: var(--bg-secondary); border-color: var(--border);">
<div class="card p-6 rounded-lg border transition-all duration-200 ease hover:-translate-y-0.5 hover:shadow-lg" style="background-color: var(--bg-secondary); border-color: var(--border);">
<h3 class="text-lg font-semibold mb-2" style="color: var(--text-secondary);">Completion Rate</h3>
<p id="completion-rate" class="text-3xl font-bold" style="color: var(--text-primary);">-</p>
</div>