What:新增 html-export 與 html-style 兩支技能、tools/html-render.sh 與 tools/html-style.sh 兩支工具,以及六種版型乘五種風格的 HTML 範本。 Why:wiki 頁與議題要拿給 Gitea 以外的人看時,只能複製 markdown;不同類型的文件也該有各自的版面,不是每份都長一樣。 How:版型(report、slide、dashboard、spec、timeline、onepager)決定內容怎麼排,風格(minimal、corporate、dark、print、vivid)決定看起來長怎樣,兩者自由搭配。哪一種頁面套哪一組由設定決定:專案的 .jsc/html-styles 優先,其次 $JSC_HOME/html-styles.conf,對不到退 DEFAULT,再對不到才用內建的 report/minimal。產出是單一 HTML 檔,CSS 與腳本全部內嵌。 Who:需要把 wiki 頁或議題寄給客戶、主管或跨團隊同事的人。 Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
62 lines
1.7 KiB
HTML
62 lines
1.7 KiB
HTML
<!-- 時間軸:每個 h2 一個節點串成一條線,適合工作日誌與里程碑 -->
|
||
<!doctype html>
|
||
<html lang="zh-Hant" data-layout="{{LAYOUT}}" data-style="{{STYLE_NAME}}">
|
||
<head>
|
||
<meta charset="utf-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||
<title>{{TITLE}}</title>
|
||
<style>{{BASE}}</style>
|
||
<style>{{STYLE}}</style>
|
||
<style>
|
||
.shell { max-width: 900px; margin: 0 auto; padding: 0 1.25rem; }
|
||
.content { position: relative; padding-left: 2rem; }
|
||
.content::before {
|
||
content: "";
|
||
position: absolute;
|
||
left: .45rem;
|
||
top: .75rem;
|
||
bottom: .75rem;
|
||
width: 2px;
|
||
background: var(--border);
|
||
}
|
||
.jsc-section { position: relative; padding: 0 0 1.75rem; }
|
||
.jsc-section::before {
|
||
content: "";
|
||
position: absolute;
|
||
left: -1.9rem;
|
||
top: .95rem;
|
||
width: .85rem;
|
||
height: .85rem;
|
||
border-radius: 50%;
|
||
background: var(--accent);
|
||
border: 3px solid var(--bg);
|
||
}
|
||
.jsc-section h2 { margin-top: .5rem; font-size: 1.2rem; }
|
||
.jsc-section:last-child { padding-bottom: .5rem; }
|
||
@media print { .jsc-section { page-break-inside: avoid; } }
|
||
</style>
|
||
</head>
|
||
<body>
|
||
<div class="shell">
|
||
<header class="page-head">
|
||
<h1>{{TITLE}}</h1>
|
||
<p class="subtitle">{{SUBTITLE}}</p>
|
||
<p class="meta">{{SOURCE}}<span class="generated">產生時間:{{GENERATED}}</span></p>
|
||
</header>
|
||
<main class="content" id="content">{{CONTENT}}</main>
|
||
<footer class="page-foot">
|
||
<span class="badge">{{LAYOUT}}/{{STYLE_NAME}}</span>
|
||
<span>本頁由 jsc-gitea:html-export 產生</span>
|
||
</footer>
|
||
</div>
|
||
<script>{{BASE_JS}}</script>
|
||
<script>
|
||
(function () {
|
||
var content = document.getElementById('content');
|
||
jsc.wrapTables(content);
|
||
jsc.splitBySection(content);
|
||
})();
|
||
</script>
|
||
</body>
|
||
</html>
|