76 lines
4.0 KiB
HTML
76 lines
4.0 KiB
HTML
{% import "website/macros/chip.html" as chip %}
|
|
{% extends "website/base.html" %} {% block content %}
|
|
<div
|
|
class="flex flex-col items-center justify-center w-full gap-4 p-4 mt-16 prose text-white lg:prose-lg xl:prose-xl dark:prose-invert">
|
|
<h1>{{ project.name }}</h1>
|
|
<span class="mt-8"></span>
|
|
<section class="mx-auto prose lg:prose-lg xl:prose-xl dark:prose-invert">
|
|
{{ project.description| markdown | safe }}
|
|
</section>
|
|
<span class="mt-8"></span>
|
|
<section class="flex flex-col items-center justify-center w-full mx-auto">
|
|
<h1>Technologies</h1>
|
|
<div class="flex flex-wrap gap-2">
|
|
{% for technology in project.technologies %}
|
|
{{ chip::chip(text=technology) }}
|
|
{% endfor %}
|
|
</div>
|
|
</section>
|
|
<span class="mt-8"></span>
|
|
{% if project.thumbnails|length > 0 %}
|
|
<section class="flex flex-col items-center justify-center w-full mx-auto">
|
|
<h1>Gallery</h1>
|
|
<div class="flex flex-col gap-4">
|
|
{% for thumbnail in project.thumbnails %}
|
|
<img src="{{ thumbnail }}" alt="project thumbnail" class="mx-auto">
|
|
{% endfor %}
|
|
</div>
|
|
</section>
|
|
{% endif %}
|
|
<span class="mt-8"></span>
|
|
<section class="flex flex-col items-center justify-center w-full mx-auto">
|
|
{% if project.github_url == "" and project.visit_url == "" and project.download_url == "" %}
|
|
{% else %}
|
|
<h1>Links</h1>
|
|
<div class="flex flex-wrap gap-2">
|
|
{% if project.github_url %}
|
|
<a href="{{ project.github_url }}" target="_blank" rel="noopener noreferrer"
|
|
class="flex items-center justify-center w-full gap-1 p-2 text-center border border-yellow-400 jus rounded-xl hover:bg-yellow-400">
|
|
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor"
|
|
stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-github">
|
|
<path
|
|
d="M15 22v-4a4.8 4.8 0 0 0-1-3.5c3 0 6-2 6-5.5.08-1.25-.27-2.48-1-3.5.28-1.15.28-2.35 0-3.5 0 0-1 0-3 1.5-2.64-.5-5.36-.5-8 0C6 2 5 2 5 2c-.3 1.15-.3 2.35 0 3.5A5.403 5.403 0 0 0 4 9c0 3.5 3 5.5 6 5.5-.39.49-.68 1.05-.85 1.65-.17.6-.22 1.23-.15 1.85v4" />
|
|
<path d="M9 18c-4.51 2-5-2-7-2" />
|
|
</svg>
|
|
CODE
|
|
</a>
|
|
{% endif %}
|
|
{% if project.visit_url %}
|
|
<a href="{{ project.visit_url }}" target="_blank" rel="noopener noreferrer"
|
|
class="flex items-center justify-center w-full gap-1 p-2 text-center border border-yellow-400 rounded-xl hover:bg-yellow-400">
|
|
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor"
|
|
stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-eye">
|
|
<path
|
|
d="M2.062 12.348a1 1 0 0 1 0-.696 10.75 10.75 0 0 1 19.876 0 1 1 0 0 1 0 .696 10.75 10.75 0 0 1-19.876 0" />
|
|
<circle cx="12" cy="12" r="3" />
|
|
</svg>
|
|
LIVE
|
|
</a>
|
|
{% endif %}
|
|
{% if project.download_url %}
|
|
<a href="{{ project.download_url }}" target="_blank" rel="noopener noreferrer"
|
|
class="flex justify-center gap-1 p-2 text-center border border-yellow-400 items-centerw-full rounded-xl hover:bg-yellow-400">
|
|
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor"
|
|
stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-cloud-download">
|
|
<path d="M12 13v8l-4-4" />
|
|
<path d="m12 21 4-4" />
|
|
<path d="M4.393 15.269A7 7 0 1 1 15.71 8h1.79a4.5 4.5 0 0 1 2.436 8.284" />
|
|
</svg>
|
|
DOWNLOAD
|
|
</a>
|
|
{% endif %}
|
|
</div>
|
|
{% endif %}
|
|
</section>
|
|
</div>
|
|
{% endblock content %} |