feat: pagination for videos and icon separating

This commit is contained in:
mohamad
2026-08-01 17:45:55 +03:30
parent 7cddc03a57
commit 04b6e9049e
15 changed files with 508 additions and 25 deletions
+5
View File
@@ -6,9 +6,14 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta name="description" content="{% block meta_description %}Radiuma — Advanced Medical Imaging & Radiomics Solutions{% endblock %}" />
<title>{% block title %}Radiuma{% endblock %} | Radiuma</title>
{% if site_branding.website_icon %}
<link rel="icon" href="{{ site_branding.website_icon.url }}" />
<link rel="apple-touch-icon" href="{{ site_branding.website_icon.url }}" />
{% else %}
<link rel="icon" href="{% static 'images/favicon-16.png' %}" type="image/png" sizes="16x16" />
<link rel="icon" href="{% static 'images/favicon-32.png' %}" type="image/png" sizes="32x32" />
<link rel="apple-touch-icon" href="{% static 'images/favicon-180.png' %}" sizes="180x180" />
{% 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=Inter:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
+4 -2
View File
@@ -35,10 +35,12 @@
{% endif %}
{% endif %}
</div>
{% if hero and hero.image or not hero %}
{% if site_branding.hero_logo or hero and hero.image or not hero %}
<div class="hero-app-preview fade-in">
<div class="hero-app-preview-glow" aria-hidden="true"></div>
{% if hero and hero.image %}
{% if site_branding.hero_logo %}
<img src="{{ site_branding.hero_logo.url }}" alt="{{ site_branding.hero_logo_alt|default:'Radiuma' }}" loading="eager" />
{% elif hero and hero.image %}
<img src="{{ hero.image.url }}" alt="{{ hero.image_alt }}" loading="eager" />
{% elif not hero %}
<img src="{% static 'images/screenshot-1.jpg' %}" alt="Radiuma application — main workflow view" loading="eager" />
-4
View File
@@ -4,8 +4,6 @@
{% if site_branding.icon %}src="{{ site_branding.icon.url }}"{% else %}src="{% static 'images/favicon-180.png' %}"{% endif %}
{% if site_branding.icon_alt %}alt="{{ site_branding.icon_alt }}"{% else %}alt="" aria-hidden="true"{% endif %}
class="brand-icon"
width="{{ site_branding.footer_icon_size }}"
height="{{ site_branding.footer_icon_size }}"
style="{{ site_branding.footer_icon_style }}"
/>
{% else %}
@@ -13,8 +11,6 @@
{% if site_branding.icon %}src="{{ site_branding.icon.url }}"{% else %}src="{% static 'images/favicon-180.png' %}"{% endif %}
{% if site_branding.icon_alt %}alt="{{ site_branding.icon_alt }}"{% else %}alt="" aria-hidden="true"{% endif %}
class="brand-icon"
width="{{ site_branding.navbar_icon_size }}"
height="{{ site_branding.navbar_icon_size }}"
style="{{ site_branding.navbar_icon_style }}"
/>
{% endif %}
+12 -1
View File
@@ -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 %}
+56
View File
@@ -0,0 +1,56 @@
{% extends "base.html" %}
{% block title %}{{ library_title }}{% endblock %}
{% block meta_description %}Browse {{ library_title|lower }} from Radiuma.{% 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 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 %}