75 lines
2.7 KiB
HTML
75 lines
2.7 KiB
HTML
{% extends "base.html" %}
|
||
{% block title %}Projects{% endblock %}
|
||
|
||
{% block content %}
|
||
|
||
<!-- Hero -->
|
||
<section class="text-center py-20 bg-gradient-to-br from-orange-500/20 via-rose-500/10 to-fuchsia-500/10 text-white shadow-inner">
|
||
<h1 class="heading-hero mb-4">My Projects</h1>
|
||
<p class="text-lg opacity-90">A snapshot of things I’ve built or contributed to.</p>
|
||
</section>
|
||
|
||
<!-- Projects Grid -->
|
||
<section id="projects" class="py-16">
|
||
<div class="container-page">
|
||
{% if projectpost|length == 0 %}
|
||
<div class="card text-center">
|
||
<h2 class="text-2xl font-semibold mb-2">Nothing here yet</h2>
|
||
<p class="subtle">Projects will appear as you publish them.</p>
|
||
</div>
|
||
{% else %}
|
||
<div class="grid md:grid-cols-2 lg:grid-cols-3 gap-6">
|
||
{% for p in projectpost %}
|
||
<article class="card group overflow-hidden transition hover:shadow-glass">
|
||
{% if p.cover_image %}
|
||
<a href="{{ url_for('view_project', slug=p.slug) }}" class="block -m-6 mb-4 overflow-hidden rounded-2xl">
|
||
<img src="{{ p.cover_image }}" alt="{{ p.title }}" class="w-full h-40 object-cover group-hover:scale-[1.02] transition" loading="lazy">
|
||
</a>
|
||
{% endif %}
|
||
|
||
<h2 class="text-xl font-semibold">
|
||
<a href="{{ url_for('view_project', slug=p.slug) }}" class="hover:underline">
|
||
{{ p.title }}
|
||
</a>
|
||
</h2>
|
||
|
||
{% if p.category %}
|
||
<span class="mt-2 inline-flex items-center gap-2 text-xs font-medium px-3 py-1 rounded-full
|
||
border border-[rgb(var(--border))] bg-[rgb(var(--card))] text-[rgb(var(--muted))]">
|
||
{{ p.category }}
|
||
</span>
|
||
{% endif %}
|
||
|
||
{% if p.summary %}
|
||
<p class="mt-3 subtle line-clamp-3">{{ p.summary }}</p>
|
||
{% endif %}
|
||
|
||
{% set tags = (p.tags|default('', true)).split(',') if p.tags else [] %}
|
||
{% if tags %}
|
||
<div class="mt-4 flex flex-wrap gap-2">
|
||
{% for tag in tags %}
|
||
{% set t = tag.strip() %}
|
||
{% if t %}
|
||
<a href="{{ url_for('view_project_tag', tag=t) }}"
|
||
class="text-xs px-3 py-1 rounded-full border border-[rgb(var(--border))]
|
||
bg-[rgb(var(--card))] hover:bg-[rgb(var(--border))] transition">
|
||
#{{ t }}
|
||
</a>
|
||
{% endif %}
|
||
{% endfor %}
|
||
</div>
|
||
{% endif %}
|
||
|
||
<div class="mt-6">
|
||
<a href="{{ url_for('view_project', slug=p.slug) }}" class="btn btn-primary">View Project</a>
|
||
</div>
|
||
</article>
|
||
{% endfor %}
|
||
</div>
|
||
{% endif %}
|
||
</div>
|
||
</section>
|
||
|
||
{% endblock %}
|
||
|