admin
5afeb6b78a
一、④段整套同步（用户选候选 A）
- 新增 `references/stage-proto-doc/assets/产品文档模板.html`（16 KB／247 行，从备份拷、转 LF）。
- ④段 SKILL.md 换成备份 15:28 那版，并按模板口径改齐：
· 「产品文档框架」从「四块＋一附录」改成**六节** —— 页面结构／功能清单／使用场景／操作流程／
跨页与界面状态／待确认与偏离；与模板同构，⛔ 不从空白页重写结构。
· 编号从 R/S/F 改成 **P 页面／S 场景／F 功能／J 二级功能**，各自唯一、按展示顺序通排。
· 保留旧版有价值的要求：每项功能补齐 做什么／入口在哪／输入边界／异常与恢复；重点功能三处标红；
横向流程图每步写清页面／功能／操作／完成判据。
· 完成标准「七节」→「六节」，自查清单同步换掉「需求」那批条目，补模板与配图两条。
· 路径 `designs/<项目>/` → `docs/pm/<项目>/ui/`（2 处）。
· 补回本机那条「每份产出文档开头都要有一张图」的引用（指向主 skill，段内不复述）。
- 主 skill 同步：四段结构表④行、④段沿革、画图小节（④段画页面结构图 ＋ 用户路径）。
二、open-design 移到技能根（用户选候选 A）
- `git mv product-planning/references/stage-delivery/assets/open-design → open-design/`（4178 文件）。
- `.gitignore` 白名单加 `!/open-design/` —— 否则移出去就不再纳入版本控制。
- 引用改 11 处：路径形态 `assets/open-design/...` → `<技能根>/open-design/...`；
「随段携带的自带件」改称「同根技能」；「路径怎么找」那条改成自带件（段内相对路径）与
同根技能（`<技能根>/<技能名>/`）两类分开写。
- open-design 自己的 ATTRIBUTION.md 两处同步（它现在与 oil-ui-pro 同层）。
- 副作用（有益）：命名闸门读数由 2063 降到 225 —— 此前它把 open-design 里 919 个第三方 md
当成规则一起扫了；现在只扫本包 23 个 md。已确认④段的 H1 与 4a/4b/4c 子步仍在检查范围内。
三、验收
- check_naming.py --ws E:/ProgramData/AIProject/contentm_agent ＝ 通过 225 / 失败 0 / 提示 27。
- 活文件里 `assets/open-design` 残留 0；工作区 CRLF 文件 0。
401 lines
12 KiB
HTML
401 lines
12 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Meridian — Coming Soon</title>
|
|
<link rel="preconnect" href="https://fonts.googleapis.com">
|
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
|
<link href="https://fonts.googleapis.com/css2?family=Syne:wght@700;800&family=DM+Sans:wght@400;500;600&display=swap" rel="stylesheet">
|
|
<style>
|
|
:root {
|
|
--bg: #FDE8DF;
|
|
--fg: #1A1410;
|
|
--color-ink: #1A1410;
|
|
--accent: #1A1410;
|
|
--deco: #E8835A;
|
|
--deco-logo: #E8522A;
|
|
--deco-stripe: #F5A623;
|
|
--input-border: rgba(196, 169, 154, 0.38);
|
|
--success: #2D6A4F;
|
|
--btn-label: #FDE8DF;
|
|
--ticker-bg: rgba(0, 0, 0, 0.9);
|
|
--ticker-fg: rgba(255, 255, 255, 0.9);
|
|
--deco-stroke: rgba(0, 0, 0, 0.12);
|
|
--logo-shadow: rgba(0, 0, 0, 0.08);
|
|
--font-body: 'DM Sans', sans-serif;
|
|
--font-display: 'Syne', sans-serif;
|
|
}
|
|
*, *::before, *::after {
|
|
box-sizing: border-box;
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
html, body {
|
|
height: 100%;
|
|
overflow-x: hidden;
|
|
}
|
|
.logo {
|
|
position: absolute;
|
|
top: 20px;
|
|
left: 24px;
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 14px;
|
|
z-index: 10;
|
|
}
|
|
.logo-container {
|
|
width: 48px;
|
|
height: 48px;
|
|
flex-shrink: 0;
|
|
border-radius: 50%;
|
|
background: linear-gradient(135deg, var(--deco-logo) 0%, var(--deco) 100%);
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
overflow: hidden;
|
|
box-shadow: 0 2px 8px var(--logo-shadow);
|
|
}
|
|
.logo-svg {
|
|
width: 100%;
|
|
height: 100%;
|
|
object-fit: contain;
|
|
padding: 2px;
|
|
}
|
|
.logo-text {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 10px;
|
|
flex-shrink: 0;
|
|
}
|
|
.logo-name {
|
|
font-family: var(--font-display);
|
|
font-weight: 700;
|
|
font-size: 18px;
|
|
letter-spacing: -0.02em;
|
|
color: var(--color-ink);
|
|
}
|
|
.logo-dot {
|
|
font-size: 10px;
|
|
color: var(--deco-logo);
|
|
opacity: 0.6;
|
|
}
|
|
body {
|
|
font-family: var(--font-body);
|
|
background-color: var(--bg);
|
|
color: var(--fg);
|
|
display: flex;
|
|
flex-direction: column;
|
|
min-height: 100svh;
|
|
overflow-x: hidden;
|
|
overflow-y: auto;
|
|
}
|
|
.upper {
|
|
flex: 0 0 auto;
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
justify-content: center;
|
|
text-align: center;
|
|
padding: 60px 24px 40px;
|
|
position: relative;
|
|
z-index: 2;
|
|
}
|
|
.headline {
|
|
font-family: var(--font-display);
|
|
font-weight: 800;
|
|
font-size: clamp(56px, 8vw, 96px);
|
|
letter-spacing: -0.03em;
|
|
line-height: 1.0;
|
|
color: var(--fg);
|
|
text-align: center;
|
|
max-width: 900px;
|
|
margin: 0 auto 22px;
|
|
}
|
|
.subtext {
|
|
font-size: clamp(15px, 1.5vw, 18px);
|
|
font-weight: 400;
|
|
line-height: 1.6;
|
|
color: var(--fg);
|
|
max-width: 420px;
|
|
margin-bottom: 44px;
|
|
}
|
|
.form-row {
|
|
display: flex;
|
|
gap: 8px;
|
|
width: 100%;
|
|
max-width: 560px;
|
|
justify-content: center;
|
|
}
|
|
.form-row input {
|
|
flex: 1;
|
|
min-width: 0;
|
|
padding: 14px 18px;
|
|
font-family: var(--font-body);
|
|
font-size: 15px;
|
|
color: var(--color-ink);
|
|
background: transparent;
|
|
border: 1.5px solid var(--input-border);
|
|
border-radius: 4px;
|
|
outline: none;
|
|
transition: border-color 0.2s;
|
|
}
|
|
.form-row input::placeholder {
|
|
color: var(--input-border);
|
|
}
|
|
.form-row input:focus {
|
|
border-color: var(--fg);
|
|
outline: 2px solid var(--fg);
|
|
outline-offset: 2px;
|
|
}
|
|
.form-row button {
|
|
flex-shrink: 0;
|
|
padding: 14px 22px;
|
|
font-family: var(--font-body);
|
|
font-size: 15px;
|
|
font-weight: 500;
|
|
color: var(--btn-label);
|
|
background: var(--accent);
|
|
border: none;
|
|
border-radius: 2px;
|
|
cursor: pointer;
|
|
white-space: nowrap;
|
|
transition: opacity 0.15s, transform 0.1s;
|
|
}
|
|
.form-row button:hover {
|
|
opacity: 0.85;
|
|
}
|
|
.form-row button:active {
|
|
transform: scale(0.98);
|
|
}
|
|
.success-msg {
|
|
display: none;
|
|
margin-top: 18px;
|
|
font-size: 15px;
|
|
font-weight: 500;
|
|
color: var(--success);
|
|
}
|
|
.success-msg.visible {
|
|
display: block;
|
|
}
|
|
.deco-section {
|
|
flex: 1;
|
|
position: relative;
|
|
overflow: hidden;
|
|
min-height: 25vh;
|
|
display: flex;
|
|
flex-direction: column;
|
|
}
|
|
.coil-row {
|
|
display: block;
|
|
width: 100%;
|
|
height: 60px;
|
|
flex-shrink: 0;
|
|
background: var(--bg);
|
|
}
|
|
.stripe {
|
|
width: 100%;
|
|
height: 14px;
|
|
background: var(--deco-stripe);
|
|
flex-shrink: 0;
|
|
}
|
|
.grid-floor {
|
|
flex: 1;
|
|
position: relative;
|
|
background-color: var(--deco);
|
|
min-height: 80px;
|
|
}
|
|
.grid-svg {
|
|
position: absolute;
|
|
inset: 0;
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
.ticker-wrap {
|
|
width: 100%;
|
|
overflow: hidden;
|
|
background: var(--ticker-bg);
|
|
padding: 10px 0;
|
|
flex-shrink: 0;
|
|
}
|
|
.ticker-track {
|
|
display: flex;
|
|
gap: 24px;
|
|
white-space: nowrap;
|
|
animation: ticker-scroll 20s linear infinite;
|
|
}
|
|
.ticker-unit {
|
|
font-family: var(--font-body);
|
|
font-size: 11px;
|
|
font-weight: 600;
|
|
letter-spacing: 0.15em;
|
|
text-transform: uppercase;
|
|
color: var(--ticker-fg);
|
|
flex-shrink: 0;
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 12px;
|
|
margin-right: -12px;
|
|
}
|
|
.ticker-star {
|
|
color: var(--deco-stripe);
|
|
margin-right: 4px;
|
|
}
|
|
@keyframes ticker-scroll {
|
|
from { transform: translateX(0); }
|
|
to { transform: translateX(-50%); }
|
|
}
|
|
|
|
@media (prefers-reduced-motion: reduce) {
|
|
.ticker-track {
|
|
animation: none;
|
|
}
|
|
}
|
|
@media (max-width: 600px) {
|
|
.logo {
|
|
left: 16px;
|
|
top: 16px;
|
|
gap: 10px;
|
|
}
|
|
.logo-container {
|
|
width: 40px;
|
|
height: 40px;
|
|
}
|
|
.logo-name {
|
|
font-size: 14px;
|
|
}
|
|
.upper {
|
|
padding: 30px 16px;
|
|
flex: 0 0 50vh;
|
|
}
|
|
.form-row {
|
|
flex-direction: column;
|
|
align-items: stretch;
|
|
}
|
|
.form-row input,
|
|
.form-row button {
|
|
width: 100%;
|
|
}
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
|
|
<div class="logo">
|
|
<div class="logo-container">
|
|
<svg class="logo-svg" viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg">
|
|
<circle cx="50" cy="50" r="48" fill="var(--deco-logo)"/>
|
|
<text x="50" y="60" font-family="'DM Sans', sans-serif" font-size="42" font-weight="700" text-anchor="middle" fill="var(--btn-label)" letter-spacing="-1">Md</text>
|
|
</svg>
|
|
</div>
|
|
<div class="logo-text">
|
|
<span class="logo-name">Meridian</span>
|
|
<span class="logo-dot">·</span>
|
|
</div>
|
|
</div>
|
|
|
|
<section class="upper">
|
|
<h1 class="headline">Meridian is<br>almost here</h1>
|
|
<p class="subtext">The workspace that connects your ideas before you've finished thinking them.</p>
|
|
|
|
<form class="form-row" id="waitlist-form">
|
|
<input type="text" name="firstname" placeholder="First name" autocomplete="given-name">
|
|
<input type="email" name="email" placeholder="Work email" autocomplete="email" required>
|
|
<button type="submit">Join the Waitlist</button>
|
|
</form>
|
|
<p class="success-msg" id="success-msg" role="status">You're on the list! We'll be in touch.</p>
|
|
</section>
|
|
|
|
<div class="deco-section">
|
|
|
|
<svg class="coil-row" viewBox="0 0 1440 60" preserveAspectRatio="none" xmlns="http://www.w3.org/2000/svg">
|
|
<g fill="none" style="stroke: var(--deco-stroke);" stroke-width="1.5">
|
|
<path d="M 9,60 A 41,30 0 0 1 91,60"/>
|
|
<path d="M 94,60 A 41,30 0 0 1 176,60"/>
|
|
<path d="M 179,60 A 41,30 0 0 1 261,60"/>
|
|
<path d="M 264,60 A 41,30 0 0 1 346,60"/>
|
|
<path d="M 349,60 A 41,30 0 0 1 431,60"/>
|
|
<path d="M 434,60 A 41,30 0 0 1 516,60"/>
|
|
<path d="M 519,60 A 41,30 0 0 1 601,60"/>
|
|
<path d="M 604,60 A 41,30 0 0 1 686,60"/>
|
|
<path d="M 689,60 A 41,30 0 0 1 771,60"/>
|
|
<path d="M 774,60 A 41,30 0 0 1 856,60"/>
|
|
<path d="M 859,60 A 41,30 0 0 1 941,60"/>
|
|
<path d="M 944,60 A 41,30 0 0 1 1026,60"/>
|
|
<path d="M 1029,60 A 41,30 0 0 1 1111,60"/>
|
|
<path d="M 1114,60 A 41,30 0 0 1 1196,60"/>
|
|
<path d="M 1199,60 A 41,30 0 0 1 1281,60"/>
|
|
<path d="M 1284,60 A 41,30 0 0 1 1366,60"/>
|
|
<path d="M 1369,60 A 41,30 0 0 1 1451,60"/>
|
|
</g>
|
|
</svg>
|
|
|
|
<div class="stripe"></div>
|
|
|
|
<div class="grid-floor">
|
|
<svg class="grid-svg" viewBox="0 0 1280 400" preserveAspectRatio="none" xmlns="http://www.w3.org/2000/svg">
|
|
<g style="stroke: var(--deco-stroke);" stroke-width="1" fill="none">
|
|
<line x1="640" y1="0" x2="0" y2="400"/>
|
|
<line x1="640" y1="0" x2="128" y2="400"/>
|
|
<line x1="640" y1="0" x2="256" y2="400"/>
|
|
<line x1="640" y1="0" x2="384" y2="400"/>
|
|
<line x1="640" y1="0" x2="512" y2="400"/>
|
|
<line x1="640" y1="0" x2="640" y2="400"/>
|
|
<line x1="640" y1="0" x2="768" y2="400"/>
|
|
<line x1="640" y1="0" x2="896" y2="400"/>
|
|
<line x1="640" y1="0" x2="1024" y2="400"/>
|
|
<line x1="640" y1="0" x2="1152" y2="400"/>
|
|
<line x1="640" y1="0" x2="1280" y2="400"/>
|
|
<line x1="0" y1="80" x2="1280" y2="80"/>
|
|
<line x1="0" y1="160" x2="1280" y2="160"/>
|
|
<line x1="0" y1="240" x2="1280" y2="240"/>
|
|
<line x1="0" y1="320" x2="1280" y2="320"/>
|
|
<line x1="0" y1="390" x2="1280" y2="390"/>
|
|
</g>
|
|
</svg>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="ticker-wrap" aria-hidden="true">
|
|
<div class="ticker-track">
|
|
<span class="ticker-unit">COMING SOON <span class="ticker-star">✳</span></span>
|
|
<span class="ticker-unit">COMING SOON <span class="ticker-star">✳</span></span>
|
|
<span class="ticker-unit">COMING SOON <span class="ticker-star">✳</span></span>
|
|
<span class="ticker-unit">COMING SOON <span class="ticker-star">✳</span></span>
|
|
<span class="ticker-unit">COMING SOON <span class="ticker-star">✳</span></span>
|
|
<span class="ticker-unit">COMING SOON <span class="ticker-star">✳</span></span>
|
|
<span class="ticker-unit">COMING SOON <span class="ticker-star">✳</span></span>
|
|
<span class="ticker-unit">COMING SOON <span class="ticker-star">✳</span></span>
|
|
<span class="ticker-unit">COMING SOON <span class="ticker-star">✳</span></span>
|
|
<span class="ticker-unit">COMING SOON <span class="ticker-star">✳</span></span>
|
|
<span class="ticker-unit">COMING SOON <span class="ticker-star">✳</span></span>
|
|
<span class="ticker-unit">COMING SOON <span class="ticker-star">✳</span></span>
|
|
<span class="ticker-unit">COMING SOON <span class="ticker-star">✳</span></span>
|
|
<span class="ticker-unit">COMING SOON <span class="ticker-star">✳</span></span>
|
|
<span class="ticker-unit">COMING SOON <span class="ticker-star">✳</span></span>
|
|
<span class="ticker-unit">COMING SOON <span class="ticker-star">✳</span></span>
|
|
<span class="ticker-unit">COMING SOON <span class="ticker-star">✳</span></span>
|
|
<span class="ticker-unit">COMING SOON <span class="ticker-star">✳</span></span>
|
|
<span class="ticker-unit">COMING SOON <span class="ticker-star">✳</span></span>
|
|
<span class="ticker-unit">COMING SOON <span class="ticker-star">✳</span></span>
|
|
<span class="ticker-unit">COMING SOON <span class="ticker-star">✳</span></span>
|
|
<span class="ticker-unit">COMING SOON <span class="ticker-star">✳</span></span>
|
|
<span class="ticker-unit">COMING SOON <span class="ticker-star">✳</span></span>
|
|
<span class="ticker-unit">COMING SOON <span class="ticker-star">✳</span></span>
|
|
</div>
|
|
</div>
|
|
|
|
<script>
|
|
document.getElementById('waitlist-form').addEventListener('submit', function(e) {
|
|
e.preventDefault();
|
|
if (!this.checkValidity()) {
|
|
this.reportValidity();
|
|
return;
|
|
}
|
|
this.style.display = 'none';
|
|
document.getElementById('success-msg').classList.add('visible');
|
|
});
|
|
</script>
|
|
</body>
|
|
</html>
|