benny/Portfolio
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

wqInitial Commit

Browse Source
This commit is contained in:
benny
2026-04-23 01:24:24 +00:00
parent 0925125422
commit 2ccc1d0292
3474 changed files with 787147 additions and 647 deletions
Download Patch File Download Diff File Expand all files Collapse all files

97
templates/view_blog.html
View File

@@ -1,78 +1,63 @@
{% extends "base.html" %}
{% block title %}{{ blogpost.title }}{% endblock %}
{% block content %}
<!-- Hero Title Section -->
<section class="py-20 bg-gradient-to-br from-red-800 to-orange-400 text-white text-center">
<h1 class="text-5xl font-extrabold mb-4">{{ blogpost.title }}</h1>
<p class="text-lg italic">Category: {{ blogpost.category }}</p>
<div class="mt-4 flex justify-center flex-wrap gap-2">
{% for tag in blogpost.tags.split(',') %}
<a href="{{ url_for('view_tag', tag=tag.strip()) }}"
class="bg-white text-gray-800 text-sm px-3 py-1 rounded-full shadow hover:bg-gray-100 transition">
#{{ tag.strip() }}
</a>
{% endfor %}
<!-- Hero -->
<section class="py-20 text-center text-white bg-gradient-to-br from-orange-500/20 via-rose-500/10 to-fuchsia-500/10 backdrop-blur border-b border-white/10">
<div class="max-w-3xl mx-auto px-6">
<h1 class="text-5xl md:text-6xl font-archivo font-extrabold mb-3">{{ blogpost.title }}</h1>
{% if blogpost.category %}
<p class="text-white/80 italic text-lg">{{ blogpost.category }}</p>
{% endif %}
{% if blogpost.tags %}
<div class="mt-4 flex justify-center flex-wrap gap-2">
{% for tag in blogpost.tags.split(',') %}
{% set t = tag.strip() %}
{% if t %}
<a href="{{ url_for('view_tag', tag=t) }}"
class="text-xs px-3 py-1 rounded-full border border-white/15 bg-white/5 hover:bg-white/10 transition">
#{{ t }}
</a>
{% endif %}
{% endfor %}
</div>
{% endif %}
</div>
</section>
<!-- Content Section -->
<section class="py-16 bg-black text-white">
<div class="max-w-4xl mx-auto px-4 space-y-8">
<!-- Body -->
<section class="py-16">
<div class="container-page space-y-10">
{% if blogpost.images %}
<div class="mb-5">
<h3 class="fs-3 fw-semibold text-orange mb-4">Gallery</h3>
<div id="blogImageCarousel" class="carousel slide shadow rounded overflow-hidden" data-bs-ride="carousel">
<div class="carousel-inner">
{% for image in blogpost.images|from_json %}
<div class="carousel-item {% if loop.first %}active{% endif %}">
<img src="{{ url_for('static', filename='uploads/' + image) }}" class="d-block w-100" alt="Post Image"
style="max-height: 500px; object-fit: cover;">
</div>
{% endfor %}
</div>
<!-- Controls -->
<button class="carousel-control-prev" type="button" data-bs-target="#blogImageCarousel" data-bs-slide="prev">
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
<span class="visually-hidden">Previous</span>
</button>
<button class="carousel-control-next" type="button" data-bs-target="#blogImageCarousel" data-bs-slide="next">
<span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="visually-hidden">Next</span>
</button>
<!-- Optional indicators -->
<div class="carousel-indicators">
{% for image in blogpost.images|from_json %}
<button type="button" data-bs-target="#blogImageCarousel" data-bs-slide-to="{{ loop.index0 }}"
{% if loop.first %}class="active" aria-current="true"{% endif %} aria-label="Slide {{ loop.index }}"></button>
{% endfor %}
<!-- Simple static gallery (no extra routes) -->
<div class="card bg-[rgb(var(--card))]">
<h3 class="text-xl font-semibold text-white mb-4">Gallery</h3>
<div class="grid gap-6 sm:grid-cols-2">
{% for image in blogpost.images|from_json %}
<div class="overflow-hidden rounded-xl border border-[rgb(var(--border))] bg-[rgb(var(--card))] hover:scale-[1.02] transition-transform duration-300 shadow-glass">
<img src="{{ url_for('static', filename='uploads/' + image) }}"
alt="Blog image {{ loop.index }}"
class="w-full h-64 object-cover">
</div>
{% endfor %}
</div>
</div>
{% endif %}
<!-- Blog Content -->
<div class="prose lg:prose-lg max-w-none">
<!-- Content -->
<article class="prose prose-invert max-w-none leading-relaxed">
{{ blogpost.content | safe }}
</div>
</article>
<!-- Back Button -->
<div class="pt-10 text-center">
<a href="{{ url_for('blog') }}"
class="inline-block bg-orange-600 text-white px-6 py-2 rounded hover:bg-orange-700 transition">
← Back to Blog
</a>
<div class="pt-2">
<a href="{{ url_for('blog') }}" class="btn btn-ghost">← Back to Blog</a>
</div>
</div>
</section>
{% endblock %}