fix: video pagination
This commit is contained in:
@@ -6,7 +6,11 @@
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<meta name="description" content="{% block meta_description %}Tecvico — Innovation, Advancement, Competition{% endblock %}" />
|
||||
<title>{% block title %}Tecvico{% endblock %} | Tecvico</title>
|
||||
{% if site_branding.website_icon %}
|
||||
<link rel="icon" href="{{ site_branding.website_icon.url }}" />
|
||||
{% else %}
|
||||
<link rel="icon" href="{% static 'images/tecvico/brand-logo.svg' %}" type="image/svg+xml" />
|
||||
{% endif %}
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||
<link href="https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;600;700;800&family=Ubuntu:wght@400;500;700&display=swap" rel="stylesheet" />
|
||||
|
||||
@@ -32,7 +32,11 @@
|
||||
{% endif %}
|
||||
</div>
|
||||
<div class="hero-visual fade-in">
|
||||
{% if site_branding.hero_logo %}
|
||||
<img src="{{ site_branding.hero_logo.url }}" alt="{{ site_branding.hero_logo_alt|default:'Tecvico showcase' }}" loading="eager" />
|
||||
{% else %}
|
||||
<img src="{% static 'images/tecvico/hero-image.svg' %}" alt="Tecvico showcase" loading="eager" />
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
@@ -1,6 +1,7 @@
|
||||
{% load static %}
|
||||
<img
|
||||
src="{% static 'images/tecvico/brand-logo.svg' %}"
|
||||
alt="Tecvico"
|
||||
src="{% if site_branding.icon %}{{ site_branding.icon.url }}{% else %}{% static 'images/tecvico/brand-logo.svg' %}{% endif %}"
|
||||
alt="{{ site_branding.icon_alt|default:'Tecvico' }}"
|
||||
class="brand-icon"
|
||||
{% if placement == "navbar" %}style="{{ site_branding.navbar_icon_style }}"{% elif placement == "footer" %}style="{{ site_branding.footer_icon_style }}"{% endif %}
|
||||
/>
|
||||
|
||||
@@ -4,7 +4,7 @@
|
||||
<div class="container footer-main-inner">
|
||||
<div class="footer-brand">
|
||||
<a href="{% url 'pages:home' %}" class="footer-logo" aria-label="Tecvico home">
|
||||
<img src="{% static 'images/tecvico/brand-logo.svg' %}" alt="Tecvico" class="brand-icon" />
|
||||
{% include "partials/_brand_icon.html" with placement="footer" %}
|
||||
</a>
|
||||
<p class="footer-tagline">
|
||||
Join us in a world of<br />
|
||||
|
||||
@@ -1,6 +1,12 @@
|
||||
{% if videos %}
|
||||
<section class="section product-videos-section" aria-label="Product videos">
|
||||
<section class="section product-videos-section" aria-label="Featured videos">
|
||||
<div class="container">
|
||||
{% if videos_archive_url %}
|
||||
<div class="video-preview-heading">
|
||||
<div><span class="section-badge">Video library</span><h2>Featured videos</h2></div>
|
||||
<span>{{ videos_total_count }} videos</span>
|
||||
</div>
|
||||
{% endif %}
|
||||
<div class="product-videos-list">
|
||||
{% for video in videos %}
|
||||
{% if video.has_video %}
|
||||
@@ -10,6 +16,11 @@
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
{% if videos_archive_url %}
|
||||
<div class="video-preview-more">
|
||||
<a href="{{ videos_archive_url }}" class="btn-ghost">More videos <span aria-hidden="true">→</span></a>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
</section>
|
||||
{% endif %}
|
||||
|
||||
@@ -0,0 +1,56 @@
|
||||
{% extends "base.html" %}
|
||||
|
||||
{% block title %}{{ library_title }}{% endblock %}
|
||||
{% block meta_description %}Browse {{ library_title|lower }} from Tecvico.{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
<section class="page-hero video-library-hero" aria-labelledby="video-library-title">
|
||||
<div class="container">
|
||||
<div class="page-hero-content page-hero-content--row">
|
||||
<div>
|
||||
<div class="section-badge">Video library</div>
|
||||
<h1 class="page-hero-title" id="video-library-title">{{ library_title }}</h1>
|
||||
<p class="page-hero-subtitle">{{ library_description }}</p>
|
||||
</div>
|
||||
<a href="{{ library_back_url }}" class="btn-ghost">← {{ library_back_label }}</a>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="section video-library-section" aria-label="All videos">
|
||||
<div class="container">
|
||||
<div class="video-library-summary">
|
||||
<p><strong>{{ paginator.count }}</strong> video{{ paginator.count|pluralize }}</p>
|
||||
{% if paginator.num_pages > 1 %}<span>Page {{ page_obj.number }} of {{ paginator.num_pages }}</span>{% endif %}
|
||||
</div>
|
||||
|
||||
<div class="video-library-grid">
|
||||
{% for video in videos %}
|
||||
<article class="video-library-card">
|
||||
{% include "partials/_video_block.html" with video=video compact_header=True %}
|
||||
</article>
|
||||
{% empty %}
|
||||
<div class="glass-card portal-empty video-library-empty"><h2>No videos available</h2><p>New videos will appear here when they are published.</p></div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
|
||||
{% if page_obj.has_other_pages %}
|
||||
<nav class="video-pagination" aria-label="Video library pages">
|
||||
<a class="video-pagination__direction{% if not page_obj.has_previous %} is-disabled{% endif %}" {% if page_obj.has_previous %}href="?page={{ page_obj.previous_page_number }}"{% else %}aria-disabled="true" tabindex="-1"{% endif %}>← Previous</a>
|
||||
<ol class="video-pagination__pages">
|
||||
{% for page_number in pagination_range %}
|
||||
{% if page_number == "…" %}
|
||||
<li><span class="video-pagination__ellipsis">…</span></li>
|
||||
{% elif page_number == page_obj.number %}
|
||||
<li><span class="video-pagination__page is-current" aria-current="page">{{ page_number }}</span></li>
|
||||
{% else %}
|
||||
<li><a class="video-pagination__page" href="?page={{ page_number }}" aria-label="Go to page {{ page_number }}">{{ page_number }}</a></li>
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
</ol>
|
||||
<a class="video-pagination__direction{% if not page_obj.has_next %} is-disabled{% endif %}" {% if page_obj.has_next %}href="?page={{ page_obj.next_page_number }}"{% else %}aria-disabled="true" tabindex="-1"{% endif %}>Next →</a>
|
||||
</nav>
|
||||
{% endif %}
|
||||
</div>
|
||||
</section>
|
||||
{% endblock %}
|
||||
Reference in New Issue
Block a user