90 lines
3.9 KiB
HTML
90 lines
3.9 KiB
HTML
{% extends 'base.html' %}
|
|
{% load static %}
|
|
|
|
{% block title %}Browse - Packs Site{% endblock %}
|
|
|
|
{% block content %}
|
|
<div class="browse-header">
|
|
<h1><i class="fas fa-compass"></i> Browse</h1>
|
|
<form method="get" action="{% url 'library:browse' %}" class="browse-search-form">
|
|
<div class="browse-search-row">
|
|
<input type="text" name="q" value="{{ q }}" placeholder="Search packs, tags…" class="browse-search-input">
|
|
<button type="submit" class="btn btn-primary"><i class="fas fa-search"></i></button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
|
|
<div class="browse-layout">
|
|
<aside class="browse-filters">
|
|
<div class="card filter-card">
|
|
<h3>Category</h3>
|
|
<div class="filter-category">
|
|
{% for value, label, url in category_menu %}
|
|
<a href="{{ url }}" class="filter-link {% if category == value %}active{% endif %}">{{ label }}</a>
|
|
{% endfor %}
|
|
</div>
|
|
</div>
|
|
|
|
{% for group in tag_groups %}
|
|
<div class="card filter-card">
|
|
<h3>
|
|
<span class="tag-dot" style="background: {{ group.category.color }};"></span>
|
|
{{ group.category.name }}
|
|
</h3>
|
|
<div class="filter-tags">
|
|
{% for item in group.items %}
|
|
<a href="{{ item.url }}" class="tag-chip filter-tag {% if item.active %}active{% endif %}"
|
|
style="border-color: {{ item.color }}; color: {{ item.color }};">
|
|
{{ item.name }} <span class="tag-count">{{ item.count }}</span>
|
|
</a>
|
|
{% endfor %}
|
|
</div>
|
|
</div>
|
|
{% empty %}
|
|
<div class="card filter-card">
|
|
<p class="filter-empty">No tags yet. Create a project to get started!</p>
|
|
</div>
|
|
{% endfor %}
|
|
</aside>
|
|
|
|
<div class="browse-main">
|
|
<div class="browse-toolbar">
|
|
<span class="browse-count">{{ projects.paginator.count }} project{{ projects.paginator.count|pluralize }}</span>
|
|
<form method="get" action="{% url 'library:browse' %}" class="browse-sort-form">
|
|
{% if q %}<input type="hidden" name="q" value="{{ q }}">{% endif %}
|
|
{% if category %}<input type="hidden" name="category" value="{{ category }}">{% endif %}
|
|
{% for t in active_tags %}<input type="hidden" name="tag" value="{{ t }}">{% endfor %}
|
|
<select name="sort" onchange="this.form.submit()">
|
|
<option value="recent" {% if sort == 'recent' %}selected{% endif %}>Newest</option>
|
|
<option value="downloads" {% if sort == 'downloads' %}selected{% endif %}>Most downloaded</option>
|
|
<option value="name" {% if sort == 'name' %}selected{% endif %}>Name A-Z</option>
|
|
</select>
|
|
</form>
|
|
</div>
|
|
|
|
<div class="pack-grid">
|
|
{% for project in projects %}
|
|
{% include 'library/_project_card.html' %}
|
|
{% empty %}
|
|
<div class="browse-empty">
|
|
<i class="fas fa-box-open"></i>
|
|
<p>No projects match your filters.</p>
|
|
</div>
|
|
{% endfor %}
|
|
</div>
|
|
|
|
{% if projects.paginator.num_pages > 1 %}
|
|
<div class="pagination">
|
|
{% if projects.has_previous %}
|
|
<a class="btn btn-secondary" href="?{{ query_string }}&page={{ projects.previous_page_number }}">Previous</a>
|
|
{% endif %}
|
|
<span class="page-info">Page {{ projects.number }} of {{ projects.paginator.num_pages }}</span>
|
|
{% if projects.has_next %}
|
|
<a class="btn btn-secondary" href="?{{ query_string }}&page={{ projects.next_page_number }}">Next</a>
|
|
{% endif %}
|
|
</div>
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
{% endblock %}
|