@liustack/pagepress 0.6.1 → 0.8.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -0,0 +1,253 @@
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+
4
+ <head>
5
+ <meta charset="UTF-8" />
6
+ <meta name="viewport" content="width=device-width, initial-scale=1.0" />
7
+ <title>{{title}}</title>
8
+ <style>
9
+ /**
10
+ * Default Theme — Clean minimalist design
11
+ */
12
+
13
+ :root {
14
+ --text-primary: #1d1d1f;
15
+ --text-secondary: #6e6e73;
16
+ --text-tertiary: #86868b;
17
+ --bg-primary: #ffffff;
18
+ --border-color: #d2d2d7;
19
+ --border-light: #e5e5ea;
20
+ --accent: #0071e3;
21
+ --code-bg: #f5f5f7;
22
+ --code-block-bg: #f6f8fa;
23
+ }
24
+
25
+ * {
26
+ box-sizing: border-box;
27
+ margin: 0;
28
+ padding: 0;
29
+ }
30
+
31
+ body {
32
+ font-family: system-ui, -apple-system, BlinkMacSystemFont,
33
+ "PingFang SC", "Hiragino Sans GB", "Noto Sans CJK SC", sans-serif;
34
+ font-size: 16px;
35
+ line-height: 1.75;
36
+ color: var(--text-primary);
37
+ background: var(--bg-primary);
38
+ -webkit-font-smoothing: antialiased;
39
+ -moz-osx-font-smoothing: grayscale;
40
+ -webkit-print-color-adjust: exact;
41
+ print-color-adjust: exact;
42
+ }
43
+
44
+ .container {
45
+ max-width: 900px;
46
+ margin: 0 auto;
47
+ padding: 64px 56px 120px;
48
+ }
49
+
50
+ /* Heading System */
51
+ h1, h2, h3, h4, h5, h6 {
52
+ font-weight: 600;
53
+ line-height: 1.25;
54
+ margin-top: 1.5em;
55
+ margin-bottom: 0.5em;
56
+ }
57
+
58
+ h1 {
59
+ font-size: 32px;
60
+ line-height: 1.15;
61
+ margin-top: 0;
62
+ margin-bottom: 20px;
63
+ }
64
+
65
+ h2 {
66
+ font-size: 24px;
67
+ margin-top: 40px;
68
+ }
69
+
70
+ h3 {
71
+ font-size: 18px;
72
+ }
73
+
74
+ h4 {
75
+ font-size: 16px;
76
+ color: var(--text-secondary);
77
+ }
78
+
79
+ /* Paragraph */
80
+ p {
81
+ margin-bottom: 1.25em;
82
+ }
83
+
84
+ strong {
85
+ font-weight: 600;
86
+ }
87
+
88
+ a {
89
+ color: var(--accent);
90
+ text-decoration: none;
91
+ }
92
+
93
+ a:hover {
94
+ text-decoration: underline;
95
+ }
96
+
97
+ /* Blockquote */
98
+ blockquote {
99
+ margin: 1.5em 0;
100
+ padding: 0 0 0 1em;
101
+ border-left: 3px solid var(--border-color);
102
+ color: var(--text-secondary);
103
+ font-style: italic;
104
+ }
105
+
106
+ blockquote p:last-child {
107
+ margin-bottom: 0;
108
+ }
109
+
110
+ /* Code */
111
+ code {
112
+ font-family: ui-monospace, Menlo, Consolas, monospace;
113
+ font-size: 0.875em;
114
+ padding: 0.15em 0.4em;
115
+ background: var(--code-bg);
116
+ border-radius: 4px;
117
+ color: var(--text-primary);
118
+ }
119
+
120
+ pre {
121
+ margin: 1.5em 0;
122
+ padding: 20px 24px;
123
+ background: var(--code-block-bg);
124
+ border: 1px solid var(--border-light);
125
+ border-radius: 8px;
126
+ overflow-x: auto;
127
+ font-family: ui-monospace, Menlo, Consolas, monospace;
128
+ font-size: 13px;
129
+ line-height: 1.6;
130
+ color: var(--text-primary);
131
+ }
132
+
133
+ pre code {
134
+ display: block;
135
+ padding: 0;
136
+ background: transparent;
137
+ color: inherit;
138
+ border-radius: 0;
139
+ font-size: inherit;
140
+ font-family: inherit;
141
+ }
142
+
143
+ /* Syntax highlighting — light theme */
144
+ pre .hljs { color: #24292e; }
145
+ pre .hljs-comment, pre .hljs-quote { color: #6a737d; font-style: italic; }
146
+ pre .hljs-keyword, pre .hljs-selector-tag, pre .hljs-literal, pre .hljs-type { color: #d73a49; font-weight: 600; }
147
+ pre .hljs-string, pre .hljs-attr, pre .hljs-symbol, pre .hljs-bullet, pre .hljs-addition { color: #032f62; }
148
+ pre .hljs-number { color: #005cc5; }
149
+ pre .hljs-title, pre .hljs-section { color: #6f42c1; }
150
+ pre .hljs-built_in, pre .hljs-name { color: #005cc5; }
151
+ pre .hljs-variable, pre .hljs-template-variable { color: #e36209; }
152
+ pre .hljs-meta { color: #6f42c1; }
153
+
154
+ /* codehilite compatibility */
155
+ pre .c, pre .ch, pre .cm, pre .c1, pre .cs { color: #6a737d; font-style: italic; }
156
+ pre .k, pre .kc, pre .kd, pre .kn, pre .kp, pre .kr, pre .kt { color: #d73a49; font-weight: 600; }
157
+ pre .s, pre .s1, pre .s2, pre .sa, pre .sb, pre .sc, pre .sd, pre .se, pre .sh, pre .si, pre .sr, pre .ss, pre .sx { color: #032f62; }
158
+ pre .nf, pre .fm { color: #6f42c1; }
159
+ pre .mi, pre .mf, pre .mh, pre .mo, pre .mb, pre .il { color: #005cc5; }
160
+ pre .bp { color: #005cc5; }
161
+
162
+ /* Table */
163
+ table {
164
+ width: 100%;
165
+ margin: 1.5em 0;
166
+ border-collapse: collapse;
167
+ font-size: 15px;
168
+ }
169
+
170
+ th, td {
171
+ padding: 10px 14px;
172
+ text-align: left;
173
+ border-bottom: 1px solid var(--border-light);
174
+ }
175
+
176
+ th {
177
+ font-weight: 600;
178
+ color: var(--text-primary);
179
+ border-bottom-color: var(--border-color);
180
+ }
181
+
182
+ tr:last-child td {
183
+ border-bottom: none;
184
+ }
185
+
186
+ /* Lists */
187
+ ul, ol {
188
+ margin: 1em 0;
189
+ padding-left: 1.5em;
190
+ }
191
+
192
+ li {
193
+ margin: 0.4em 0;
194
+ line-height: 1.75;
195
+ }
196
+
197
+ li::marker {
198
+ color: var(--text-secondary);
199
+ }
200
+
201
+ /* Images */
202
+ img {
203
+ max-width: 100%;
204
+ height: auto;
205
+ display: block;
206
+ margin: 1.5em auto;
207
+ border-radius: 8px;
208
+ }
209
+
210
+ /* Divider */
211
+ hr {
212
+ border: none;
213
+ height: 1px;
214
+ background: var(--border-color);
215
+ margin: 2em 0;
216
+ }
217
+
218
+ /* Print */
219
+ @page {
220
+ size: A4;
221
+ margin: 24mm 20mm;
222
+ }
223
+
224
+ @media print {
225
+ .container {
226
+ padding: 0;
227
+ max-width: none;
228
+ }
229
+
230
+ h1 { font-size: 24px; }
231
+ h2 { font-size: 18px; }
232
+
233
+ pre {
234
+ background: var(--code-block-bg) !important;
235
+ color: var(--text-primary) !important;
236
+ border: 1px solid var(--border-light);
237
+ -webkit-print-color-adjust: exact;
238
+ print-color-adjust: exact;
239
+ }
240
+
241
+ pre code { color: inherit !important; }
242
+ }
243
+ </style>
244
+ {{styles}}
245
+ </head>
246
+
247
+ <body>
248
+ <article class="container">
249
+ {{body}}
250
+ </article>
251
+ </body>
252
+
253
+ </html>