feat: changes for citation ad dynamic

This commit is contained in:
mohamad
2026-05-17 18:51:26 +03:30
parent f0a9d5832b
commit b8ab67049f
22 changed files with 1170 additions and 287 deletions
+88 -87
View File
@@ -1,11 +1,14 @@
{% extends "base.html" %}
{% load static %}
{% block title %}What is Radiuma{% endblock %}
{% block meta_description %}Learn about Radiuma and Radiuma — Visualized & Standardized Environment for Radiomics Analysis, developed at UBC and BC Cancer Research Institute.{% endblock %}
{% block title %}About{% endblock %}
{% block meta_description %}Learn about Radiuma — Visualized & Standardized Environment for Radiomics Analysis, developed at UBC and BC Cancer Research Institute.{% endblock %}
{% block content %}
{% for section in about_sections %}
{% if section.section_type == "hero" %}
<section class="page-hero" aria-labelledby="page-hero-heading">
<div class="page-hero-blobs" aria-hidden="true">
<div class="blob blob--1"></div>
@@ -15,125 +18,123 @@
</div>
<div class="container">
<div class="page-hero-content">
<div class="section-badge">About</div>
<h1 class="page-hero-title" id="page-hero-heading">What is Radiuma?</h1>
<p class="page-hero-subtitle">
Visualized &amp; Standardized Environment for Radiomics Analysis
</p>
{% if section.badge %}<div class="section-badge">{{ section.badge }}</div>{% endif %}
{% if section.title %}<h1 class="page-hero-title" id="page-hero-heading">{{ section.title }}</h1>{% endif %}
{% if section.subtitle %}<p class="page-hero-subtitle">{{ section.subtitle }}</p>{% endif %}
{% if section.content %}<div class="rich-content page-hero-body" data-readmore="160">{{ section.rendered_content }}</div>{% endif %}
</div>
</div>
</section>
<section class="section" aria-labelledby="about-intro-heading">
{% elif section.section_type == "intro" %}
<section class="section" aria-labelledby="about-intro-{{ section.pk }}-heading">
<div class="container">
<div class="about-intro glass-card fade-in">
<div class="about-intro-text">
<h2 id="about-intro-heading">Desktop Software for Medical Imaging Research</h2>
<ul class="about-list">
<li>Desktop software to improve usability, reusability, and reproducibility in medical imaging &amp; healthcare research.</li>
<li>Development platform to create reproducible research workflows by connecting different tools.</li>
<li>Useful for collaborative research projects and for ensuring consistency across different studies.</li>
<li>User-friendly for different expertise levels, including radiation oncologists, radiologists, physicists &amp; data scientists.</li>
</ul>
{% if section.title %}<h2 id="about-intro-{{ section.pk }}-heading">{{ section.title }}</h2>{% endif %}
{% if section.content %}
<div class="rich-content" data-readmore="200">{{ section.rendered_content }}</div>
{% endif %}
</div>
</div>
</div>
</section>
<section class="section" aria-labelledby="standardization-heading">
{% elif section.section_type == "grid" %}
<section class="section" aria-labelledby="grid-{{ section.pk }}-heading">
<div class="container">
{% if section.badge or section.title %}
<div class="section-header">
<div class="section-badge">Standards</div>
<h2 class="section-title" id="standardization-heading">Standardization</h2>
{% if section.badge %}<div class="section-badge">{{ section.badge }}</div>{% endif %}
{% if section.title %}<h2 class="section-title" id="grid-{{ section.pk }}-heading">{{ section.title }}</h2>{% endif %}
</div>
{% endif %}
{% if section.content %}<div class="rich-content" data-readmore="200">{{ section.rendered_content }}</div>{% endif %}
{% with items=section.items.all %}
{% if items %}
<div class="standards-grid">
{% for item in items %}
<div class="standard-card glass-card fade-in">
<div class="standard-badge">IBSI 1.0</div>
<h3 class="standard-title">Radiomic Feature Extraction</h3>
<p class="standard-desc">
Radiuma is a python-based open-source package that enables standardized and
reproducible radiomic feature extraction in compliance with the Image Biomarker
Standardization Initiative (IBSI 1.0).
</p>
</div>
<div class="standard-card glass-card fade-in">
<div class="standard-badge">IBSI 2.0</div>
<h3 class="standard-title">Image Filtering</h3>
<p class="standard-desc">
Image filters have been standardized against IBSI 2.0 by implementing and
validating several filter options, ensuring reproducibility across research
institutions worldwide.
</p>
</div>
<div class="standard-card glass-card fade-in">
<div class="standard-badge">Python</div>
<h3 class="standard-title">Open Source</h3>
<p class="standard-desc">
Radiuma is a major, entirely-revamped upgrade to the original SERA (Matlab-based),
now built on Python for broader accessibility and community contribution.
</p>
</div>
<div class="standard-card glass-card fade-in">
<div class="standard-badge">End-to-End</div>
<h3 class="standard-title">Standardized Workflows</h3>
<p class="standard-desc">
Radiuma employs a number of popular image processing algorithms to create
end-to-end standardized workflows for consistent, reproducible research results.
</p>
{% if item.badge %}<div class="standard-badge">{{ item.badge }}</div>{% endif %}
{% if item.title %}<h3 class="standard-title">{{ item.title }}</h3>{% endif %}
{% if item.content %}<p class="standard-desc" data-readmore="88">{{ item.content }}</p>{% endif %}
</div>
{% endfor %}
</div>
{% endif %}
{% endwith %}
</div>
</section>
<section class="section" aria-labelledby="screenshots-about-heading">
<div class="container">
<div class="section-header">
<div class="section-badge">Interface</div>
<h2 class="section-title" id="screenshots-about-heading">Radiuma in Action</h2>
</div>
<div class="about-screenshots-grid">
<div class="screenshot-item screenshot-item--featured fade-in">
<img src="{% static 'images/screenshot-11.jpg' %}" alt="Radiuma multi-modal viewer" loading="lazy" />
</div>
<div class="screenshot-item fade-in">
<img src="{% static 'images/screenshot-9.jpg' %}" alt="Radiuma settings panel" loading="lazy" />
</div>
<div class="screenshot-item fade-in">
<img src="{% static 'images/screenshot-10.jpg' %}" alt="Radiuma analysis results" loading="lazy" />
</div>
</div>
</div>
</section>
<section class="section" aria-labelledby="history-heading">
{% elif section.section_type == "history" %}
<section class="section" aria-labelledby="history-{{ section.pk }}-heading">
<div class="container">
<div class="history-block glass-card fade-in">
<div class="history-content">
<div class="section-badge">History</div>
<h2 id="history-heading">Our Origins</h2>
<p>
Radiuma has been developing since 2021 by the
Quantitative Radiomolecular Imaging and Therapy (Qurit) lab &amp; program at the
University of British Columbia &amp; BC Cancer Research Institute, Vancouver, BC, Canada.
</p>
<p>
Radiuma's mission is to bridge the gap between cutting-edge radiomics research and
practical clinical application by providing standardized, reproducible, and
user-friendly software tools.
</p>
{% if section.badge %}<div class="section-badge">{{ section.badge }}</div>{% endif %}
{% if section.title %}<h2 id="history-{{ section.pk }}-heading">{{ section.title }}</h2>{% endif %}
{% if section.content %}<div class="rich-content" data-readmore="200">{{ section.rendered_content }}</div>{% endif %}
{% with links=section.items.all %}
{% if links %}
<div class="history-links">
<a href="https://www.qurit.ca" class="btn-ghost" target="_blank" rel="noopener noreferrer">Qurit Lab</a>
<a href="https://www.ubc.ca" class="btn-ghost" target="_blank" rel="noopener noreferrer">UBC</a>
<a href="https://www.bccrc.ca" class="btn-ghost" target="_blank" rel="noopener noreferrer">BC Cancer</a>
{% for link in links %}
{% if link.url %}
<a href="{{ link.url }}" class="btn-ghost" target="_blank" rel="noopener noreferrer">{{ link.title }}</a>
{% endif %}
{% endfor %}
</div>
{% endif %}
{% endwith %}
</div>
<div class="history-visual" aria-hidden="true">
<div class="history-blob history-blob--1"></div>
<div class="history-blob history-blob--2"></div>
<div class="history-year">2021</div>
{% if section.subtitle %}<div class="history-year">{{ section.subtitle }}</div>{% endif %}
</div>
</div>
</div>
</section>
{% elif section.section_type == "custom" %}
<section class="section" aria-labelledby="custom-{{ section.pk }}-heading">
<div class="container">
{% if section.badge or section.title %}
<div class="section-header">
{% if section.badge %}<div class="section-badge">{{ section.badge }}</div>{% endif %}
{% if section.title %}<h2 class="section-title" id="custom-{{ section.pk }}-heading">{{ section.title }}</h2>{% endif %}
</div>
{% endif %}
{% if section.content %}
<div class="glass-card fade-in">
<div class="rich-content" style="padding: 2rem;" data-readmore="200">{{ section.rendered_content }}</div>
</div>
{% endif %}
{% with items=section.items.all %}
{% if items %}
<div class="standards-grid" style="margin-top: 1.5rem;">
{% for item in items %}
<div class="standard-card glass-card fade-in">
{% if item.badge %}<div class="standard-badge">{{ item.badge }}</div>{% endif %}
{% if item.title %}<h3 class="standard-title">{{ item.title }}</h3>{% endif %}
{% if item.content %}<p class="standard-desc" data-readmore="88">{{ item.content }}</p>{% endif %}
{% if item.url %}<a href="{{ item.url }}" class="btn-ghost btn--sm" style="margin-top: 0.75rem;" target="_blank" rel="noopener noreferrer">{{ item.title }}</a>{% endif %}
</div>
{% endfor %}
</div>
{% endif %}
{% endwith %}
</div>
</section>
{% endif %}
{% empty %}
<section class="section">
<div class="container">
<p style="color: var(--text-secondary); text-align: center; padding: 4rem 0;">
No content configured yet. Add sections in the admin panel.
</p>
</div>
</section>
{% endfor %}
{% endblock %}
+1 -1
View File
@@ -85,7 +85,7 @@
</div>
<h3 class="contact-card-title">Email Support</h3>
<p class="contact-card-desc">For direct software support:</p>
<a href="mailto:support@visera.ca" class="contact-email-link">support@visera.ca</a>
<a href="mailto:support@radiuma.ca" class="contact-email-link">support@radiuma.ca</a>
</div>
<div class="contact-card glass-card fade-in">
+139 -163
View File
@@ -42,181 +42,157 @@
</div>
</section>
<section class="section features-section" aria-labelledby="features-heading">
<div class="container">
<div class="section-header">
<div class="section-badge">Capabilities</div>
<h2 class="section-title" id="features-heading">Important Features</h2>
<p class="section-desc">
Comprehensive tools for medical imaging research, standardized and reproducible.
</p>
</div>
<div class="features-grid">
{% for feature in features %}
<div class="feature-card glass-card fade-in">
<div class="feature-icon" aria-hidden="true">{{ feature.icon }}</div>
<h3 class="feature-title">{{ feature.title }}</h3>
<p class="feature-desc">{{ feature.desc }}</p>
</div>
{% empty %}
<div class="feature-card glass-card fade-in">
<div class="feature-icon" aria-hidden="true">⚗️</div>
<h3 class="feature-title">Image Filtering</h3>
<p class="feature-desc">Standardized image filtering techniques compliant with IBSI 2.0 guidelines.</p>
</div>
<div class="feature-card glass-card fade-in">
<div class="feature-icon" aria-hidden="true">🖥️</div>
<h3 class="feature-title">Professional Viewer</h3>
<p class="feature-desc">Comfortable, professional medical image viewer with multi-modality support.</p>
</div>
<div class="feature-card glass-card fade-in">
<div class="feature-icon" aria-hidden="true">📊</div>
<h3 class="feature-title">Radiomics Features</h3>
<p class="feature-desc">Handcrafted radiomics feature generation standardized by IBSI 1.0.</p>
</div>
<div class="feature-card glass-card fade-in">
<div class="feature-icon" aria-hidden="true">🔄</div>
<h3 class="feature-title">Format Support</h3>
<p class="feature-desc">NIFTI, DICOM, NRRD, and more — comprehensive multi-format support.</p>
</div>
<div class="feature-card glass-card fade-in">
<div class="feature-icon" aria-hidden="true">🗂️</div>
<h3 class="feature-title">Image Registration</h3>
<p class="feature-desc">Advanced image registration, fusion, and standardized SUV conversion.</p>
</div>
<div class="feature-card glass-card fade-in">
<div class="feature-icon" aria-hidden="true">🔬</div>
<h3 class="feature-title">RT Struct Support</h3>
<p class="feature-desc">Full RT struct support for radiation oncology workflows and research.</p>
</div>
{% endfor %}
</div>
</div>
</section>
{% for section in homepage_sections %}
<section class="section screenshots-section" aria-labelledby="screenshots-heading">
<div class="container">
<div class="section-header">
<div class="section-badge">Gallery</div>
<h2 class="section-title" id="screenshots-heading">See Radiuma in Action</h2>
<p class="section-desc">
Explore Radiuma's powerful interface, workflow builder, and multi-modal image viewer.
</p>
</div>
<div class="screenshots-grid">
<div class="screenshot-item fade-in">
<img src="{% static 'images/screenshot-2.jpg' %}" alt="Radiuma full workflow interface" loading="lazy" />
{% if section.section_type == "features" %}
<section class="section features-section" aria-labelledby="features-heading-{{ section.pk }}">
<div class="container">
<div class="section-header">
{% if section.badge %}<div class="section-badge">{{ section.badge }}</div>{% endif %}
<h2 class="section-title" id="features-heading-{{ section.pk }}">{{ section.title }}</h2>
{% if section.description %}<p class="section-desc">{{ section.description }}</p>{% endif %}
</div>
<div class="screenshot-item fade-in">
<img src="{% static 'images/screenshot-3.png' %}" alt="Radiuma panel view" loading="lazy" />
</div>
<div class="screenshot-item fade-in">
<img src="{% static 'images/screenshot-5.png' %}" alt="Radiuma segmentation view" loading="lazy" />
</div>
<div class="screenshot-item fade-in">
<img src="{% static 'images/screenshot-8.jpg' %}" alt="Radiuma radiomics results" loading="lazy" />
</div>
</div>
</div>
</section>
{% if nav_main_products %}
<section class="section products-section" aria-labelledby="products-heading">
<div class="container">
<div class="section-header">
<div class="section-badge">Our Software</div>
<h2 class="section-title" id="products-heading">Products</h2>
<p class="section-desc">Explore our suite of medical imaging and radiomics tools.</p>
</div>
<div class="products-grid">
{% for product in nav_main_products %}
<a href="{{ product.get_absolute_url }}" class="product-card glass-card fade-in">
{% if product.image %}
<div class="product-card-image">
<img src="{{ product.image.url }}" alt="{{ product.name }}" loading="lazy" />
<div class="features-grid">
{% for item in section.items.all %}
<div class="feature-card glass-card fade-in">
{% if item.icon %}<div class="feature-icon" aria-hidden="true">{{ item.icon }}</div>{% endif %}
<h3 class="feature-title">{{ item.title }}</h3>
<p class="feature-desc" data-readmore="88">{{ item.content }}</p>
</div>
{% endif %}
<div class="product-card-body">
<h3 class="product-card-title">{{ product.name }}</h3>
<p class="product-card-desc">{{ product.short_description }}</p>
<span class="product-card-link">
Explore
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" aria-hidden="true">
<path d="M3 8H13M13 8L9 4M13 8L9 12" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
</span>
{% endfor %}
</div>
</div>
</section>
{% elif section.section_type == "screenshots" %}
<section class="section screenshots-section" aria-labelledby="screenshots-heading-{{ section.pk }}">
<div class="container">
<div class="section-header">
{% if section.badge %}<div class="section-badge">{{ section.badge }}</div>{% endif %}
<h2 class="section-title" id="screenshots-heading-{{ section.pk }}">{{ section.title }}</h2>
{% if section.description %}<p class="section-desc">{{ section.description }}</p>{% endif %}
</div>
<div class="screenshots-grid">
<div class="screenshot-item fade-in">
<img src="{% static 'images/screenshot-2.jpg' %}" alt="Radiuma full workflow interface" loading="lazy" />
</div>
</a>
{% endfor %}
<div class="screenshot-item fade-in">
<img src="{% static 'images/screenshot-3.png' %}" alt="Radiuma panel view" loading="lazy" />
</div>
<div class="screenshot-item fade-in">
<img src="{% static 'images/screenshot-5.png' %}" alt="Radiuma segmentation view" loading="lazy" />
</div>
<div class="screenshot-item fade-in">
<img src="{% static 'images/screenshot-8.jpg' %}" alt="Radiuma radiomics results" loading="lazy" />
</div>
</div>
</div>
</div>
</section>
{% endif %}
</section>
<section class="section problems-section" aria-labelledby="problems-heading">
<div class="container">
<div class="section-header">
<div class="section-badge">Value Proposition</div>
<h2 class="section-title" id="problems-heading">What Problems Does Radiuma Solve?</h2>
</div>
<div class="problems-grid">
<div class="problem-item glass-card fade-in">
<div class="problem-number" aria-hidden="true">01</div>
<h3 class="problem-title">Accessibility</h3>
<p class="problem-desc">
Radiuma provides a user-friendly interface and a wide range of tools, allowing
researchers to perform complex data analysis without extensive technical knowledge
or programming expertise.
</p>
{% elif section.section_type == "products" %}
{% if sub_products %}
<section class="section products-section" aria-labelledby="products-heading-{{ section.pk }}">
<div class="container">
<div class="section-header">
{% if section.badge %}<div class="section-badge">{{ section.badge }}</div>{% endif %}
<h2 class="section-title" id="products-heading-{{ section.pk }}">{{ section.title }}</h2>
{% if section.description %}<p class="section-desc">{{ section.description }}</p>{% endif %}
</div>
<div class="problem-item glass-card fade-in">
<div class="problem-number" aria-hidden="true">02</div>
<h3 class="problem-title">Integrated Tools</h3>
<p class="problem-desc">
Radiuma integrates a vast collection of tools and resources from various domains
of healthcare and medical imaging research in a common, unified environment.
</p>
</div>
<div class="problem-item glass-card fade-in">
<div class="problem-number" aria-hidden="true">03</div>
<h3 class="problem-title">Flexibility</h3>
<p class="problem-desc">
Radiuma offers flexibility in terms of tool optimization and workflow customization
to match your specific research requirements.
</p>
</div>
<div class="problem-item glass-card fade-in">
<div class="problem-number" aria-hidden="true">04</div>
<h3 class="problem-title">Reproducibility</h3>
<p class="problem-desc">
Improve usability, reusability, and reproducibility (URR) through a workflow
management system that allows researchers to easily create, share, and reuse
analysis pipelines.
</p>
<div class="products-grid">
{% for product in sub_products %}
<a href="{{ product.get_absolute_url }}" class="product-card glass-card fade-in">
{% if product.image %}
<div class="product-card-image">
<img src="{{ product.image.url }}" alt="{{ product.name }}" loading="lazy" />
</div>
{% endif %}
<div class="product-card-body">
{% if product.logo %}
<img src="{{ product.logo.url }}" alt="" class="product-card-logo" aria-hidden="true" loading="lazy" />
{% endif %}
<h3 class="product-card-title">{{ product.name }}</h3>
<p class="product-card-desc" data-readmore="88">{{ product.short_description }}</p>
<span class="product-card-link">
Explore
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" aria-hidden="true">
<path d="M3 8H13M13 8L9 4M13 8L9 12" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
</span>
</div>
</a>
{% endfor %}
</div>
</div>
</div>
</section>
</section>
{% endif %}
<section class="section about-strip" aria-labelledby="about-strip-heading">
<div class="container">
<div class="about-strip-inner glass-card">
<div class="about-strip-content">
<div class="section-badge">Our Story</div>
<h2 class="section-title" id="about-strip-heading">More to Know</h2>
<p class="about-strip-text">
Radiuma has been developing since 2021 by the Quantitative Radiomolecular Imaging
and Therapy (Qurit) lab &amp; program at the University of British Columbia &amp;
BC Cancer Research Institute, Vancouver, BC, Canada.
</p>
<a href="{% url 'pages:about' %}" class="btn-primary">Learn More</a>
{% elif section.section_type == "problems" %}
<section class="section problems-section" aria-labelledby="problems-heading-{{ section.pk }}">
<div class="container">
<div class="section-header">
{% if section.badge %}<div class="section-badge">{{ section.badge }}</div>{% endif %}
<h2 class="section-title" id="problems-heading-{{ section.pk }}">{{ section.title }}</h2>
{% if section.description %}<p class="section-desc">{{ section.description }}</p>{% endif %}
</div>
<div class="about-strip-blobs" aria-hidden="true">
<div class="strip-blob strip-blob--1"></div>
<div class="strip-blob strip-blob--2"></div>
<div class="problems-grid">
{% for item in section.items.all %}
<div class="problem-item glass-card fade-in">
{% if item.icon %}<div class="problem-number" aria-hidden="true">{{ item.icon }}</div>{% endif %}
<h3 class="problem-title">{{ item.title }}</h3>
<p class="problem-desc" data-readmore="88">{{ item.content }}</p>
</div>
{% endfor %}
</div>
</div>
</div>
</section>
</section>
{% elif section.section_type == "supporters" %}
<section class="section supporters-section" aria-labelledby="supporters-heading-{{ section.pk }}">
<div class="container">
<div class="section-header">
{% if section.badge %}<div class="section-badge">{{ section.badge }}</div>{% endif %}
<h2 class="section-title" id="supporters-heading-{{ section.pk }}">{{ section.title }}</h2>
{% if section.description %}<p class="section-desc">{{ section.description }}</p>{% endif %}
</div>
<div class="supporters-grid">
{% for item in section.items.all %}
<div class="supporter-card glass-card fade-in">
{% if item.image %}
<div class="supporter-logo">
<img src="{{ item.image.url }}" alt="{{ item.title }} logo" loading="lazy" />
</div>
{% endif %}
<div class="supporter-body">
<h3 class="supporter-name">{{ item.title }}</h3>
{% if item.content %}<p class="supporter-desc">{{ item.content }}</p>{% endif %}
</div>
</div>
{% endfor %}
</div>
</div>
</section>
{% elif section.section_type == "about_strip" %}
<section class="section about-strip" aria-labelledby="about-strip-heading-{{ section.pk }}">
<div class="container">
<div class="about-strip-inner glass-card">
<div class="about-strip-content">
{% if section.badge %}<div class="section-badge">{{ section.badge }}</div>{% endif %}
<h2 class="section-title" id="about-strip-heading-{{ section.pk }}">{{ section.title }}</h2>
{% if section.description %}<p class="about-strip-text">{{ section.description }}</p>{% endif %}
{% if section.link_text and section.link_url %}
<a href="{{ section.link_url }}" class="btn-primary">{{ section.link_text }}</a>
{% endif %}
</div>
<div class="about-strip-blobs" aria-hidden="true">
<div class="strip-blob strip-blob--1"></div>
<div class="strip-blob strip-blob--2"></div>
</div>
</div>
</div>
</section>
{% endif %}
{% endfor %}
{% endblock %}
+1 -1
View File
@@ -52,7 +52,7 @@
<p>675 West 10th Ave, Office 6-112</p>
<p>Vancouver, BC, V5Z 1L3</p>
</address>
<a href="mailto:support@visera.ca" class="footer-email">support@visera.ca</a>
<a href="mailto:support@radiuma.ca" class="footer-email">support@radiuma.ca</a>
</div>
</div>
+2 -2
View File
@@ -3,7 +3,7 @@
<div class="navbar-container">
<a href="{% url 'pages:home' %}" class="navbar-brand" aria-label="Radiuma home">
<span class="brand-icon">R</span>
<img src="{% static 'images/favicon-180.png' %}" alt="" class="brand-icon" width="34" height="34" aria-hidden="true" />
<span class="brand-name">Radiuma</span>
</a>
@@ -68,7 +68,7 @@
<li class="nav-item">
<a href="{% url 'pages:about' %}" class="nav-link {% if request.resolver_match.url_name == 'about' %}active{% endif %}">
What is Radiuma
About
</a>
</li>
+2 -2
View File
@@ -43,7 +43,7 @@
{% endif %}
</div>
<div class="product-detail-text">
<div class="product-detail-desc rich-content">{{ main_product.rendered_description }}</div>
<div class="product-detail-desc rich-content" data-readmore="220">{{ main_product.rendered_description }}</div>
</div>
</div>
</div>
@@ -71,7 +71,7 @@
{% endif %}
<div class="subproduct-card-body">
<h3 class="subproduct-card-title">{{ sub.name }}</h3>
<p class="subproduct-card-desc">{{ sub.short_description }}</p>
<p class="subproduct-card-desc" data-readmore="88">{{ sub.short_description }}</p>
<span class="subproduct-card-link">
Learn More
<svg width="14" height="14" viewBox="0 0 14 14" fill="none" aria-hidden="true">
+1 -1
View File
@@ -35,7 +35,7 @@
<div class="product-overview-body">
<h2 class="product-overview-title">{{ product.name }}</h2>
<p class="product-overview-short">{{ product.short_description }}</p>
<p class="product-overview-desc">{{ product.description }}</p>
<p class="product-overview-desc" data-readmore="110">{{ product.description }}</p>
<a href="{{ product.get_absolute_url }}" class="btn-primary">Explore {{ product.name }}</a>
</div>
{% with subs=product.sub_products.all %}
+36 -3
View File
@@ -44,7 +44,7 @@
<div class="sub-product-desc glass-card fade-in">
<h2>About {{ sub_product.name }}</h2>
<div class="rich-content">{{ sub_product.rendered_description }}</div>
<div class="rich-content" data-readmore="220">{{ sub_product.rendered_description }}</div>
</div>
{% if show_releases_section %}
@@ -154,20 +154,53 @@
<div class="articles-list">
{% for article in articles %}
<article class="article-card glass-card fade-in" aria-labelledby="article-{{ article.pk }}-title">
{% if article.badge %}<div class="article-card-header"><div class="section-badge article-badge">{{ article.badge }}</div></div>{% endif %}
<h3 class="article-title" id="article-{{ article.pk }}-title">{{ article.title }}</h3>
<div class="article-description rich-content">{{ article.rendered_description }}</div>
<div class="article-description rich-content" data-readmore="260">{{ article.rendered_description }}</div>
{% if article.sections.all %}
<div class="article-sections">
<dl class="article-sections-list">
{% for section in article.sections.all %}
<div class="article-section-item">
<dt class="section-key">{{ section.title }}</dt>
<dd class="section-value rich-content">{{ section.rendered_value }}</dd>
<dd class="section-value rich-content" data-readmore="160">{{ section.rendered_value }}</dd>
</div>
{% endfor %}
</dl>
</div>
{% endif %}
{% if article.citations.all %}
<div class="article-citations" id="article-{{ article.pk }}-citations">
<h4 class="article-citations-title">Citations</h4>
<ol class="article-citations-list">
{% for citation in article.citations.all %}
<li class="article-citation-item">
<span class="citation-text">{{ citation.text }}</span>
{% if citation.url %}
<a href="{{ citation.url }}" class="citation-link" target="_blank" rel="noopener noreferrer" aria-label="Open citation source">
<svg width="13" height="13" viewBox="0 0 16 16" fill="none" aria-hidden="true">
<path d="M7 3H3a1 1 0 00-1 1v9a1 1 0 001 1h9a1 1 0 001-1V9M10 2h4m0 0v4m0-4L7 9" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
</a>
{% endif %}
</li>
{% endfor %}
</ol>
</div>
{% endif %}
{% if article.citation_count_display is not None %}
{% if article.citations.exists %}
<a href="#article-{{ article.pk }}-citations" class="citation-count-badge" aria-label="{{ article.citation_count_display }} citation{{ article.citation_count_display|pluralize }}">
<span class="citation-count-number">{{ article.citation_count_display }}</span>
<span class="citation-count-label">cited</span>
</a>
{% else %}
<div class="citation-count-badge" aria-label="{{ article.citation_count_display }} citation{{ article.citation_count_display|pluralize }}">
<span class="citation-count-number">{{ article.citation_count_display }}</span>
<span class="citation-count-label">cited</span>
</div>
{% endif %}
{% endif %}
</article>
{% endfor %}
</div>