feat: changes for citation ad dynamic
This commit is contained in:
mohamad
+139
-163
@@ -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 & program at the University of British Columbia &
|
||||
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 %}
|
||||
|
||||
Reference in New Issue
Block a user