|
{% extends "base.html" %}
|
|
{% block extra_head %}
|
|
<link rel="stylesheet" href="/static/css/projects.css">
|
|
<link rel="stylesheet" href="/static/css/post.css">
|
|
<style>
|
|
.project-detail-page {
|
|
max-width: 720px;
|
|
margin: 0 auto;
|
|
}
|
|
.project-detail {
|
|
background: var(--bg-card);
|
|
border: 1px solid var(--border);
|
|
border-radius: var(--radius-lg);
|
|
padding: 1.5rem;
|
|
}
|
|
.project-detail-header {
|
|
display: flex;
|
|
align-items: flex-start;
|
|
justify-content: space-between;
|
|
margin-bottom: 1rem;
|
|
}
|
|
.project-detail-title {
|
|
font-size: 1.5rem;
|
|
font-weight: 700;
|
|
}
|
|
.project-detail-meta {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
gap: 0.75rem;
|
|
margin-bottom: 1rem;
|
|
font-size: 0.8125rem;
|
|
color: var(--text-muted);
|
|
}
|
|
.project-detail-meta span {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 0.25rem;
|
|
}
|
|
.project-detail-author {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 0.5rem;
|
|
margin-bottom: 1rem;
|
|
padding-bottom: 1rem;
|
|
border-bottom: 1px solid var(--border);
|
|
}
|
|
.project-detail-author a {
|
|
font-weight: 600;
|
|
font-size: 0.875rem;
|
|
color: var(--text-primary);
|
|
}
|
|
.project-detail-desc {
|
|
font-size: 0.9375rem;
|
|
color: var(--text-secondary);
|
|
line-height: 1.7;
|
|
margin-bottom: 1.5rem;
|
|
}
|
|
.project-detail-actions {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 0.5rem;
|
|
padding-top: 1rem;
|
|
border-top: 1px solid var(--border);
|
|
}
|
|
.project-star-btn {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
gap: 0.375rem;
|
|
padding: 0.375rem 0.75rem;
|
|
border-radius: var(--radius);
|
|
font-size: 0.8125rem;
|
|
font-weight: 500;
|
|
color: var(--text-muted);
|
|
background: none;
|
|
border: none;
|
|
cursor: pointer;
|
|
transition: all 0.2s;
|
|
}
|
|
.project-star-btn:hover {
|
|
background: var(--bg-card-hover);
|
|
color: var(--warning);
|
|
}
|
|
</style>
|
|
{% endblock %}
|
|
{% block content %}
|
|
<div class="project-detail-page">
|
|
<a href="/projects" class="back-link">← Back to Projects</a>
|
|
|
|
<article class="project-detail">
|
|
<div class="project-detail-header">
|
|
<h1 class="project-detail-title">{{ project['title'] }}</h1>
|
|
<div class="project-status {% if project.get('status') == 'Released' %}released{% else %}dev{% endif %}">
|
|
● {{ project.get('status', 'In Development') }}
|
|
</div>
|
|
</div>
|
|
|
|
<div class="project-detail-meta">
|
|
<span class="badge badge-type">{{ project.get('project_type', 'software').replace('_', ' ') }}</span>
|
|
{% if project.get('release_date') %}
|
|
<span>📅 Released: {{ project['release_date'] }}</span>
|
|
{% endif %}
|
|
{% if project.get('demo_date') %}
|
|
<span>🎭 Demo: {{ project['demo_date'] }}</span>
|
|
{% endif %}
|
|
</div>
|
|
|
|
<div class="project-detail-author">
|
|
{% set _size = 32 %}{% set _size_class = "sm" %}{% set _user = author %}{% include "_avatar_link.html" %}
|
|
<div>
|
|
<a href="/profile/{{ author['username'] if author else '#' }}">{{ author['username'] if author else 'Unknown' }}</a>
|
|
{% if author and author.get('role') %}
|
|
<span style="font-size: 0.75rem; color: var(--text-muted);">· {{ author['role'] }}</span>
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
|
|
<div class="project-detail-desc rendered-content" data-render>{{ project.get('description', '') }}</div>
|
|
|
|
{% if attachments %}
|
|
{% include "_attachment_display.html" %}
|
|
{% endif %}
|
|
|
|
{% if platforms %}
|
|
<div style="margin-bottom: 1.5rem;">
|
|
<h4 style="font-size: 0.75rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.1em; color: var(--text-muted); margin-bottom: 0.5rem;">Platforms</h4>
|
|
<div class="project-card-platforms">
|
|
{% for plat in platforms %}
|
|
<span class="platform-tag">{{ plat.strip() }}</span>
|
|
{% endfor %}
|
|
</div>
|
|
</div>
|
|
{% endif %}
|
|
|
|
<div class="project-detail-actions">
|
|
<button type="button" class="project-star-btn" data-share="/projects/{{ project['slug'] or project['uid'] }}">🔗 Share</button>
|
|
{% if user %}
|
|
<form method="POST" action="/votes/project/{{ project['uid'] }}" style="display:inline;">
|
|
<input type="hidden" name="value" value="1">
|
|
<button type="submit" class="project-star-btn">☆ <span class="vote-count-value" data-vote-count="{{ project['uid'] }}">{{ star_count }}</span></button>
|
|
</form>
|
|
{% endif %}
|
|
{% if is_owner %}
|
|
<form method="POST" action="/projects/delete/{{ project['slug'] or project['uid'] }}" style="display:inline;">
|
|
<button type="submit" class="project-star-btn" data-confirm="Delete this project?"><span class="icon">🗑️</span> Delete</button>
|
|
</form>
|
|
{% endif %}
|
|
</div>
|
|
</article>
|
|
|
|
{% with target_uid=project['uid'], target_type="project" %}
|
|
{% include "_comment_section.html" %}
|
|
{% endwith %}
|
|
</div>
|
|
{% endblock %}
|