Skip to content

Commit 3e5ca8b

Browse files
authored
Create separate nunjucks files (#281)
1 parent cfd4948 commit 3e5ca8b

9 files changed

Lines changed: 95 additions & 94 deletions

File tree

.gitignore

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,3 +2,4 @@ _site
22
.jekyll-cache
33
node_modules
44
vendor
5+
.venv

src/_includes/bio.njk

Lines changed: 1 addition & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -85,11 +85,7 @@
8585
<h2 class="text-xs font-black uppercase tracking-[0.3em] text-[var(--text-muted)] mb-6">Technologies</h2>
8686
<div class="flex flex-wrap gap-3">
8787
{% set skills = languages.split(' ') %}
88-
{% for skill in skills %}
89-
<span class="px-4 py-2 bg-accent text-white text-xs font-black rounded-xl uppercase tracking-widest shadow-sm">
90-
{{ skill }}
91-
</span>
92-
{% endfor %}
88+
{% include "skills-list.njk" %}
9389
</div>
9490
</div>
9591
</div>

src/_includes/footer-details.njk

Lines changed: 46 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,46 @@
1+
<footer class="mt-20 border-t border-[var(--border-color)] bg-[var(--bg-footer)] py-12">
2+
<div class="max-w-7xl mx-auto px-4 flex flex-col md:flex-row justify-between items-center gap-8">
3+
4+
<div class="flex flex-col items-center md:items-start text-center md:text-left">
5+
<p class="text-[var(--text-main)] font-bold text-sm uppercase tracking-widest">
6+
Developer Directory
7+
</p>
8+
9+
<p class="mt-1 text-[var(--text-muted)] text-[10px] font-mono uppercase tracking-[0.15em]">
10+
&copy; <span id="current-year">{% currentYear %}</span> Built with
11+
<span id="footer-heart" class="transition-colors duration-500">❤️</span>
12+
by the Open-Source Community
13+
</p>
14+
15+
<div class="flex items-center justify-center md:justify-start gap-3 mt-4">
16+
<a href="https://www.11ty.dev/" target="_blank" class="text-[10px] font-bold px-2 py-1 rounded bg-[var(--bg-card)] border border-[var(--border-color)] text-[var(--text-muted)] hover:text-accent transition-all">🎈 11ty</a>
17+
<a href="https://tailwindcss.com/" target="_blank" class="text-[10px] font-bold px-2 py-1 rounded bg-[var(--bg-card)] border border-[var(--border-color)] text-[var(--text-muted)] hover:text-accent transition-all">🌊 Tailwind</a>
18+
</div>
19+
</div>
20+
21+
<div class="flex flex-col items-center md:items-end gap-2">
22+
<div class="flex items-center gap-3">
23+
<span class="w-2 h-2 rounded-full bg-green-500 animate-pulse"></span>
24+
<span class="text-[var(--text-muted)] text-[10px] font-black uppercase tracking-widest">Build: {{ build.timestamp }}</span>
25+
</div>
26+
27+
<div class="flex items-center bg-[var(--bg-card)] border border-[var(--border-color)] rounded-lg overflow-hidden shadow-sm">
28+
<button onclick="triggerSecretUnlock('gravity')" class="px-3 py-1.5 text-[10px] font-mono hover:bg-red-500/10 transition-colors group/hash">
29+
<span class="text-[var(--text-muted)] group-hover/hash:text-red-500">Hash:</span>
30+
<span class="text-accent font-bold underline decoration-dotted">
31+
<code class="cursor-pointer hover:text-red-500 transition-colors">{{ build.hash }}</code>
32+
</span>
33+
</button>
34+
35+
<a href="{{ build.repoUrl }}/commit/{{ build.hash }}"
36+
target="_blank"
37+
rel="noopener"
38+
class="px-3 py-1.5 border-l border-[var(--border-color)] bg-[var(--bg-footer)] hover:text-accent transition-colors"
39+
title="View Commit on GitHub">
40+
<span>↗</span>
41+
</a>
42+
</div>
43+
</div>
44+
45+
</div>
46+
</footer>

src/_includes/footer.njk

Lines changed: 2 additions & 52 deletions
Original file line numberDiff line numberDiff line change
@@ -1,59 +1,9 @@
1-
<footer class="mt-20 border-t border-[var(--border-color)] bg-[var(--bg-footer)] py-12">
2-
<div class="max-w-7xl mx-auto px-4 flex flex-col md:flex-row justify-between items-center gap-8">
3-
4-
<div class="flex flex-col items-center md:items-start text-center md:text-left">
5-
<p class="text-[var(--text-main)] font-bold text-sm uppercase tracking-widest">
6-
Developer Directory
7-
</p>
8-
9-
<p class="mt-1 text-[var(--text-muted)] text-[10px] font-mono uppercase tracking-[0.15em]">
10-
&copy; <span id="current-year">{% currentYear %}</span> Built with
11-
<span id="footer-heart" class="transition-colors duration-500">❤️</span>
12-
by the Open-Source Community
13-
</p>
14-
15-
<div class="flex items-center justify-center md:justify-start gap-3 mt-4">
16-
<a href="https://www.11ty.dev/" target="_blank" class="text-[10px] font-bold px-2 py-1 rounded bg-[var(--bg-card)] border border-[var(--border-color)] text-[var(--text-muted)] hover:text-accent transition-all">🎈 11ty</a>
17-
<a href="https://tailwindcss.com/" target="_blank" class="text-[10px] font-bold px-2 py-1 rounded bg-[var(--bg-card)] border border-[var(--border-color)] text-[var(--text-muted)] hover:text-accent transition-all">🌊 Tailwind</a>
18-
</div>
19-
</div>
20-
21-
<div class="flex flex-col items-center md:items-end gap-2">
22-
<div class="flex items-center gap-3">
23-
<span class="w-2 h-2 rounded-full bg-green-500 animate-pulse"></span>
24-
<span class="text-[var(--text-muted)] text-[10px] font-black uppercase tracking-widest">Build: {{ build.timestamp }}</span>
25-
</div>
26-
27-
<div class="flex items-center bg-[var(--bg-card)] border border-[var(--border-color)] rounded-lg overflow-hidden shadow-sm">
28-
<button onclick="triggerSecretUnlock('gravity')" class="px-3 py-1.5 text-[10px] font-mono hover:bg-red-500/10 transition-colors group/hash">
29-
<span class="text-[var(--text-muted)] group-hover/hash:text-red-500">Hash:</span>
30-
<span class="text-accent font-bold underline decoration-dotted">
31-
<code class="cursor-pointer hover:text-red-500 transition-colors">{{ build.hash }}</code>
32-
</span>
33-
</button>
34-
35-
<a href="{{ build.repoUrl }}/commit/{{ build.hash }}"
36-
target="_blank"
37-
rel="noopener"
38-
class="px-3 py-1.5 border-l border-[var(--border-color)] bg-[var(--bg-footer)] hover:text-accent transition-colors"
39-
title="View Commit on GitHub">
40-
<span>↗</span>
41-
</a>
42-
</div>
43-
</div>
44-
45-
</div>
46-
</footer>
1+
{% include "footer-details.njk" %}
472

483
{% include "system-override.njk" %}
494

505
{% include "matrix-overlay.njk" %}
516

527
{% include "system-log.njk" %}
538

54-
<script>
55-
// This turns your Eleventy data into a global JS constant
56-
const LEVELS = {{ levels | dump | safe }};
57-
</script>
58-
59-
<script src="/assets/js/script.js"></script>
9+
{% include "scripts.njk" %}

src/_includes/header-details.njk

Lines changed: 30 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,30 @@
1+
<div class="flex flex-col items-center lg:items-start group">
2+
3+
<div class="flex items-center">
4+
{% if page.url == "/" %}
5+
<h1 class="text-3xl md:text-5xl font-black tracking-tighter text-[var(--text-main)] uppercase italic leading-none transition-all">
6+
Our Developers
7+
</h1>
8+
{% else %}
9+
<a href="/" class="group/back flex items-center gap-3">
10+
<span class="text-2xl md:text-4xl text-accent transition-transform group-hover/back:-translate-x-2">←</span>
11+
<h1 class="text-3xl md:text-5xl font-black tracking-tighter text-[var(--text-main)] uppercase italic leading-none transition-all group-hover/back:text-accent">
12+
Directory
13+
</h1>
14+
</a>
15+
{% endif %}
16+
</div>
17+
18+
<div class="mt-2 text-accent font-mono text-sm md:text-base font-bold tracking-tight">
19+
<span class="opacity-100">{{ collections.randomPeople.length }}</span> Active Profiles
20+
</div>
21+
22+
<p class="hidden md:flex text-[var(--text-muted)] text-[9px] font-mono uppercase tracking-[0.3em] mt-1 items-center gap-2">
23+
{% if page.url == "/" %}
24+
<span class="w-1.5 h-1.5 rounded-full bg-green-500 animate-pulse"></span>
25+
<span class="header-gtd">Global Talent Directory</span>
26+
{% else %}
27+
Viewing Profile Details
28+
{% endif %}
29+
</p>
30+
</div>

src/_includes/header.njk

Lines changed: 1 addition & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -1,36 +1,7 @@
11
<header class="sticky top-0 z-[100] w-full bg-[var(--bg-page)]/80 backdrop-blur-md border-b-2 border-[var(--border-color)]">
22
<div class="max-w-7xl mx-auto px-4 py-4 md:py-6 flex flex-col lg:flex-row items-center justify-between gap-6">
33

4-
<div class="flex flex-col items-center lg:items-start group">
5-
6-
<div class="flex items-center">
7-
{% if page.url == "/" %}
8-
<h1 class="text-3xl md:text-5xl font-black tracking-tighter text-[var(--text-main)] uppercase italic leading-none transition-all">
9-
Our Developers
10-
</h1>
11-
{% else %}
12-
<a href="/" class="group/back flex items-center gap-3">
13-
<span class="text-2xl md:text-4xl text-accent transition-transform group-hover/back:-translate-x-2">←</span>
14-
<h1 class="text-3xl md:text-5xl font-black tracking-tighter text-[var(--text-main)] uppercase italic leading-none transition-all group-hover/back:text-accent">
15-
Directory
16-
</h1>
17-
</a>
18-
{% endif %}
19-
</div>
20-
21-
<div class="mt-2 text-accent font-mono text-sm md:text-base font-bold tracking-tight">
22-
<span class="opacity-100">{{ collections.randomPeople.length }}</span> Active Profiles
23-
</div>
24-
25-
<p class="hidden md:flex text-[var(--text-muted)] text-[9px] font-mono uppercase tracking-[0.3em] mt-1 items-center gap-2">
26-
{% if page.url == "/" %}
27-
<span class="w-1.5 h-1.5 rounded-full bg-green-500 animate-pulse"></span>
28-
<span class="header-gtd">Global Talent Directory</span>
29-
{% else %}
30-
Viewing Profile Details
31-
{% endif %}
32-
</p>
33-
</div>
4+
{% include "header-details.njk" %}
345

356
{% include "game-stats.njk" %}
367

src/_includes/scripts.njk

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
<script>
2+
// This turns your Eleventy data into a global JS constant
3+
const LEVELS = {{ levels | dump | safe }};
4+
</script>
5+
6+
<script src="/assets/js/script.js"></script>

src/_includes/skills-list.njk

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
<div class="skills-list">
2+
{% for skill in skills %}
3+
<span class="skill-item">
4+
<span onmouseenter="createFloatingXP(event)" class="skill-tag cursor-crosshair">{{ skill }}</span>
5+
</span>
6+
{% endfor %}
7+
</div>

src/index.njk

Lines changed: 1 addition & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -32,13 +32,7 @@ layout: false
3232

3333
<div class="mt-6 flex flex-wrap gap-2">
3434
{% set skills = person.data.languages.split(' ') %}
35-
<div class="skills-list">
36-
{% for skill in skills %}
37-
<span class="skill-item">
38-
<span onmouseenter="createFloatingXP(event)" class="skill-tag cursor-crosshair">{{ skill }}</span>
39-
</span>
40-
{% endfor %}
41-
</div>
35+
{% include "skills-list.njk" %}
4236
</div>
4337

4438
<p class="mt-4 text-[var(--text-muted)] text-sm italic line-clamp-3">"{{ person.data.bio | truncate(120) }}"</p>

0 commit comments

Comments
 (0)