HH/templates/surveys/analytics_report_markdown_view.html

135 lines
4.0 KiB
HTML

{% extends "layouts/base.html" %}
{% load i18n %}
{% block title %}{{ filename }} - {% trans "Survey Analytics Report" %} - PX360{% endblock %}
{% block extra_css %}
<style>
.markdown-body {
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif;
line-height: 1.6;
color: #24292e;
}
.markdown-body h1 {
font-size: 2em;
border-bottom: 1px solid #eaecef;
padding-bottom: 0.3em;
margin-bottom: 1em;
}
.markdown-body h2 {
font-size: 1.5em;
border-bottom: 1px solid #eaecef;
padding-bottom: 0.3em;
margin-top: 1.5em;
margin-bottom: 1em;
}
.markdown-body h3 {
font-size: 1.25em;
margin-top: 1.5em;
margin-bottom: 1em;
}
.markdown-body p {
margin-bottom: 1em;
}
.markdown-body ul, .markdown-body ol {
padding-left: 2em;
margin-bottom: 1em;
}
.markdown-body li {
margin-bottom: 0.25em;
}
.markdown-body code {
background-color: rgba(27, 31, 35, 0.05);
padding: 0.2em 0.4em;
border-radius: 3px;
font-family: 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, monospace;
font-size: 85%;
}
.markdown-body pre {
background-color: #f6f8fa;
padding: 16px;
border-radius: 6px;
overflow-x: auto;
margin-bottom: 1em;
}
.markdown-body pre code {
background-color: transparent;
padding: 0;
}
.markdown-body blockquote {
border-left: 4px solid #dfe2e5;
padding-left: 1em;
margin-left: 0;
color: #6a737d;
}
.markdown-body table {
border-collapse: collapse;
width: 100%;
margin-bottom: 1em;
}
.markdown-body th, .markdown-body td {
border: 1px solid #dfe2e5;
padding: 6px 13px;
text-align: left;
}
.markdown-body th {
background-color: #f6f8fa;
font-weight: 600;
}
.markdown-body tr:nth-child(2n) {
background-color: #f6f8fa;
}
.markdown-body a {
color: #0366d6;
text-decoration: none;
}
.markdown-body a:hover {
text-decoration: underline;
}
.markdown-body hr {
height: 0.25em;
padding: 0;
margin: 24px 0;
background-color: #e1e4e8;
border: 0;
}
</style>
{% endblock %}
{% block content %}
<div class="container-fluid px-4">
<div class="d-flex justify-content-between align-items-center mb-4">
<div>
<h1 class="h3 mb-0">{{ filename }}</h1>
<p class="text-muted mb-0">
{% trans "Type" %}: <span class="badge bg-warning text-dark">MARKDOWN</span> |
{% trans "Size" %}: {{ size_human }} |
{% trans "Created" %}: {{ created_date|date:"Y-m-d H:i:s" }}
</p>
</div>
<div>
<a href="{% url 'surveys:analytics_report_view_inline' filename %}" class="btn btn-success" target="_blank">
<i class="bi bi-eye me-2"></i>{% trans "View Raw" %}
</a>
<a href="{% url 'surveys:analytics_report_download' filename %}" class="btn btn-primary">
<i class="bi bi-download me-2"></i>{% trans "Download" %}
</a>
<a href="{% url 'surveys:analytics_reports' %}" class="btn btn-outline-secondary">
<i class="bi bi-arrow-left me-2"></i>{% trans "Back to Reports" %}
</a>
</div>
</div>
<div class="card border-0 shadow-sm">
<div class="card-header bg-white border-0">
<h5 class="mb-0">{% trans "Report Content" %}</h5>
</div>
<div class="card-body">
<div class="markdown-body">
<pre style="white-space: pre-wrap; word-wrap: break-word; font-family: inherit;"><code style="background: none; padding: 0;">{{ content }}</code></pre>
</div>
</div>
</div>
</div>
{% endblock %}