support articles
This commit is contained in:
@@ -203,7 +203,7 @@
|
||||
</div>
|
||||
<h4 class="fw-bold mb-3">Getting Started</h4>
|
||||
<p class="text-muted mb-4">Learn the basics of DocuPulse and set up your workspace</p>
|
||||
<a href="#getting-started" class="btn btn-outline-primary">View Articles</a>
|
||||
<a href="{{ url_for('public.help_articles', category='getting-started') }}" class="btn btn-outline-primary">View Articles</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-lg-4 col-md-6">
|
||||
@@ -213,7 +213,7 @@
|
||||
</div>
|
||||
<h4 class="fw-bold mb-3">User Management</h4>
|
||||
<p class="text-muted mb-4">Manage users, permissions, and team collaboration</p>
|
||||
<a href="#user-management" class="btn btn-outline-primary">View Articles</a>
|
||||
<a href="{{ url_for('public.help_articles', category='user-management') }}" class="btn btn-outline-primary">View Articles</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-lg-4 col-md-6">
|
||||
@@ -223,7 +223,7 @@
|
||||
</div>
|
||||
<h4 class="fw-bold mb-3">File Management</h4>
|
||||
<p class="text-muted mb-4">Upload, organize, and manage your documents</p>
|
||||
<a href="#file-management" class="btn btn-outline-primary">View Articles</a>
|
||||
<a href="{{ url_for('public.help_articles', category='file-management') }}" class="btn btn-outline-primary">View Articles</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-lg-4 col-md-6">
|
||||
@@ -233,7 +233,7 @@
|
||||
</div>
|
||||
<h4 class="fw-bold mb-3">Communication</h4>
|
||||
<p class="text-muted mb-4">Use messaging and collaboration features</p>
|
||||
<a href="#communication" class="btn btn-outline-primary">View Articles</a>
|
||||
<a href="{{ url_for('public.help_articles', category='communication') }}" class="btn btn-outline-primary">View Articles</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-lg-4 col-md-6">
|
||||
@@ -243,7 +243,7 @@
|
||||
</div>
|
||||
<h4 class="fw-bold mb-3">Security & Privacy</h4>
|
||||
<p class="text-muted mb-4">Learn about security features and data protection</p>
|
||||
<a href="#security" class="btn btn-outline-primary">View Articles</a>
|
||||
<a href="{{ url_for('public.help_articles', category='security') }}" class="btn btn-outline-primary">View Articles</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-lg-4 col-md-6">
|
||||
@@ -253,7 +253,7 @@
|
||||
</div>
|
||||
<h4 class="fw-bold mb-3">Administration</h4>
|
||||
<p class="text-muted mb-4">Configure settings and manage your organization</p>
|
||||
<a href="#administration" class="btn btn-outline-primary">View Articles</a>
|
||||
<a href="{{ url_for('public.help_articles', category='administration') }}" class="btn btn-outline-primary">View Articles</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -296,7 +296,7 @@
|
||||
</button>
|
||||
<div id="faq3" class="collapse" data-bs-parent="#faqAccordion">
|
||||
<div class="faq-answer">
|
||||
DocuPulse supports a wide range of file types including documents (PDF, DOCX, DOC, TXT, RTF), spreadsheets (XLSX, XLS, ODS), presentations (PPTX, PPT), images (JPG, PNG, GIF, SVG), archives (ZIP, RAR, 7Z), code files (PY, JS, HTML, CSS), audio/video files, and CAD/design files. Individual files can be up to 10MB, and the platform includes storage limits that can be configured by administrators.
|
||||
DocuPulse supports a wide range of file types including documents (PDF, DOCX, DOC, TXT, RTF), spreadsheets (XLSX, XLS, ODS), presentations (PPTX, PPT), images (JPG, PNG, GIF, SVG), archives (ZIP, RAR, 7Z), code files (PY, JS, HTML, CSS), audio/video files, and CAD/design files.
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
294
templates/public/help_articles.html
Normal file
294
templates/public/help_articles.html
Normal file
@@ -0,0 +1,294 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>{% if category_name %}{{ category_name }} - {% endif %}Help Articles - DocuPulse</title>
|
||||
<meta name="description" content="Browse help articles and documentation for DocuPulse organized by category.">
|
||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css">
|
||||
<link rel="stylesheet" href="{{ url_for('static', filename='css/colors.css') }}?v={{ 'css/colors.css'|asset_version }}">
|
||||
<style>
|
||||
.category-nav {
|
||||
background: var(--white);
|
||||
border-radius: 15px;
|
||||
padding: 20px;
|
||||
box-shadow: 0 5px 15px var(--shadow-color);
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
|
||||
.category-link {
|
||||
display: block;
|
||||
padding: 12px 20px;
|
||||
margin: 5px 0;
|
||||
border-radius: 10px;
|
||||
text-decoration: none;
|
||||
color: var(--text-dark);
|
||||
transition: all 0.3s ease;
|
||||
border: 2px solid transparent;
|
||||
}
|
||||
|
||||
.category-link:hover {
|
||||
background-color: var(--bg-color);
|
||||
color: var(--primary-color);
|
||||
transform: translateX(5px);
|
||||
}
|
||||
|
||||
.category-link.active {
|
||||
background-color: var(--primary-color);
|
||||
color: var(--white);
|
||||
border-color: var(--primary-color);
|
||||
}
|
||||
|
||||
.article-card {
|
||||
background: var(--white);
|
||||
border-radius: 15px;
|
||||
padding: 30px;
|
||||
box-shadow: 0 5px 15px var(--shadow-color);
|
||||
margin-bottom: 25px;
|
||||
border: none;
|
||||
transition: transform 0.3s ease;
|
||||
}
|
||||
|
||||
.article-card:hover {
|
||||
transform: translateY(-2px);
|
||||
}
|
||||
|
||||
.article-title {
|
||||
color: var(--primary-color);
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
.article-content {
|
||||
line-height: 1.7;
|
||||
color: var(--text-dark);
|
||||
}
|
||||
|
||||
.article-content h1, .article-content h2, .article-content h3,
|
||||
.article-content h4, .article-content h5, .article-content h6 {
|
||||
color: var(--primary-color);
|
||||
margin-top: 25px;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
.article-content p {
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
.article-content ul, .article-content ol {
|
||||
margin-bottom: 15px;
|
||||
padding-left: 20px;
|
||||
}
|
||||
|
||||
.article-content li {
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
.article-content code {
|
||||
background-color: var(--bg-color);
|
||||
padding: 2px 6px;
|
||||
border-radius: 4px;
|
||||
font-family: 'Courier New', monospace;
|
||||
}
|
||||
|
||||
.article-content pre {
|
||||
background-color: var(--bg-color);
|
||||
padding: 15px;
|
||||
border-radius: 8px;
|
||||
overflow-x: auto;
|
||||
margin: 15px 0;
|
||||
}
|
||||
|
||||
.article-content blockquote {
|
||||
border-left: 4px solid var(--primary-color);
|
||||
padding-left: 20px;
|
||||
margin: 20px 0;
|
||||
font-style: italic;
|
||||
color: var(--text-muted);
|
||||
}
|
||||
|
||||
.article-content table {
|
||||
width: 100%;
|
||||
border-collapse: collapse;
|
||||
margin: 20px 0;
|
||||
}
|
||||
|
||||
.article-content th, .article-content td {
|
||||
border: 1px solid var(--border-color);
|
||||
padding: 10px;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.article-content th {
|
||||
background-color: var(--bg-color);
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.breadcrumb-nav {
|
||||
background: var(--white);
|
||||
border-radius: 10px;
|
||||
padding: 15px 20px;
|
||||
margin-bottom: 30px;
|
||||
box-shadow: 0 2px 8px var(--shadow-color);
|
||||
}
|
||||
|
||||
.breadcrumb-item a {
|
||||
color: var(--primary-color);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.breadcrumb-item.active {
|
||||
color: var(--text-muted);
|
||||
}
|
||||
|
||||
.empty-state {
|
||||
text-align: center;
|
||||
padding: 60px 20px;
|
||||
}
|
||||
|
||||
.empty-state i {
|
||||
font-size: 4rem;
|
||||
color: var(--text-muted);
|
||||
opacity: 0.5;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.btn-primary {
|
||||
background: linear-gradient(135deg, var(--primary-color) 0%, var(--secondary-color) 100%);
|
||||
border: none;
|
||||
border-radius: 25px;
|
||||
padding: 12px 30px;
|
||||
font-weight: 600;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
.btn-primary:hover {
|
||||
background: linear-gradient(135deg, var(--primary-color) 0%, var(--secondary-color) 100%);
|
||||
transform: translateY(-2px);
|
||||
box-shadow: 0 5px 15px var(--primary-opacity-15);
|
||||
filter: brightness(1.1);
|
||||
}
|
||||
.btn-outline-primary {
|
||||
border: 2px solid var(--primary-color);
|
||||
color: var(--primary-color);
|
||||
border-radius: 25px;
|
||||
padding: 12px 30px;
|
||||
font-weight: 600;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
.btn-outline-primary:hover {
|
||||
background: rgba(var(--primary-color-rgb), 0.05);
|
||||
border-color: var(--primary-color);
|
||||
color: var(--primary-color);
|
||||
transform: translateY(-2px);
|
||||
box-shadow: 0 5px 15px rgba(var(--primary-color-rgb), 0.1);
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
{% include 'components/header_nav.html' %}
|
||||
|
||||
<!-- Breadcrumb Navigation -->
|
||||
<div class="container mt-4">
|
||||
<nav aria-label="breadcrumb">
|
||||
<ol class="breadcrumb breadcrumb-nav">
|
||||
<li class="breadcrumb-item"><a href="{{ url_for('public.help_center') }}">Help Center</a></li>
|
||||
<li class="breadcrumb-item active" aria-current="page">
|
||||
{% if category_name %}{{ category_name }}{% else %}All Articles{% endif %}
|
||||
</li>
|
||||
</ol>
|
||||
</nav>
|
||||
</div>
|
||||
|
||||
<!-- Main Content -->
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<!-- Category Navigation -->
|
||||
<div class="col-lg-3">
|
||||
<div class="category-nav">
|
||||
<h5 class="mb-3" style="color: var(--primary-color);">
|
||||
<i class="fas fa-folder me-2"></i>Categories
|
||||
</h5>
|
||||
<a href="{{ url_for('public.help_articles') }}"
|
||||
class="category-link {% if not current_category %}active{% endif %}">
|
||||
<i class="fas fa-th-large me-2"></i>All Articles
|
||||
</a>
|
||||
{% for category_key, category_name in categories.items() %}
|
||||
<a href="{{ url_for('public.help_articles', category=category_key) }}"
|
||||
class="category-link {% if current_category == category_key %}active{% endif %}">
|
||||
<i class="fas fa-{{ 'rocket' if category_key == 'getting-started' else 'users' if category_key == 'user-management' else 'folder' if category_key == 'file-management' else 'comments' if category_key == 'communication' else 'shield-alt' if category_key == 'security' else 'cog' }} me-2"></i>
|
||||
{{ category_name }}
|
||||
{% if all_articles.get(category_key) %}
|
||||
<span class="badge bg-secondary float-end">{{ all_articles[category_key]|length }}</span>
|
||||
{% endif %}
|
||||
</a>
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Articles Content -->
|
||||
<div class="col-lg-9">
|
||||
{% if category_name %}
|
||||
<div class="d-flex justify-content-between align-items-center mb-4">
|
||||
<h1 class="h2 mb-0" style="color: var(--primary-color);">
|
||||
<i class="fas fa-{{ 'rocket' if current_category == 'getting-started' else 'users' if current_category == 'user-management' else 'folder' if current_category == 'file-management' else 'comments' if current_category == 'communication' else 'shield-alt' if current_category == 'security' else 'cog' }} me-2"></i>
|
||||
{{ category_name }}
|
||||
</h1>
|
||||
<a href="{{ url_for('public.help_center') }}" class="btn btn-outline-primary">
|
||||
<i class="fas fa-arrow-left me-2"></i>Back to Help Center
|
||||
</a>
|
||||
</div>
|
||||
{% else %}
|
||||
<div class="d-flex justify-content-between align-items-center mb-4">
|
||||
<h1 class="h2 mb-0" style="color: var(--primary-color);">
|
||||
<i class="fas fa-book me-2"></i>All Help Articles
|
||||
</h1>
|
||||
<a href="{{ url_for('public.help_center') }}" class="btn btn-outline-primary">
|
||||
<i class="fas fa-arrow-left me-2"></i>Back to Help Center
|
||||
</a>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% if articles %}
|
||||
{% for article in articles %}
|
||||
<div class="article-card">
|
||||
<h2 class="article-title">{{ article.title }}</h2>
|
||||
<div class="article-content">
|
||||
{{ article.body|safe }}
|
||||
</div>
|
||||
<hr class="my-4">
|
||||
<div class="d-flex justify-content-between align-items-center">
|
||||
<small class="text-muted">
|
||||
<i class="fas fa-calendar me-1"></i>
|
||||
Updated: {{ article.updated_at.strftime('%B %d, %Y') if article.updated_at else article.created_at.strftime('%B %d, %Y') }}
|
||||
</small>
|
||||
<span class="badge" style="background-color: var(--primary-color);">
|
||||
{{ categories[article.category] }}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
{% endfor %}
|
||||
{% else %}
|
||||
<div class="empty-state">
|
||||
<i class="fas fa-file-alt"></i>
|
||||
<h3 class="text-muted">No Articles Found</h3>
|
||||
<p class="text-muted">
|
||||
{% if current_category %}
|
||||
No articles are available in the "{{ category_name }}" category yet.
|
||||
{% else %}
|
||||
No help articles are available yet.
|
||||
{% endif %}
|
||||
</p>
|
||||
<a href="{{ url_for('public.help_center') }}" class="btn btn-primary">
|
||||
<i class="fas fa-arrow-left me-2"></i>Back to Help Center
|
||||
</a>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{% include 'components/footer_nav.html' %}
|
||||
|
||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user