|
|
|
@ -51,11 +51,34 @@ function writeHtml(filename: string, body: string, toc = '') { |
|
|
|
<meta name="viewport" content="width=device-width, initial-scale=1"> |
|
|
|
<meta name="viewport" content="width=device-width, initial-scale=1"> |
|
|
|
<title>${filename.replace('.html', '')}</title> |
|
|
|
<title>${filename.replace('.html', '')}</title> |
|
|
|
<style> |
|
|
|
<style> |
|
|
|
body { font-family: system-ui, sans-serif; max-width: 60em; margin: 0 auto; padding: 1rem; line-height: 1.5; } |
|
|
|
body { font-family: system-ui, -apple-system, sans-serif; max-width: 52em; margin: 0 auto; padding: 2rem; line-height: 1.6; color: #1a1a1a; background: #fff; } |
|
|
|
.toc { margin-bottom: 2rem; padding: 1rem; background: #f5f5f5; border-radius: 0.5rem; } |
|
|
|
h1 { font-size: 1.75rem; font-weight: 700; margin: 0 0 0.5em; padding-bottom: 0.25em; border-bottom: 2px solid #ddd; } |
|
|
|
.toc ul { list-style: none; padding-left: 0; } |
|
|
|
h2 { font-size: 1.35rem; font-weight: 600; margin: 1.5em 0 0.4em; padding-bottom: 0.2em; border-bottom: 1px solid #eee; } |
|
|
|
|
|
|
|
h3 { font-size: 1.15rem; font-weight: 600; margin: 1.25em 0 0.35em; } |
|
|
|
|
|
|
|
h4, h5, h6 { font-size: 1rem; font-weight: 600; margin: 1em 0 0.3em; } |
|
|
|
|
|
|
|
p { margin: 0 0 1em; } |
|
|
|
|
|
|
|
ul, ol { margin: 0 0 1em; padding-left: 1.5em; } |
|
|
|
|
|
|
|
ul ul, ol ol, ul ol, ol ul { margin: 0.2em 0; } |
|
|
|
|
|
|
|
li { margin: 0.25em 0; } |
|
|
|
|
|
|
|
code { font-family: ui-monospace, monospace; font-size: 0.9em; padding: 0.15em 0.35em; background: #f0f0f0; border-radius: 4px; } |
|
|
|
|
|
|
|
pre { margin: 0 0 1em; padding: 1rem; background: #f5f5f5; border-radius: 6px; overflow-x: auto; } |
|
|
|
|
|
|
|
pre code { padding: 0; background: none; } |
|
|
|
|
|
|
|
strong { font-weight: 600; } |
|
|
|
|
|
|
|
em { font-style: italic; } |
|
|
|
|
|
|
|
del { text-decoration: line-through; color: #666; } |
|
|
|
|
|
|
|
sub, sup { font-size: 0.75em; } |
|
|
|
|
|
|
|
a { color: #0066cc; text-decoration: none; } |
|
|
|
|
|
|
|
a:hover { text-decoration: underline; } |
|
|
|
|
|
|
|
.hashtag { color: #6b21a8; text-decoration: none; font-weight: 500; } |
|
|
|
|
|
|
|
.hashtag:hover { text-decoration: underline; } |
|
|
|
|
|
|
|
.toc { margin-bottom: 2rem; padding: 1.25rem; background: #f8f9fa; border-radius: 8px; border: 1px solid #e9ecef; } |
|
|
|
|
|
|
|
.toc h2 { font-size: 1rem; margin: 0 0 0.5em; border: none; padding: 0; } |
|
|
|
|
|
|
|
.toc ul { list-style: none; padding-left: 0; margin: 0; } |
|
|
|
|
|
|
|
.toc li { margin: 0.2em 0; } |
|
|
|
.toc a { color: #0066cc; } |
|
|
|
.toc a { color: #0066cc; } |
|
|
|
.hashtag { color: #6b21a8; text-decoration: none; } |
|
|
|
table { border-collapse: collapse; width: 100%; margin: 0 0 1em; } |
|
|
|
|
|
|
|
th, td { border: 1px solid #ddd; padding: 0.5em 0.75em; text-align: left; } |
|
|
|
|
|
|
|
th { background: #f5f5f5; font-weight: 600; } |
|
|
|
</style> |
|
|
|
</style> |
|
|
|
</head> |
|
|
|
</head> |
|
|
|
<body> |
|
|
|
<body> |
|
|
|
|
