mirror of
https://github.com/MODSetter/SurfSense.git
synced 2026-04-25 16:56:22 +02:00
feat: expand report export functionality to support multiple formats (PDF, DOCX, HTML, EPUB, etc.) and enhance UI for format selection
This commit is contained in:
DESKTOP-RTLN3BA\$punk
parent
ddb070bca8
commit
11b84a3fb4
10 changed files with 5375 additions and 4302 deletions
289
surfsense_backend/app/templates/report_html.css
Normal file
289
surfsense_backend/app/templates/report_html.css
Normal file
|
|
@ -0,0 +1,289 @@
|
|||
/* SurfSense - Professional HTML Report Stylesheet */
|
||||
|
||||
:root {
|
||||
--accent: #2563eb;
|
||||
--heading: #1e293b;
|
||||
--muted: #64748b;
|
||||
--border: #e2e8f0;
|
||||
--subtle-bg: #f8fafc;
|
||||
--body-text: #334155;
|
||||
}
|
||||
|
||||
*,
|
||||
*::before,
|
||||
*::after {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
html {
|
||||
font-size: 16px;
|
||||
-webkit-text-size-adjust: 100%;
|
||||
}
|
||||
|
||||
body {
|
||||
max-width: 52rem;
|
||||
margin: 2rem auto;
|
||||
padding: 0 1.5rem;
|
||||
font-family: "Segoe UI", system-ui, -apple-system, BlinkMacSystemFont,
|
||||
"Helvetica Neue", Arial, sans-serif;
|
||||
font-size: 1rem;
|
||||
line-height: 1.7;
|
||||
color: var(--body-text);
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
/* Title block generated by pandoc --standalone with -M title */
|
||||
header#title-block-header {
|
||||
text-align: center;
|
||||
margin-bottom: 2.5rem;
|
||||
padding-bottom: 1.5rem;
|
||||
border-bottom: 1px solid var(--border);
|
||||
}
|
||||
|
||||
header#title-block-header h1.title {
|
||||
font-size: 2.25rem;
|
||||
font-weight: 700;
|
||||
color: var(--heading);
|
||||
margin: 0 0 0.25rem;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
header#title-block-header p.subtitle {
|
||||
font-size: 1.15rem;
|
||||
color: var(--muted);
|
||||
margin: 0.5rem 0 0;
|
||||
}
|
||||
|
||||
header#title-block-header p.date {
|
||||
font-size: 0.95rem;
|
||||
color: var(--muted);
|
||||
margin: 0.75rem 0 0;
|
||||
}
|
||||
|
||||
header#title-block-header p.author {
|
||||
font-size: 1rem;
|
||||
color: var(--body-text);
|
||||
margin: 0.25rem 0 0;
|
||||
}
|
||||
|
||||
/* Headings */
|
||||
h1, h2, h3, h4, h5, h6 {
|
||||
color: var(--heading);
|
||||
margin-top: 1.8em;
|
||||
margin-bottom: 0.6em;
|
||||
line-height: 1.3;
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size: 1.75rem;
|
||||
font-weight: 700;
|
||||
padding-bottom: 0.3em;
|
||||
border-bottom: 2px solid var(--accent);
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-size: 1.4rem;
|
||||
font-weight: 700;
|
||||
padding-bottom: 0.2em;
|
||||
border-bottom: 1px solid var(--border);
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-size: 1.15rem;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
h4 {
|
||||
font-size: 1rem;
|
||||
font-weight: 600;
|
||||
color: var(--muted);
|
||||
}
|
||||
|
||||
h5, h6 {
|
||||
font-size: 0.95rem;
|
||||
font-weight: 600;
|
||||
color: var(--muted);
|
||||
}
|
||||
|
||||
/* Paragraphs & text */
|
||||
p {
|
||||
margin: 0 0 1em;
|
||||
}
|
||||
|
||||
a {
|
||||
color: var(--accent);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
a:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
strong {
|
||||
font-weight: 600;
|
||||
color: var(--heading);
|
||||
}
|
||||
|
||||
/* Lists */
|
||||
ul, ol {
|
||||
margin: 0 0 1em;
|
||||
padding-left: 1.75em;
|
||||
}
|
||||
|
||||
li {
|
||||
margin-bottom: 0.3em;
|
||||
}
|
||||
|
||||
li > ul, li > ol {
|
||||
margin-top: 0.3em;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
/* Code */
|
||||
code {
|
||||
font-family: "Cascadia Code", "Fira Code", "JetBrains Mono", Consolas,
|
||||
"Courier New", monospace;
|
||||
font-size: 0.875em;
|
||||
background: var(--subtle-bg);
|
||||
border: 1px solid var(--border);
|
||||
border-radius: 4px;
|
||||
padding: 0.15em 0.4em;
|
||||
}
|
||||
|
||||
pre {
|
||||
background: var(--subtle-bg);
|
||||
border: 1px solid var(--border);
|
||||
border-radius: 6px;
|
||||
padding: 1em 1.25em;
|
||||
overflow-x: auto;
|
||||
margin: 0 0 1.25em;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
pre code {
|
||||
background: none;
|
||||
border: none;
|
||||
border-radius: 0;
|
||||
padding: 0;
|
||||
font-size: 0.85em;
|
||||
}
|
||||
|
||||
/* Tables */
|
||||
table {
|
||||
width: 100%;
|
||||
border-collapse: collapse;
|
||||
margin: 0 0 1.25em;
|
||||
font-size: 0.95em;
|
||||
}
|
||||
|
||||
thead th {
|
||||
text-align: left;
|
||||
font-weight: 600;
|
||||
color: var(--heading);
|
||||
padding: 0.6em 0.75em;
|
||||
border-bottom: 2px solid var(--heading);
|
||||
}
|
||||
|
||||
tbody td {
|
||||
padding: 0.5em 0.75em;
|
||||
border-bottom: 1px solid var(--border);
|
||||
}
|
||||
|
||||
tbody tr:last-child td {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
/* Block quotes */
|
||||
blockquote {
|
||||
margin: 0 0 1.25em;
|
||||
padding: 0.75em 1em;
|
||||
border-left: 4px solid var(--accent);
|
||||
background: var(--subtle-bg);
|
||||
color: var(--muted);
|
||||
border-radius: 0 4px 4px 0;
|
||||
}
|
||||
|
||||
blockquote p {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
blockquote p + p {
|
||||
margin-top: 0.5em;
|
||||
}
|
||||
|
||||
/* Horizontal rule */
|
||||
hr {
|
||||
border: none;
|
||||
border-top: 1px solid var(--border);
|
||||
margin: 2em 0;
|
||||
}
|
||||
|
||||
/* Images */
|
||||
img {
|
||||
max-width: 100%;
|
||||
height: auto;
|
||||
border-radius: 6px;
|
||||
}
|
||||
|
||||
figure {
|
||||
margin: 1.5em 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
figcaption {
|
||||
font-size: 0.875em;
|
||||
color: var(--muted);
|
||||
margin-top: 0.5em;
|
||||
}
|
||||
|
||||
/* Definition lists */
|
||||
dt {
|
||||
font-weight: 600;
|
||||
color: var(--heading);
|
||||
margin-top: 1em;
|
||||
}
|
||||
|
||||
dd {
|
||||
margin-left: 1.5em;
|
||||
margin-bottom: 0.5em;
|
||||
}
|
||||
|
||||
/* Footnotes */
|
||||
section.footnotes {
|
||||
margin-top: 2em;
|
||||
padding-top: 1em;
|
||||
border-top: 1px solid var(--border);
|
||||
font-size: 0.9em;
|
||||
color: var(--muted);
|
||||
}
|
||||
|
||||
/* Pandoc syntax highlighting (keep pandoc's generated highlight classes) */
|
||||
div.sourceCode {
|
||||
background: var(--subtle-bg);
|
||||
border: 1px solid var(--border);
|
||||
border-radius: 6px;
|
||||
margin: 0 0 1.25em;
|
||||
}
|
||||
|
||||
div.sourceCode pre {
|
||||
border: none;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
/* Print styles */
|
||||
@media print {
|
||||
body {
|
||||
max-width: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
font-size: 11pt;
|
||||
}
|
||||
|
||||
pre, blockquote {
|
||||
page-break-inside: avoid;
|
||||
}
|
||||
|
||||
h1, h2, h3, h4 {
|
||||
page-break-after: avoid;
|
||||
}
|
||||
}
|
||||
Loading…
Add table
Add a link
Reference in a new issue