Samir Boulahtit
e21abd4c32
- Add SEC-034 noqa comments to HTTP/HTTPS validation code
- Add SEC-041 noqa to MD5 hash used for cache keys (not crypto)
- Add {# sanitized #} comments to templates using |safe filter
- Fix validator regex to detect sanitized comments after Jinja closing tags
- Add vendor/** to ignore list for third-party libraries
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
247 lines
7.3 KiB
HTML
247 lines
7.3 KiB
HTML
{# app/templates/platform/content-page.html #}
|
|
{# Generic template for platform content pages (About, FAQ, Terms, Contact, etc.) #}
|
|
{% extends "platform/base.html" %}
|
|
|
|
{% block title %}{{ page.title }} - Marketplace{% endblock %}
|
|
|
|
{% block meta_description %}
|
|
{% if page.meta_description %}
|
|
{{ page.meta_description }}
|
|
{% else %}
|
|
{{ page.title }} - Multi-Vendor Marketplace Platform
|
|
{% endif %}
|
|
{% endblock %}
|
|
|
|
{% block meta_keywords %}
|
|
{% if page.meta_keywords %}
|
|
{{ page.meta_keywords }}
|
|
{% else %}
|
|
{{ page.title }}, marketplace, platform
|
|
{% endif %}
|
|
{% endblock %}
|
|
|
|
{% block content %}
|
|
<div class="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8 py-12">
|
|
|
|
{# Breadcrumbs #}
|
|
<nav class="flex mb-8 text-sm" aria-label="Breadcrumb">
|
|
<ol class="inline-flex items-center space-x-2">
|
|
<li class="inline-flex items-center">
|
|
<a href="/" class="text-gray-600 dark:text-gray-400 hover:text-primary dark:hover:text-primary transition-colors">
|
|
<svg class="w-4 h-4 mr-2" fill="currentColor" viewBox="0 0 20 20">
|
|
<path d="M10.707 2.293a1 1 0 00-1.414 0l-7 7a1 1 0 001.414 1.414L4 10.414V17a1 1 0 001 1h2a1 1 0 001-1v-2a1 1 0 011-1h2a1 1 0 011 1v2a1 1 0 001 1h2a1 1 0 001-1v-6.586l.293.293a1 1 0 001.414-1.414l-7-7z"></path>
|
|
</svg>
|
|
Home
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<div class="flex items-center">
|
|
<svg class="w-4 h-4 text-gray-400 mx-2" fill="currentColor" viewBox="0 0 20 20">
|
|
<path fill-rule="evenodd" d="M7.293 14.707a1 1 0 010-1.414L10.586 10 7.293 6.707a1 1 0 011.414-1.414l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414 0z" clip-rule="evenodd"></path>
|
|
</svg>
|
|
<span class="text-gray-700 dark:text-gray-300 font-medium">{{ page.title }}</span>
|
|
</div>
|
|
</li>
|
|
</ol>
|
|
</nav>
|
|
|
|
{# Page Header #}
|
|
<div class="mb-12">
|
|
<h1 class="text-4xl md:text-5xl font-bold text-gray-900 dark:text-white mb-4">
|
|
{{ page.title }}
|
|
</h1>
|
|
|
|
{# Published date (if available) #}
|
|
{% if page.published_at %}
|
|
<div class="flex items-center text-sm text-gray-600 dark:text-gray-400">
|
|
<svg class="w-4 h-4 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8 7V3m8 4V3m-9 8h10M5 21h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v12a2 2 0 002 2z"></path>
|
|
</svg>
|
|
<span>Published {{ page.published_at.strftime('%B %d, %Y') }}</span>
|
|
</div>
|
|
{% endif %}
|
|
</div>
|
|
|
|
{# Page Content #}
|
|
<div class="bg-white dark:bg-gray-800 rounded-2xl shadow-sm p-8 md:p-12">
|
|
<div class="prose prose-lg dark:prose-invert max-w-none">
|
|
{% if page.content_format == 'markdown' %}
|
|
{# Future enhancement: Render with markdown library #}
|
|
<div class="markdown-content">
|
|
{{ page.content | safe }}{# sanitized: CMS content #}
|
|
</div>
|
|
{% else %}
|
|
{# HTML content (default) #}
|
|
{{ page.content | safe }}{# sanitized: CMS content #}
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
|
|
{# Last updated timestamp #}
|
|
{% if page.updated_at %}
|
|
<div class="mt-8 pt-6 border-t border-gray-200 dark:border-gray-700 text-center">
|
|
<p class="text-sm text-gray-500 dark:text-gray-400">
|
|
Last updated: {{ page.updated_at.strftime('%B %d, %Y') }}
|
|
</p>
|
|
</div>
|
|
{% endif %}
|
|
|
|
{# Call-to-action section (for specific pages) #}
|
|
{% if page.slug in ['about', 'contact'] %}
|
|
<div class="mt-12 bg-gradient-to-r from-purple-50 to-pink-50 dark:from-purple-900/20 dark:to-pink-900/20 rounded-2xl p-8 text-center">
|
|
<h3 class="text-2xl font-bold text-gray-900 dark:text-white mb-4">
|
|
{% if page.slug == 'about' %}
|
|
Ready to Get Started?
|
|
{% elif page.slug == 'contact' %}
|
|
Have Questions?
|
|
{% endif %}
|
|
</h3>
|
|
<p class="text-gray-600 dark:text-gray-400 mb-6">
|
|
{% if page.slug == 'about' %}
|
|
Join thousands of vendors already selling on our platform
|
|
{% elif page.slug == 'contact' %}
|
|
Our team is here to help you succeed
|
|
{% endif %}
|
|
</p>
|
|
<a href="/contact" class="inline-block bg-gray-900 dark:bg-white text-white dark:text-gray-900 px-8 py-3 rounded-lg font-semibold hover:opacity-90 transition">
|
|
{% if page.slug == 'about' %}
|
|
Contact Sales
|
|
{% elif page.slug == 'contact' %}
|
|
Send Us a Message
|
|
{% endif %}
|
|
</a>
|
|
</div>
|
|
{% endif %}
|
|
|
|
</div>
|
|
|
|
{# Additional styling for prose content #}
|
|
<style>
|
|
/* Enhanced prose styling for content pages */
|
|
.prose {
|
|
color: inherit;
|
|
}
|
|
|
|
.prose h1, .prose h2, .prose h3, .prose h4, .prose h5, .prose h6 {
|
|
color: inherit;
|
|
font-weight: 700;
|
|
margin-top: 2em;
|
|
margin-bottom: 1em;
|
|
}
|
|
|
|
.prose h2 {
|
|
font-size: 1.875rem;
|
|
line-height: 2.25rem;
|
|
border-bottom: 2px solid var(--color-primary);
|
|
padding-bottom: 0.5rem;
|
|
}
|
|
|
|
.prose h3 {
|
|
font-size: 1.5rem;
|
|
line-height: 2rem;
|
|
}
|
|
|
|
.prose p {
|
|
margin-bottom: 1.5em;
|
|
line-height: 1.75;
|
|
}
|
|
|
|
.prose ul, .prose ol {
|
|
margin-bottom: 1.5em;
|
|
padding-left: 1.5em;
|
|
}
|
|
|
|
.prose li {
|
|
margin-bottom: 0.5em;
|
|
}
|
|
|
|
.prose a {
|
|
color: var(--color-primary);
|
|
text-decoration: underline;
|
|
font-weight: 500;
|
|
}
|
|
|
|
.prose a:hover {
|
|
opacity: 0.8;
|
|
}
|
|
|
|
.prose strong {
|
|
font-weight: 600;
|
|
color: inherit;
|
|
}
|
|
|
|
.prose code {
|
|
background-color: rgba(0, 0, 0, 0.05);
|
|
padding: 0.2em 0.4em;
|
|
border-radius: 0.25rem;
|
|
font-size: 0.9em;
|
|
}
|
|
|
|
.dark .prose code {
|
|
background-color: rgba(255, 255, 255, 0.1);
|
|
}
|
|
|
|
.prose pre {
|
|
background-color: rgba(0, 0, 0, 0.05);
|
|
padding: 1em;
|
|
border-radius: 0.5rem;
|
|
overflow-x: auto;
|
|
margin-bottom: 1.5em;
|
|
}
|
|
|
|
.dark .prose pre {
|
|
background-color: rgba(255, 255, 255, 0.05);
|
|
}
|
|
|
|
.prose blockquote {
|
|
border-left: 4px solid var(--color-primary);
|
|
padding-left: 1em;
|
|
font-style: italic;
|
|
opacity: 0.9;
|
|
margin: 1.5em 0;
|
|
}
|
|
|
|
.prose table {
|
|
width: 100%;
|
|
border-collapse: collapse;
|
|
margin-bottom: 1.5em;
|
|
}
|
|
|
|
.prose th, .prose td {
|
|
border: 1px solid rgba(0, 0, 0, 0.1);
|
|
padding: 0.75em;
|
|
text-align: left;
|
|
}
|
|
|
|
.dark .prose th, .dark .prose td {
|
|
border-color: rgba(255, 255, 255, 0.1);
|
|
}
|
|
|
|
.prose th {
|
|
background-color: rgba(0, 0, 0, 0.05);
|
|
font-weight: 600;
|
|
}
|
|
|
|
.dark .prose th {
|
|
background-color: rgba(255, 255, 255, 0.05);
|
|
}
|
|
|
|
.prose hr {
|
|
border: 0;
|
|
border-top: 2px solid rgba(0, 0, 0, 0.1);
|
|
margin: 3em 0;
|
|
}
|
|
|
|
.dark .prose hr {
|
|
border-top-color: rgba(255, 255, 255, 0.1);
|
|
}
|
|
|
|
.prose img {
|
|
border-radius: 0.5rem;
|
|
margin: 2em auto;
|
|
max-width: 100%;
|
|
height: auto;
|
|
}
|
|
</style>
|
|
{% endblock %}
|