feat: product website for GitHub Pages + author CodingPlan.Site
Deploy website to GitHub Pages / deploy (push) Canceled after 0s

- website/: zero-dependency static landing page (HTML+CSS), corporate
  light theme, real app screenshots, download links pointing to the
  git.codingplan.site release channel (exe/msi) with GitHub mirror
- .github/workflows/deploy-website.yml: deploy website/ to GitHub Pages
  on push to main (paths: website/**)
- package.json: author -> CodingPlan.Site
- README: link to the site and its source folder
This commit is contained in:
Bill committed 2026-09-21 09:11:05 +08:00
1 parent 8442103343
commit c01d3eb365
10 files changed
+665 -1

No files matched your search

View File
Whitespace-only changes.
+63
View File
@@ -0,0 +1,63 @@
# OpenTerminal 官网
OpenTerminal 的产品介绍站点,部署在 GitHub Pages。
纯静态 HTML + CSS,**无构建步骤、无第三方依赖**,改完即可发布。
## 线上地址
- GitHub Pages: `https://billowliu2.github.io/OpenTerminal/`
## 目录结构
```
website/
├── index.html # 单页站点:功能介绍 / 下载 / 更新日志
├── .nojekyll # 让 GitHub Pages 原样托管(跳过 Jekyll 处理)
└── assets/
├── style.css # 全部样式(企业风浅色主题,单一强调色)
├── shot-terminal.png # 主界面截图(四路分屏)
├── shot-themes.png # 主题设置页截图
└── icon.png # 应用图标(来自仓库 build/icon.png)
```
## 发新版本时需要更新的地方
`index.html` 中搜索 `1.0.15`,共 3 处下载链接(hero 主按钮、下载表格 exe、msi)。
下载链接格式(CodingPlan.Site 国内直连通道):
```
https://git.codingplan.site/admin/OpenTerminal/releases/download/v<版本>/OpenTerminal-<版本>-setup.exe
https://git.codingplan.site/admin/OpenTerminal/releases/download/v<版本>/OpenTerminal-<版本>-setup.msi
```
同时更新「近期更新」小节(与 RELEASE_NOTES.md 内容保持一致)和下载表格里的文件大小。
## 部署方式
GitHub Actions 工作流 `.github/workflows/deploy-website.yml`:
push 到 `main` 且 `website/` 下有改动时,自动把 `website/` 目录发布到 GitHub Pages。
Gitea(git.codingplan.site)只同步代码,Pages 由 GitHub 侧托管。
首次部署需要在 GitHub 仓库设置里确认:Settings → Pages → Source 选择
"GitHub Actions"(工作流已声明 `pages: write` 与 `id-token: write` 权限)。
## 本地预览
无构建步骤,任选其一:
```bash
# Python
python -m http.server 8080 --directory website
# Node
npx serve website
```
然后访问 `http://localhost:8080`。直接双击 `index.html` 也可以(无跨域资源)。
## 设计约定
- 浅色企业风,避免营销站常见的霓虹/渐变装饰
- 强调色仅一个:`#1a7f37`(应用品牌绿 #3fb950 的深色化,保证浅底对比度 ≥ 4.5:1)
- 截图来自真实运行界面,与应用内设置一致
- 中文为主要语言;字体使用系统栈(Segoe UI / 微软雅黑),不加载外部字体
Binary file not shown.

After

Width:  |  Height:  |  Size: 27 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 83 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 101 KiB

+364
View File
@@ -0,0 +1,364 @@
/* OpenTerminal 官网 - 企业风浅色主题
单一强调色: 品牌绿 #1a7f37 (深化的 #3fb950, 保证浅底对比度)
无渐变 / 无发光 / 无装饰性动画, 仅保留 hover 与 focus 反馈 */
:root {
--bg: #ffffff;
--bg-soft: #f7f8f8;
--text: #1c2128;
--text-2: #57606a;
--border: #d9dee3;
--accent: #1a7f37;
--accent-hover: #116329;
--radius: 8px;
--mono: ui-monospace, "Cascadia Mono", "SF Mono", Consolas, monospace;
}
* { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
font-family: "Segoe UI", "Microsoft YaHei", -apple-system, "PingFang SC", "Noto Sans SC", sans-serif;
font-size: 16px;
line-height: 1.6;
color: var(--text);
background: var(--bg);
-webkit-font-smoothing: antialiased;
}
.container {
max-width: 1120px;
margin: 0 auto;
padding: 0 24px;
}
.mono { font-family: var(--mono); font-size: 0.92em; }
/* ---- nav ---- */
.site-nav {
position: sticky;
top: 0;
z-index: 10;
background: rgba(255, 255, 255, 0.94);
border-bottom: 1px solid var(--border);
}
.nav-inner {
display: flex;
align-items: center;
justify-content: space-between;
height: 64px;
}
.brand {
display: flex;
align-items: center;
gap: 10px;
font-weight: 600;
font-size: 17px;
color: var(--text);
text-decoration: none;
}
.nav-links { display: flex; gap: 28px; }
.nav-links a {
color: var(--text-2);
text-decoration: none;
font-size: 15px;
}
.nav-links a:hover { color: var(--text); }
/* ---- hero ---- */
.hero {
padding: 72px 0 0;
background: var(--bg-soft);
border-bottom: 1px solid var(--border);
}
.hero-grid {
display: grid;
grid-template-columns: 1fr 1.2fr;
gap: 48px;
align-items: center;
}
.hero-kicker {
font-size: 14px;
color: var(--text-2);
margin-bottom: 16px;
}
.hero h1 {
font-size: 36px;
line-height: 1.25;
letter-spacing: -0.02em;
font-weight: 650;
}
.hero-sub {
margin-top: 20px;
max-width: 46ch;
color: var(--text-2);
font-size: 17px;
}
.hero-actions {
display: flex;
gap: 12px;
margin-top: 28px;
flex-wrap: wrap;
}
.btn {
display: inline-block;
padding: 10px 22px;
border-radius: var(--radius);
font-size: 15px;
font-weight: 600;
text-decoration: none;
border: 1px solid transparent;
}
.btn:active { transform: translateY(1px); }
.btn-primary {
background: var(--accent);
color: #ffffff;
}
.btn-primary:hover { background: var(--accent-hover); }
.btn-ghost {
color: var(--text);
border-color: var(--border);
background: var(--bg);
}
.btn-ghost:hover { border-color: var(--text-2); }
.hero-note {
margin-top: 14px;
font-size: 13px;
color: var(--text-2);
}
.hero-shot {
min-width: 0;
}
.hero-shot img {
display: block;
width: 100%;
height: auto;
border: 1px solid var(--border);
border-radius: var(--radius);
box-shadow: 0 8px 24px rgba(28, 33, 40, 0.10);
}
.hero-shot figcaption {
margin-top: 10px;
font-size: 13px;
color: var(--text-2);
text-align: center;
}
.spec-strip {
display: flex;
gap: 32px;
flex-wrap: wrap;
padding-top: 40px;
padding-bottom: 40px;
font-size: 14px;
color: var(--text-2);
}
.spec-strip strong { color: var(--text); font-weight: 600; }
/* ---- features ---- */
.features { padding: 72px 0; }
.features h2, .download h2, .changelog h2 {
font-size: 28px;
font-weight: 650;
letter-spacing: -0.01em;
}
.section-sub {
margin-top: 10px;
color: var(--text-2);
max-width: 60ch;
}
.feature-row {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 64px;
margin-top: 48px;
}
.media-row {
grid-template-columns: 7fr 5fr;
align-items: center;
gap: 56px;
}
.feature-copy h3 {
font-size: 20px;
font-weight: 650;
margin-bottom: 16px;
}
.feature-copy ul {
list-style: none;
display: grid;
gap: 10px;
}
.feature-copy li {
padding-left: 18px;
position: relative;
color: var(--text-2);
font-size: 15px;
}
.feature-copy li::before {
content: "";
position: absolute;
left: 0;
top: 0.62em;
width: 6px;
height: 2px;
background: var(--accent);
}
.feature-shot img {
display: block;
width: 100%;
height: auto;
border: 1px solid var(--border);
border-radius: var(--radius);
box-shadow: 0 6px 18px rgba(28, 33, 40, 0.08);
}
/* ---- download ---- */
.download {
padding: 72px 0;
background: var(--bg-soft);
border-top: 1px solid var(--border);
border-bottom: 1px solid var(--border);
}
.dl-table {
width: 100%;
border-collapse: collapse;
margin-top: 40px;
background: var(--bg);
border: 1px solid var(--border);
border-radius: var(--radius);
overflow: hidden;
font-size: 14.5px;
}
.dl-table th, .dl-table td {
text-align: left;
padding: 14px 18px;
vertical-align: top;
}
.dl-table thead th {
background: var(--bg-soft);
color: var(--text-2);
font-weight: 600;
font-size: 13px;
}
.dl-table tbody tr + tr td { border-top: 1px solid var(--border); }
.dl-table a { color: var(--accent); text-decoration: none; font-weight: 600; }
.dl-table a:hover { text-decoration: underline; }
.dl-table .sep { color: var(--border); margin: 0 8px; }
.update-note { margin-top: 40px; max-width: 72ch; }
.update-note h3 { font-size: 16px; margin-bottom: 8px; }
.update-note p { color: var(--text-2); font-size: 14.5px; }
/* ---- changelog ---- */
.changelog { padding: 72px 0; }
.changelog-list {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 48px;
margin-top: 40px;
}
.changelog-list article h3 {
font-size: 15px;
font-weight: 600;
margin-bottom: 12px;
}
.changelog-list article h3 .mono {
color: var(--text);
margin-right: 8px;
}
.changelog-list ul {
list-style: none;
display: grid;
gap: 8px;
}
.changelog-list li {
font-size: 14px;
color: var(--text-2);
}
.changelog-more {
margin-top: 40px;
font-size: 14px;
color: var(--text-2);
}
.changelog-more a { color: var(--accent); }
/* ---- footer ---- */
.site-footer {
border-top: 1px solid var(--border);
padding: 28px 0;
font-size: 13.5px;
color: var(--text-2);
}
.footer-inner {
display: flex;
justify-content: space-between;
gap: 16px;
flex-wrap: wrap;
}
/* ---- responsive ---- */
@media (max-width: 960px) {
.hero-grid { grid-template-columns: 1fr; gap: 40px; }
.hero { padding-top: 48px; }
.feature-row, .media-row { grid-template-columns: 1fr; gap: 32px; }
.media-row .feature-shot { order: -1; }
.changelog-list { grid-template-columns: 1fr; gap: 32px; }
}
@media (max-width: 640px) {
.nav-links { gap: 16px; }
.nav-links a { font-size: 14px; }
.hero h1 { font-size: 30px; }
.dl-table { display: block; overflow-x: auto; white-space: nowrap; }
}
@media (prefers-reduced-motion: reduce) {
html { scroll-behavior: auto; }
}
+204
View File
@@ -0,0 +1,204 @@
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>OpenTerminal - 本地终端 / SSH / SFTP 桌面终端,开源 Windows 终端工具</title>
<meta name="description" content="OpenTerminal 是开源的 Windows 桌面终端:本地终端、SSH 远程会话、SFTP 文件管理、分屏与广播输入、主题定制。MIT 协议,支持自动更新。" />
<link rel="icon" type="image/png" href="assets/icon.png" />
<link rel="stylesheet" href="assets/style.css" />
</head>
<body>
<header class="site-nav">
<div class="container nav-inner">
<a class="brand" href="#top">
<img src="assets/icon.png" alt="OpenTerminal 图标" width="24" height="24" />
<span>OpenTerminal</span>
</a>
<nav class="nav-links">
<a href="#features">功能</a>
<a href="#download">下载</a>
<a href="#changelog">更新日志</a>
<a href="https://github.com/billowliu2/OpenTerminal" target="_blank" rel="noopener">GitHub</a>
</nav>
</div>
</header>
<main id="top">
<section class="hero">
<div class="container hero-grid">
<div class="hero-copy">
<p class="hero-kicker">开源桌面终端 · MIT 协议</p>
<h1>本地终端、SSH 与 SFTP<br />装进同一个桌面应用</h1>
<p class="hero-sub">
OpenTerminal 面向开发和运维场景:WebGL 加速的终端渲染、可分屏的 SSH 会话、
内置 SFTP 文件管理与广播输入。安装即用,支持自动更新。
</p>
<div class="hero-actions">
<a class="btn btn-primary" id="dl-exe" href="https://git.codingplan.site/admin/OpenTerminal/releases/download/v1.0.15/OpenTerminal-1.0.15-setup.exe">
下载 Windows 安装包
</a>
<a class="btn btn-ghost" href="https://github.com/billowliu2/OpenTerminal" target="_blank" rel="noopener">
查看源码
</a>
</div>
<p class="hero-note">国内网络直连下载(git.codingplan.site),无需代理。</p>
</div>
<figure class="hero-shot">
<img src="assets/shot-terminal.png" alt="OpenTerminal 主界面:四个分屏终端会话" width="1282" height="801" />
<figcaption>四路分屏会话,每路独立连接本地或远程主机</figcaption>
</figure>
</div>
<div class="container spec-strip">
<span>当前版本 <strong class="mono">1.0.15</strong></span>
<span>Windows 10 / 11 · x64</span>
<span>MIT 开源协议</span>
<span>exe 支持应用内自动更新</span>
</div>
</section>
<section class="features" id="features">
<div class="container">
<h2>核心能力</h2>
<p class="section-sub">按使用场景划分的三组功能,全部能力见仓库 README。</p>
<div class="feature-row">
<div class="feature-copy">
<h3>终端核心</h3>
<ul>
<li>node-pty 本地会话,自动探测 PowerShell / zsh / bash</li>
<li>xterm.js WebGL 渲染,声明 256 色与真彩能力,异常时自动降级</li>
<li>内嵌搜索(Ctrl+F)、命令历史、粘贴风险确认</li>
<li>关键词高亮:内置 11 条规则(错误状态、路径、IP、URL 等),支持自定义正则</li>
<li>字体、字重、字距、行高、光标样式实时生效</li>
</ul>
</div>
<div class="feature-copy">
<h3>SSH 与 SFTP</h3>
<ul>
<li>ssh2 实现:密码、私钥(文件或粘贴内容)、SSH Agent 三种认证</li>
<li>多路分屏与广播输入,一次操作下发到多台主机</li>
<li>SFTP 文件面板:上传下载、同名覆盖确认、chmod / chown 权限编辑</li>
<li>ZMODEM 传输支持;主机指纹校验与首次连接确认</li>
<li>目录记忆:OSC 7 上报工作目录,新会话按上次位置恢复</li>
</ul>
</div>
</div>
<div class="feature-row media-row">
<figure class="feature-shot">
<img src="assets/shot-themes.png" alt="OpenTerminal 主题设置:主题画廊与背景图片配置" width="1282" height="801" />
</figure>
<div class="feature-copy">
<h3>定制与效率</h3>
<ul>
<li>主题编辑器:22 个颜色位逐项调整,实时预览;支持自定义背景图片与不透明度</li>
<li>内置 13 套主题,跟随系统明暗自动切换</li>
<li>命令库:保存常用命令片段,跨会话发送到指定终端</li>
<li>启动恢复上次会话布局;界面缩放 50% 至 150%</li>
<li>四语言界面:简体中文、繁体中文、English、日本語</li>
</ul>
</div>
</div>
</div>
</section>
<section class="download" id="download">
<div class="container">
<h2>下载</h2>
<p class="section-sub">
国内网络建议使用 CodingPlan.Site 通道直连下载;GitHub 仓库为镜像,内容一致。
<!-- 发新版本时更新下方两条直链与 hero 的 id=dl-exe 链接 -->
</p>
<table class="dl-table">
<thead>
<tr><th>安装包</th><th>适用场景</th><th>大小</th><th>链接</th></tr>
</thead>
<tbody>
<tr>
<td class="mono">OpenTerminal-1.0.15-setup.exe</td>
<td>常规安装,支持应用内自动更新(推荐)</td>
<td class="mono">122 MB</td>
<td>
<a href="https://git.codingplan.site/admin/OpenTerminal/releases/download/v1.0.15/OpenTerminal-1.0.15-setup.exe">国内直连</a>
<span class="sep">·</span>
<a href="https://github.com/billowliu2/OpenTerminal/releases" target="_blank" rel="noopener">GitHub</a>
</td>
</tr>
<tr>
<td class="mono">OpenTerminal-1.0.15-setup.msi</td>
<td>企业批量部署(MSI 无自动更新,需手动升级)</td>
<td class="mono">135 MB</td>
<td>
<a href="https://git.codingplan.site/admin/OpenTerminal/releases/download/v1.0.15/OpenTerminal-1.0.15-setup.msi">国内直连</a>
</td>
</tr>
<tr>
<td class="mono">历史版本</td>
<td>全部发布记录与更新说明</td>
<td class="mono">-</td>
<td>
<a href="https://git.codingplan.site/admin/OpenTerminal/releases" target="_blank" rel="noopener">releases 列表</a>
</td>
</tr>
</tbody>
</table>
<div class="update-note">
<h3>自动更新说明</h3>
<p>
应用内检查更新时优先访问 <span class="mono">git.codingplan.site</span> 更新通道(国内直连、不走系统代理),
失败时回退 GitHub Releases。更新包经 SHA-512 校验后安装。
更新说明文字从发布通道的 release-notes.md 读取,与每次发布同步更新。
</p>
</div>
</div>
</section>
<section class="changelog" id="changelog">
<div class="container">
<h2>近期更新</h2>
<div class="changelog-list">
<article>
<h3><span class="mono">1.0.15</span> 2026-09-20</h3>
<ul>
<li>新增自定义终端背景图片与图片不透明度设置</li>
<li>主题编辑器重名提醒与颜色值校验</li>
<li>设置导航选中项文字对比度修复</li>
</ul>
</article>
<article>
<h3><span class="mono">1.0.14</span> 2026-09-20</h3>
<ul>
<li>修复大文件(约 250KB 以上)上传损坏与 SFTP 句柄泄漏</li>
<li>SSH 中文乱码、命令历史错乱等终端修复</li>
<li>权限编辑、连接错误提示等 20 余项修复</li>
</ul>
</article>
<article>
<h3><span class="mono">1.0.13</span> 2026-09-20</h3>
<ul>
<li>命令片段库与广播输入改进</li>
<li>监控面板历史曲线实时重绘</li>
</ul>
</article>
</div>
<p class="changelog-more">
完整日志见仓库 <a href="https://github.com/billowliu2/OpenTerminal/blob/main/CHANGELOG.md" target="_blank" rel="noopener">CHANGELOG.md</a>。
</p>
</div>
</section>
</main>
<footer class="site-footer">
<div class="container footer-inner">
<span>© 2026 CodingPlan.Site · OpenTerminal 以 MIT 协议开源</span>
<span class="mono">更新通道:git.codingplan.site</span>
</div>
</footer>
</body>
</html>