Merge resource counts into home page cards

- Remove separate hero-stats section
- Add card-count element to each resource card
- Update JS to populate counts from manifest
- Add card-with-count CSS for layout with count badge
- Reduces vertical space on home page
This commit is contained in:
Aaron Powell
2026-02-02 10:09:36 +11:00
parent e9f2018ece
commit e3894a0b1b
3 changed files with 88 additions and 64 deletions

View File

@@ -357,34 +357,6 @@ a:hover {
color: var(--color-text-muted);
}
.hero-stats {
display: flex;
justify-content: center;
gap: 48px;
margin-top: 56px;
}
.stat {
text-align: center;
}
.stat-value {
font-size: 40px;
font-weight: 800;
background: var(--gradient-primary);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;
}
.stat-label {
font-size: 14px;
color: var(--color-text-muted);
font-weight: 500;
text-transform: uppercase;
letter-spacing: 0.05em;
}
/* Search Results Dropdown */
.search-results {
position: absolute;
@@ -487,6 +459,39 @@ a:hover {
overflow: hidden;
}
.card-with-count {
display: flex;
align-items: flex-start;
gap: 16px;
}
.card-with-count .card-icon {
flex-shrink: 0;
margin-bottom: 0;
}
.card-with-count .card-content {
flex: 1;
min-width: 0;
}
.card-with-count h3 {
margin-bottom: 6px;
}
.card-count {
flex-shrink: 0;
font-size: 28px;
font-weight: 700;
background: var(--gradient-primary);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;
line-height: 1;
min-width: 40px;
text-align: right;
}
.card::before {
content: '';
position: absolute;
@@ -1407,11 +1412,6 @@ a:hover {
font-size: 16px;
}
.hero-stats {
flex-wrap: wrap;
gap: 20px;
}
.steps {
grid-template-columns: 1fr;
gap: 32px;
@@ -1420,6 +1420,16 @@ a:hover {
.cards-grid {
grid-template-columns: 1fr;
}
.card-with-count {
flex-wrap: wrap;
}
.card-count {
position: absolute;
top: 20px;
right: 20px;
}
.resource-item {
flex-direction: column;