Refresh product docs and observation freshness
This commit is contained in:
@@ -19,8 +19,8 @@ export function createAccountCopy(isEn: boolean): Record<string, string> {
|
||||
weatherEngine: isEn ? "Weather Engine" : "气象引擎",
|
||||
intradayAnalysis: isEn ? "Intraday Analysis" : "今日内分析",
|
||||
historyFuture: isEn
|
||||
? "Future-date + Decision Card Analysis"
|
||||
: "未来日期分析 + 城市决策卡",
|
||||
? "Future-date + Multi-city Chart Monitoring"
|
||||
: "未来日期分析 + 多城市图表巡检",
|
||||
smartPush: isEn
|
||||
? "Cross-platform Smart Weather Push"
|
||||
: "全平台智能气象查询",
|
||||
|
||||
@@ -12,6 +12,7 @@ const OBSERVATION_LABEL_EN: Record<string, string> = {
|
||||
"CWA (10分钟)": "CWA (10m)",
|
||||
"气象站实测": "Weather Station Live",
|
||||
"跑道实测 (1分钟)": "Runway Live (1m)",
|
||||
"跑道实测 (3分钟)": "Runway Live (3m)",
|
||||
"机场报文": "Airport METAR",
|
||||
"METAR 结算 (30分钟)": "METAR Settlement (30m)",
|
||||
};
|
||||
|
||||
@@ -1,4 +1,6 @@
|
||||
import { getDocsPage } from "@/content/docs/docs";
|
||||
import { DOCS_PAGES } from "@/content/docs/docs";
|
||||
import { DOCS_GROUPS } from "@/content/docs/docs.config";
|
||||
|
||||
function assert(condition: unknown, message: string): asserts condition {
|
||||
if (!condition) throw new Error(message);
|
||||
@@ -24,16 +26,42 @@ function pageText(slug: string, locale: "zh-CN" | "en-US") {
|
||||
}
|
||||
|
||||
export function runTests() {
|
||||
const publicDocSlugs = DOCS_PAGES.map((page) => page.slug);
|
||||
assert(
|
||||
publicDocSlugs.join(",") === "intro,chart-guide,realtime-sources,settlement-sources,extension",
|
||||
"public docs navigation should only expose current shipped user-facing surfaces",
|
||||
);
|
||||
for (const group of DOCS_GROUPS) {
|
||||
assert(
|
||||
DOCS_PAGES.some((page) => page.group === group.id),
|
||||
`docs navigation group should not be empty: ${group.id}`,
|
||||
);
|
||||
}
|
||||
|
||||
const allDocsZh = publicDocSlugs.map((slug) => pageText(slug, "zh-CN")).join("\n");
|
||||
const allDocsEn = publicDocSlugs.map((slug) => pageText(slug, "en-US")).join("\n");
|
||||
for (const staleTerm of ["从地图进入", "机会榜", "日历", "EMOS", "LGBM", "城市决策卡", "付费判断台", "刷新锁"]) {
|
||||
assert(!allDocsZh.includes(staleTerm), `public Chinese docs should not expose stale term: ${staleTerm}`);
|
||||
}
|
||||
for (const staleTerm of ["map-launched", "opportunity board", "calendar", "EMOS", "LGBM", "city decision card", "paid decision workspace", "refresh lock"]) {
|
||||
assert(!allDocsEn.includes(staleTerm), `public English docs should not expose stale term: ${staleTerm}`);
|
||||
}
|
||||
|
||||
const introZh = pageText("intro", "zh-CN");
|
||||
assert(
|
||||
introZh.includes("结算源优先") && introZh.includes("实时实测终端"),
|
||||
"intro should position PolyWeather as a settlement-source-first live terminal",
|
||||
introZh.includes("结算源优先") && introZh.includes("天气决策台"),
|
||||
"intro should position PolyWeather as a settlement-source-first decision terminal",
|
||||
);
|
||||
assert(
|
||||
introZh.includes("1-9 个图表槽位") && introZh.includes("天气决策 / 训练数据 / 使用指南"),
|
||||
"intro should match the current terminal navigation and chart-slot workflow",
|
||||
);
|
||||
|
||||
const chartGuideZh = pageText("chart-guide", "zh-CN");
|
||||
assert(chartGuideZh.includes("如何读 PolyWeather 图表"), "chart guide title should be present");
|
||||
assert(chartGuideZh.includes("高级气象变量") && chartGuideZh.includes("默认隐藏"), "chart guide should explain advanced variables as hidden-by-default context");
|
||||
assert(chartGuideZh.includes("不要把概率温度带当成实测曲线"), "chart guide should warn against reading probability as observation");
|
||||
assert(chartGuideZh.includes("高温 / 全天"), "chart guide should document the current chart view modes");
|
||||
|
||||
const realtimeSourcesZh = pageText("realtime-sources", "zh-CN");
|
||||
assert(realtimeSourcesZh.includes("AMSC 180s"), "realtime sources should document the AMSC 180s cadence");
|
||||
@@ -54,4 +82,5 @@ export function runTests() {
|
||||
const chartGuideEn = pageText("chart-guide", "en-US");
|
||||
assert(chartGuideEn.includes("How To Read PolyWeather Charts"), "English chart guide should exist");
|
||||
assert(chartGuideEn.includes("hidden by default"), "English chart guide should describe hidden-by-default advanced variables");
|
||||
assert(chartGuideEn.includes("Peak / All Day"), "English chart guide should document the current chart view modes");
|
||||
}
|
||||
|
||||
@@ -28,6 +28,7 @@ export function runTests() {
|
||||
const now = new Date("2026-05-14T12:00:00Z");
|
||||
|
||||
assert.equal(getObservationSourceProfile("amos").nativeUpdateIntervalSec, 60);
|
||||
assert.equal(getObservationSourceProfile("amsc_awos").nativeUpdateIntervalSec, 180);
|
||||
assert.equal(getObservationSourceProfile("metar").nativeUpdateIntervalSec, 900);
|
||||
|
||||
const amosFresh = buildObservationFreshness({
|
||||
@@ -109,4 +110,28 @@ export function runTests() {
|
||||
},
|
||||
});
|
||||
assert.equal(getObservationFreshness(amosDetail)?.source_code, "amos");
|
||||
|
||||
const amscDetail = detail({
|
||||
amos: {
|
||||
observation_time: "2026-05-14T11:57:20Z",
|
||||
runway_obs: {
|
||||
runway_pairs: [["35R", "17L"]],
|
||||
temperatures: [[25.2, null]],
|
||||
},
|
||||
source: "amsc_awos",
|
||||
source_label: "AMSC AWOS",
|
||||
},
|
||||
});
|
||||
const amscFreshness = getObservationFreshness(amscDetail);
|
||||
assert.equal(amscFreshness?.source_code, "amsc_awos");
|
||||
assert.equal(amscFreshness?.native_update_interval_sec, 180);
|
||||
|
||||
const amscExpectedWait = buildObservationFreshness({
|
||||
now,
|
||||
observedAt: "2026-05-14T11:56:40Z",
|
||||
sourceCode: "amsc_awos",
|
||||
sourceLabel: "AMSC AWOS",
|
||||
});
|
||||
assert.equal(amscExpectedWait.native_update_interval_sec, 180);
|
||||
assert.equal(amscExpectedWait.freshness_status, "expected_wait");
|
||||
}
|
||||
|
||||
+23
@@ -1170,6 +1170,29 @@ export function runTests() {
|
||||
"Panama City high label should use airport METAR report wording, not weather-station or runway wording",
|
||||
);
|
||||
|
||||
const shanghaiLabels = __getLiveObservationLabelsForTest(
|
||||
{
|
||||
city: "shanghai",
|
||||
local_date: "2026-06-06",
|
||||
local_time: "21:03",
|
||||
tz_offset_seconds: 8 * 60 * 60,
|
||||
} as any,
|
||||
{
|
||||
amos: {
|
||||
source: "amsc_awos",
|
||||
source_label: "AMSC AWOS",
|
||||
},
|
||||
airportPrimary: {
|
||||
source_code: "amsc_awos",
|
||||
source_label: "AMSC AWOS",
|
||||
},
|
||||
} as any,
|
||||
);
|
||||
assert(
|
||||
shanghaiLabels.runwayHeaderLabel === "跑道实测 (3分钟)",
|
||||
"AMSC runway cities should advertise the 3-minute source cadence instead of the AMOS 1-minute cadence",
|
||||
);
|
||||
|
||||
const newYorkWithMadis = __buildTemperatureChartDataForTest(
|
||||
{
|
||||
city: "new york",
|
||||
|
||||
@@ -36,6 +36,18 @@ export function runTests() {
|
||||
assert(shenzhen.runwayHigh === "HKO Live", "Shenzhen high summary should translate 天文台实测");
|
||||
assert(shenzhen.metarHigh === "HKO", "Shenzhen high summary should translate 天文台");
|
||||
|
||||
const shanghai = __buildTemperatureStatsLabelsForTest({
|
||||
isEn: true,
|
||||
isShenzhen: false,
|
||||
runwayHeaderLabel: "跑道实测 (3分钟)",
|
||||
metarHeaderLabel: "METAR 结算 (30分钟)",
|
||||
runwayHighLabel: "跑道实测",
|
||||
metarHighLabel: "METAR 官方",
|
||||
});
|
||||
|
||||
assert(shanghai.primary === "Runway Live (3m)", "AMSC English primary label should match 跑道实测 (3分钟)");
|
||||
assert(shanghai.runwayHigh === "Runway", "AMSC runway high label should remain Runway");
|
||||
|
||||
const zh = __buildTemperatureStatsLabelsForTest({
|
||||
isEn: false,
|
||||
isShenzhen: true,
|
||||
|
||||
@@ -16,6 +16,10 @@ const ROLLING_WINDOW_BEFORE_MS = 12 * 60 * 60 * 1000;
|
||||
const ROLLING_WINDOW_AFTER_LIVE_MS = 2 * 60 * 60 * 1000;
|
||||
const ROLLING_WINDOW_AFTER_FORECAST_MS = 8 * 60 * 60 * 1000;
|
||||
const DAY_MS = 24 * 60 * 60 * 1000;
|
||||
const AMSC_RUNWAY_CITIES = new Set([
|
||||
"beijing", "shanghai", "guangzhou", "qingdao",
|
||||
"chengdu", "chongqing", "wuhan",
|
||||
]);
|
||||
|
||||
const SETTLEMENT_RUNWAY_PAIRS: Record<string, Array<[string, string]>> = {
|
||||
shanghai: [["17L", "35R"]],
|
||||
@@ -1298,6 +1302,9 @@ function getLiveObservationLabels(
|
||||
weatherStationCities.has(normalizedKey) ||
|
||||
/\b(mgm|turkey_mgm|jma_amedas|fmi|knmi|cowin_obs|ims|ncm|aeroweb|madis_hfmetar|singapore_mss)\b/.test(sourceTokens);
|
||||
const isRunwaySensorCity = runwaySensorCities.has(normalizedKey);
|
||||
const isAmscRunwayCity =
|
||||
AMSC_RUNWAY_CITIES.has(normalizedKey) ||
|
||||
/\bamsc(?:_awos)?\b|\bawos\b/.test(sourceTokens);
|
||||
const isWeatherStation = !runwaySensorCities.has(normalizedKey)
|
||||
&& !isHKO && !isShenzhen && !isTokyo && !isSingapore && !isParis && !isTaipei
|
||||
&& hasRealStationNetwork;
|
||||
@@ -1309,7 +1316,7 @@ function getLiveObservationLabels(
|
||||
: isParis ? "官方机场观测 (15分钟)"
|
||||
: isTaipei ? "CWA (10分钟)"
|
||||
: isWeatherStation ? "气象站实测"
|
||||
: isRunwaySensorCity ? "跑道实测 (1分钟)"
|
||||
: isRunwaySensorCity ? `跑道实测 (${isAmscRunwayCity ? "3分钟" : "1分钟"})`
|
||||
: "机场报文";
|
||||
|
||||
const metarHeaderLabel = (isShenzhen || isHKO) ? "天文台实测 (10分钟)"
|
||||
|
||||
@@ -1,8 +1,10 @@
|
||||
.docsShell {
|
||||
min-height: 100vh;
|
||||
background:
|
||||
linear-gradient(180deg, #f8fbff 0%, #eef4fb 100%);
|
||||
color: #0f172a;
|
||||
linear-gradient(90deg, rgba(216, 224, 236, 0.38) 1px, transparent 1px),
|
||||
linear-gradient(180deg, #f8fbff 0%, #eef4fb 54%, #f5f8fc 100%);
|
||||
background-size: 44px 44px, auto;
|
||||
color: var(--color-text-primary, #0f172a);
|
||||
}
|
||||
|
||||
.docsHeader {
|
||||
@@ -12,35 +14,44 @@
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
gap: 16px;
|
||||
padding: 16px 24px;
|
||||
background: rgba(255, 255, 255, 0.94);
|
||||
border-bottom: 1px solid #d9e3ef;
|
||||
gap: 18px;
|
||||
min-height: 58px;
|
||||
padding: 10px 24px;
|
||||
border-bottom: 1px solid rgba(184, 196, 214, 0.74);
|
||||
background: rgba(255, 255, 255, 0.9);
|
||||
box-shadow: 0 1px 0 rgba(15, 23, 42, 0.04);
|
||||
backdrop-filter: blur(14px);
|
||||
backdrop-filter: blur(16px);
|
||||
}
|
||||
|
||||
.brandWrap {
|
||||
display: flex;
|
||||
align-items: baseline;
|
||||
gap: 12px;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.brandLink {
|
||||
color: #0891b2;
|
||||
font-size: 1.55rem;
|
||||
font-weight: 800;
|
||||
color: #0f172a;
|
||||
font-size: 1.24rem;
|
||||
font-weight: 850;
|
||||
letter-spacing: 0;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.brandLink::first-letter {
|
||||
color: var(--color-accent-primary, #2563eb);
|
||||
}
|
||||
|
||||
.brandSubtitle {
|
||||
color: #64748b;
|
||||
font-size: 0.92rem;
|
||||
font-size: 0.88rem;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.headerActions {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
@@ -49,101 +60,121 @@
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 8px;
|
||||
min-height: 38px;
|
||||
padding: 0 14px;
|
||||
border-radius: 999px;
|
||||
border: 1px solid #cbd5e1;
|
||||
background: #ffffff;
|
||||
color: #334155;
|
||||
padding: 0 13px;
|
||||
border: 1px solid var(--color-border-default, #d8e0ec);
|
||||
border-radius: 10px;
|
||||
background: var(--color-bg-raised, #ffffff);
|
||||
color: #1e293b;
|
||||
text-decoration: none;
|
||||
font-size: 0.92rem;
|
||||
font-weight: 700;
|
||||
font-size: 0.9rem;
|
||||
font-weight: 800;
|
||||
cursor: pointer;
|
||||
transition:
|
||||
border-color 160ms ease,
|
||||
color 160ms ease,
|
||||
background 160ms ease;
|
||||
background 160ms ease,
|
||||
box-shadow 160ms ease;
|
||||
}
|
||||
|
||||
.headerButton:hover,
|
||||
.headerGhost:hover {
|
||||
border-color: #38bdf8;
|
||||
color: #075985;
|
||||
background: #f0f9ff;
|
||||
border-color: #93c5fd;
|
||||
color: #1d4ed8;
|
||||
background: #eff6ff;
|
||||
box-shadow: 0 8px 18px rgba(37, 99, 235, 0.1);
|
||||
}
|
||||
|
||||
.headerGhost svg,
|
||||
.mobileMenuButton svg {
|
||||
flex: 0 0 auto;
|
||||
}
|
||||
|
||||
.langSwitch {
|
||||
display: flex;
|
||||
border: 1px solid #cbd5e1;
|
||||
border-radius: 999px;
|
||||
overflow: hidden;
|
||||
background: #ffffff;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 3px;
|
||||
padding: 3px;
|
||||
border: 1px solid var(--color-border-default, #d8e0ec);
|
||||
border-radius: 10px;
|
||||
background: #e8edf5;
|
||||
}
|
||||
|
||||
.langButton {
|
||||
min-width: 54px;
|
||||
min-height: 38px;
|
||||
min-width: 48px;
|
||||
min-height: 32px;
|
||||
padding: 0 9px;
|
||||
border: 0;
|
||||
border-radius: 8px;
|
||||
background: transparent;
|
||||
color: #64748b;
|
||||
font-weight: 800;
|
||||
font-size: 0.82rem;
|
||||
font-weight: 850;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.langButtonActive {
|
||||
background: #e0f2fe;
|
||||
color: #0369a1;
|
||||
background: #ffffff;
|
||||
color: #0f172a;
|
||||
box-shadow: 0 1px 2px rgba(15, 23, 42, 0.08);
|
||||
}
|
||||
|
||||
.docsFrame {
|
||||
display: grid;
|
||||
grid-template-columns: 260px minmax(0, 820px) 220px;
|
||||
grid-template-columns: 268px minmax(0, 850px) 226px;
|
||||
justify-content: center;
|
||||
gap: 28px;
|
||||
gap: 24px;
|
||||
width: 100%;
|
||||
max-width: 1440px;
|
||||
max-width: 1480px;
|
||||
margin: 0 auto;
|
||||
padding: 24px;
|
||||
padding: 28px 24px 68px;
|
||||
}
|
||||
|
||||
.sidebar {
|
||||
position: sticky;
|
||||
top: 84px;
|
||||
top: 82px;
|
||||
align-self: start;
|
||||
max-height: calc(100vh - 108px);
|
||||
max-height: calc(100vh - 106px);
|
||||
overflow: auto;
|
||||
padding: 16px;
|
||||
border: 1px solid #d8e3ef;
|
||||
border-radius: 16px;
|
||||
padding: 14px;
|
||||
border: 1px solid rgba(184, 196, 214, 0.72);
|
||||
border-radius: 10px;
|
||||
background: #ffffff;
|
||||
box-shadow: 0 12px 32px rgba(15, 23, 42, 0.06);
|
||||
box-shadow: var(--shadow-elevation-2, 0 8px 24px rgba(15, 23, 42, 0.06));
|
||||
}
|
||||
|
||||
.sidebarGroup + .sidebarGroup {
|
||||
margin-top: 22px;
|
||||
margin-top: 18px;
|
||||
padding-top: 18px;
|
||||
border-top: 1px solid #e8edf5;
|
||||
}
|
||||
|
||||
.sidebarTitle {
|
||||
margin: 0 0 8px;
|
||||
padding: 0 8px;
|
||||
color: #64748b;
|
||||
font-size: 0.78rem;
|
||||
font-weight: 800;
|
||||
font-size: 0.74rem;
|
||||
font-weight: 850;
|
||||
letter-spacing: 0.06em;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.sidebarLink {
|
||||
position: relative;
|
||||
display: block;
|
||||
margin-bottom: 4px;
|
||||
padding: 9px 10px;
|
||||
margin-bottom: 3px;
|
||||
padding: 9px 10px 9px 14px;
|
||||
border-radius: 8px;
|
||||
color: #334155;
|
||||
text-decoration: none;
|
||||
font-size: 0.94rem;
|
||||
font-size: 0.92rem;
|
||||
font-weight: 650;
|
||||
line-height: 1.35;
|
||||
transition:
|
||||
background 160ms ease,
|
||||
color 160ms ease;
|
||||
color 160ms ease,
|
||||
box-shadow 160ms ease;
|
||||
}
|
||||
|
||||
.sidebarLink:hover {
|
||||
@@ -152,9 +183,10 @@
|
||||
}
|
||||
|
||||
.sidebarLinkActive {
|
||||
background: #e0f2fe;
|
||||
color: #0369a1;
|
||||
font-weight: 800;
|
||||
background: #eff6ff;
|
||||
color: #1d4ed8;
|
||||
font-weight: 850;
|
||||
box-shadow: inset 3px 0 0 var(--color-accent-primary, #2563eb);
|
||||
}
|
||||
|
||||
.content {
|
||||
@@ -162,39 +194,106 @@
|
||||
}
|
||||
|
||||
.contentInner {
|
||||
padding: 16px 0 56px;
|
||||
padding: 0 0 52px;
|
||||
}
|
||||
|
||||
.pageIntro {
|
||||
padding: 28px 30px;
|
||||
border: 1px solid rgba(184, 196, 214, 0.72);
|
||||
border-radius: 12px;
|
||||
background:
|
||||
linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(248, 251, 255, 0.96));
|
||||
box-shadow: var(--shadow-elevation-2, 0 8px 24px rgba(15, 23, 42, 0.06));
|
||||
}
|
||||
|
||||
.introKicker {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
margin: 0 0 14px;
|
||||
color: #047857;
|
||||
font-size: 0.78rem;
|
||||
font-weight: 900;
|
||||
letter-spacing: 0.04em;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.introKicker svg {
|
||||
color: #00897b;
|
||||
}
|
||||
|
||||
.pageTitle {
|
||||
margin: 0;
|
||||
color: #0f172a;
|
||||
font-size: clamp(2rem, 4vw, 3.05rem);
|
||||
font-size: clamp(2rem, 3vw, 2.72rem);
|
||||
font-weight: 850;
|
||||
line-height: 1.12;
|
||||
letter-spacing: 0;
|
||||
line-height: 1.1;
|
||||
}
|
||||
|
||||
.pageDescription {
|
||||
max-width: 760px;
|
||||
margin: 14px 0 0;
|
||||
color: #475569;
|
||||
font-size: 1.03rem;
|
||||
font-size: 1.02rem;
|
||||
line-height: 1.75;
|
||||
}
|
||||
|
||||
.pageMeta {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 8px;
|
||||
margin-top: 18px;
|
||||
}
|
||||
|
||||
.pageMeta span {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
min-height: 30px;
|
||||
padding: 0 10px;
|
||||
border: 1px solid #dbeafe;
|
||||
border-radius: 8px;
|
||||
background: #eff6ff;
|
||||
color: #1d4ed8;
|
||||
font-size: 0.78rem;
|
||||
font-weight: 850;
|
||||
}
|
||||
|
||||
.section {
|
||||
margin-top: 40px;
|
||||
scroll-margin-top: 104px;
|
||||
margin-top: 0;
|
||||
padding: 34px 2px 30px;
|
||||
border-bottom: 1px solid rgba(216, 224, 236, 0.78);
|
||||
scroll-margin-top: 92px;
|
||||
}
|
||||
|
||||
.section:last-child {
|
||||
border-bottom: 0;
|
||||
}
|
||||
|
||||
.sectionTitle {
|
||||
margin: 0 0 14px;
|
||||
color: #1e293b;
|
||||
font-size: 1.45rem;
|
||||
font-weight: 800;
|
||||
line-height: 1.25;
|
||||
position: relative;
|
||||
margin: 0 0 16px;
|
||||
padding-left: 14px;
|
||||
color: #172033;
|
||||
font-size: 1.34rem;
|
||||
font-weight: 850;
|
||||
letter-spacing: 0;
|
||||
line-height: 1.3;
|
||||
}
|
||||
|
||||
.sectionTitle::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0.16em;
|
||||
bottom: 0.16em;
|
||||
width: 4px;
|
||||
border-radius: 4px;
|
||||
background: linear-gradient(180deg, #2563eb, #00897b);
|
||||
}
|
||||
|
||||
.paragraph {
|
||||
max-width: 780px;
|
||||
margin: 0 0 15px;
|
||||
color: #334155;
|
||||
font-size: 1rem;
|
||||
@@ -202,34 +301,37 @@
|
||||
}
|
||||
|
||||
.callout {
|
||||
position: relative;
|
||||
max-width: 790px;
|
||||
margin: 20px 0;
|
||||
padding: 18px 20px;
|
||||
border: 1px solid #d8e3ef;
|
||||
border-radius: 12px;
|
||||
background: #ffffff;
|
||||
box-shadow: 0 8px 24px rgba(15, 23, 42, 0.05);
|
||||
padding: 17px 18px 17px 20px;
|
||||
border: 1px solid #d8e0ec;
|
||||
border-left-width: 4px;
|
||||
border-radius: 10px;
|
||||
background: rgba(255, 255, 255, 0.92);
|
||||
box-shadow: 0 8px 22px rgba(15, 23, 42, 0.05);
|
||||
}
|
||||
|
||||
.calloutInfo {
|
||||
border-color: #bae6fd;
|
||||
background: #f0f9ff;
|
||||
border-left-color: var(--color-accent-primary, #2563eb);
|
||||
background: #f5f9ff;
|
||||
}
|
||||
|
||||
.calloutWarning {
|
||||
border-color: #fde68a;
|
||||
background: #fffbeb;
|
||||
border-left-color: #d97706;
|
||||
background: #fffaf0;
|
||||
}
|
||||
|
||||
.calloutSuccess {
|
||||
border-color: #bbf7d0;
|
||||
background: #f0fdf4;
|
||||
border-left-color: #00897b;
|
||||
background: #f0fdfa;
|
||||
}
|
||||
|
||||
.calloutTitle {
|
||||
margin: 0 0 8px;
|
||||
margin: 0 0 7px;
|
||||
color: #0f172a;
|
||||
font-size: 0.98rem;
|
||||
font-weight: 800;
|
||||
font-weight: 850;
|
||||
}
|
||||
|
||||
.calloutText {
|
||||
@@ -239,14 +341,68 @@
|
||||
}
|
||||
|
||||
.list {
|
||||
margin: 0 0 16px;
|
||||
padding-left: 22px;
|
||||
max-width: 800px;
|
||||
margin: 0 0 18px;
|
||||
padding: 0;
|
||||
color: #334155;
|
||||
line-height: 1.8;
|
||||
line-height: 1.75;
|
||||
}
|
||||
|
||||
.list li + li {
|
||||
margin-top: 8px;
|
||||
margin-top: 9px;
|
||||
}
|
||||
|
||||
.bulletList {
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
.bulletList li {
|
||||
position: relative;
|
||||
padding-left: 22px;
|
||||
}
|
||||
|
||||
.bulletList li::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
left: 3px;
|
||||
top: 0.72em;
|
||||
width: 7px;
|
||||
height: 7px;
|
||||
border-radius: 999px;
|
||||
background: #00897b;
|
||||
box-shadow: 0 0 0 4px rgba(0, 137, 123, 0.1);
|
||||
}
|
||||
|
||||
.stepList {
|
||||
list-style: none;
|
||||
counter-reset: docs-step;
|
||||
}
|
||||
|
||||
.stepList li {
|
||||
counter-increment: docs-step;
|
||||
display: grid;
|
||||
grid-template-columns: 32px minmax(0, 1fr);
|
||||
gap: 12px;
|
||||
align-items: start;
|
||||
padding: 12px 14px;
|
||||
border: 1px solid rgba(216, 224, 236, 0.88);
|
||||
border-radius: 10px;
|
||||
background: rgba(255, 255, 255, 0.72);
|
||||
}
|
||||
|
||||
.stepList li::before {
|
||||
content: counter(docs-step);
|
||||
width: 28px;
|
||||
height: 28px;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border-radius: 8px;
|
||||
background: #0f172a;
|
||||
color: #ffffff;
|
||||
font-size: 0.76rem;
|
||||
font-weight: 900;
|
||||
font-variant-numeric: tabular-nums;
|
||||
}
|
||||
|
||||
.linkCard {
|
||||
@@ -254,17 +410,24 @@
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
min-height: 42px;
|
||||
padding: 0 16px;
|
||||
border-radius: 999px;
|
||||
border: 1px solid #38bdf8;
|
||||
background: #e0f2fe;
|
||||
color: #0369a1;
|
||||
padding: 0 15px;
|
||||
border: 1px solid #93c5fd;
|
||||
border-radius: 10px;
|
||||
background: #eff6ff;
|
||||
color: #1d4ed8;
|
||||
text-decoration: none;
|
||||
font-weight: 800;
|
||||
font-weight: 850;
|
||||
}
|
||||
|
||||
.linkCard::after {
|
||||
content: "->";
|
||||
margin-left: 8px;
|
||||
font-family: var(--font-mono, monospace);
|
||||
}
|
||||
|
||||
.linkCard:hover {
|
||||
background: #bae6fd;
|
||||
border-color: #60a5fa;
|
||||
background: #dbeafe;
|
||||
}
|
||||
|
||||
.linkCaption {
|
||||
@@ -273,42 +436,65 @@
|
||||
line-height: 1.7;
|
||||
}
|
||||
|
||||
.content figure {
|
||||
max-width: 800px;
|
||||
margin: 22px 0;
|
||||
}
|
||||
|
||||
.content img {
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: auto;
|
||||
border: 1px solid #d8e0ec;
|
||||
border-radius: 10px;
|
||||
background: #ffffff;
|
||||
}
|
||||
|
||||
.content figcaption {
|
||||
margin-top: 9px;
|
||||
color: #64748b;
|
||||
font-size: 0.9rem;
|
||||
line-height: 1.6;
|
||||
}
|
||||
|
||||
.toc {
|
||||
position: sticky;
|
||||
top: 84px;
|
||||
top: 82px;
|
||||
align-self: start;
|
||||
padding: 16px;
|
||||
border: 1px solid #d8e3ef;
|
||||
border-radius: 16px;
|
||||
padding: 14px;
|
||||
border: 1px solid rgba(184, 196, 214, 0.72);
|
||||
border-radius: 10px;
|
||||
background: #ffffff;
|
||||
box-shadow: 0 12px 32px rgba(15, 23, 42, 0.06);
|
||||
box-shadow: var(--shadow-elevation-1, 0 1px 3px rgba(15, 23, 42, 0.05));
|
||||
}
|
||||
|
||||
.tocTitle {
|
||||
margin: 0 0 10px;
|
||||
color: #64748b;
|
||||
font-size: 0.78rem;
|
||||
font-weight: 800;
|
||||
font-size: 0.74rem;
|
||||
font-weight: 850;
|
||||
letter-spacing: 0.06em;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.tocLink {
|
||||
display: block;
|
||||
padding: 5px 0;
|
||||
padding: 7px 0 7px 12px;
|
||||
border-left: 2px solid #e8edf5;
|
||||
color: #475569;
|
||||
text-decoration: none;
|
||||
line-height: 1.55;
|
||||
font-size: 0.92rem;
|
||||
line-height: 1.45;
|
||||
font-size: 0.88rem;
|
||||
}
|
||||
|
||||
.tocLink:hover {
|
||||
color: #0369a1;
|
||||
border-left-color: #2563eb;
|
||||
color: #1d4ed8;
|
||||
}
|
||||
|
||||
.mobileMenuButton {
|
||||
display: none;
|
||||
margin-bottom: 18px;
|
||||
margin-bottom: 14px;
|
||||
}
|
||||
|
||||
.mobileSidebarBackdrop {
|
||||
@@ -317,7 +503,7 @@
|
||||
|
||||
@media (max-width: 1200px) {
|
||||
.docsFrame {
|
||||
grid-template-columns: 240px minmax(0, 820px);
|
||||
grid-template-columns: 248px minmax(0, 850px);
|
||||
justify-content: start;
|
||||
}
|
||||
|
||||
@@ -330,10 +516,12 @@
|
||||
.docsHeader {
|
||||
align-items: flex-start;
|
||||
flex-direction: column;
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
.docsFrame {
|
||||
grid-template-columns: minmax(0, 1fr);
|
||||
padding-top: 18px;
|
||||
}
|
||||
|
||||
.mobileMenuButton {
|
||||
@@ -345,10 +533,12 @@
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 60;
|
||||
width: min(320px, 88vw);
|
||||
width: min(326px, 88vw);
|
||||
height: 100vh;
|
||||
height: 100dvh;
|
||||
max-height: none;
|
||||
border-radius: 0 16px 16px 0;
|
||||
padding: 18px 14px;
|
||||
border-radius: 0 10px 10px 0;
|
||||
transform: translateX(-100%);
|
||||
transition: transform 180ms ease-out;
|
||||
}
|
||||
@@ -361,37 +551,65 @@
|
||||
position: fixed;
|
||||
inset: 0;
|
||||
z-index: 50;
|
||||
background: rgba(15, 23, 42, 0.48);
|
||||
display: block;
|
||||
border: 0;
|
||||
background: rgba(15, 23, 42, 0.48);
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 640px) {
|
||||
.docsHeader {
|
||||
padding: 14px 16px;
|
||||
}
|
||||
|
||||
.docsFrame {
|
||||
padding: 16px;
|
||||
padding: 12px 14px;
|
||||
}
|
||||
|
||||
.brandWrap {
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
gap: 4px;
|
||||
gap: 2px;
|
||||
}
|
||||
|
||||
.brandSubtitle {
|
||||
white-space: normal;
|
||||
}
|
||||
|
||||
.headerActions {
|
||||
width: 100%;
|
||||
align-items: stretch;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.headerGhost,
|
||||
.langSwitch {
|
||||
flex: 1 1 auto;
|
||||
}
|
||||
|
||||
.langSwitch {
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.docsFrame {
|
||||
padding: 14px 14px 48px;
|
||||
}
|
||||
|
||||
.pageIntro {
|
||||
padding: 22px 18px;
|
||||
}
|
||||
|
||||
.pageTitle {
|
||||
font-size: 2rem;
|
||||
font-size: 1.9rem;
|
||||
}
|
||||
|
||||
.pageDescription,
|
||||
.paragraph {
|
||||
font-size: 1rem;
|
||||
font-size: 0.98rem;
|
||||
}
|
||||
|
||||
.section {
|
||||
padding: 28px 0 26px;
|
||||
}
|
||||
|
||||
.stepList li {
|
||||
grid-template-columns: 30px minmax(0, 1fr);
|
||||
padding: 11px 12px;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -4,6 +4,7 @@ import Link from "next/link";
|
||||
import { useMemo, useState } from "react";
|
||||
import { usePathname } from "next/navigation";
|
||||
import clsx from "clsx";
|
||||
import { ArrowLeft, BookOpen, Menu } from "lucide-react";
|
||||
import styles from "./DocsLayout.module.css";
|
||||
import {
|
||||
DocsLocale,
|
||||
@@ -30,6 +31,7 @@ function DocsHeader() {
|
||||
|
||||
<div className={styles.headerActions}>
|
||||
<Link href="/" className={styles.headerGhost}>
|
||||
<ArrowLeft size={16} aria-hidden="true" />
|
||||
{locale === "zh-CN" ? "返回主站" : "Back to App"}
|
||||
</Link>
|
||||
<div className={styles.langSwitch} role="group" aria-label="Language switch">
|
||||
@@ -81,6 +83,7 @@ function DocsSidebar({
|
||||
key={page.slug}
|
||||
href={href}
|
||||
className={clsx(styles.sidebarLink, currentSlug === page.slug && styles.sidebarLinkActive)}
|
||||
aria-current={currentSlug === page.slug ? "page" : undefined}
|
||||
onClick={onClose}
|
||||
>
|
||||
{title}
|
||||
@@ -114,20 +117,30 @@ function BlockRenderer({ block }: { block: DocsPageContent["sections"][number]["
|
||||
return <p className={styles.paragraph}>{block.text}</p>;
|
||||
case "callout":
|
||||
return (
|
||||
<div className={clsx(styles.callout, block.tone === "warning" && styles.calloutWarning, block.tone === "success" && styles.calloutSuccess, (!block.tone || block.tone === "info") && styles.calloutInfo)}>
|
||||
<div
|
||||
className={clsx(styles.callout, block.tone === "warning" && styles.calloutWarning, block.tone === "success" && styles.calloutSuccess, (!block.tone || block.tone === "info") && styles.calloutInfo)}
|
||||
role="note"
|
||||
>
|
||||
{block.title ? <div className={styles.calloutTitle}>{block.title}</div> : null}
|
||||
<p className={styles.calloutText}>{block.text}</p>
|
||||
</div>
|
||||
);
|
||||
case "bullets":
|
||||
case "steps":
|
||||
return (
|
||||
<ul className={styles.list}>
|
||||
<ul className={clsx(styles.list, styles.bulletList)}>
|
||||
{block.items.map((item) => (
|
||||
<li key={item}>{item}</li>
|
||||
))}
|
||||
</ul>
|
||||
);
|
||||
case "steps":
|
||||
return (
|
||||
<ol className={clsx(styles.list, styles.stepList)}>
|
||||
{block.items.map((item) => (
|
||||
<li key={item}>{item}</li>
|
||||
))}
|
||||
</ol>
|
||||
);
|
||||
case "link":
|
||||
return (
|
||||
<div>
|
||||
@@ -175,10 +188,22 @@ export function DocsScreen({ page }: { page: DocsPage }) {
|
||||
<main className={styles.content}>
|
||||
<div className={styles.contentInner}>
|
||||
<button type="button" className={clsx(styles.headerButton, styles.mobileMenuButton)} onClick={() => setMobileSidebarOpen(true)}>
|
||||
{locale === "zh-CN" ? "打开导航" : "Open navigation"}
|
||||
<Menu size={16} aria-hidden="true" />
|
||||
{locale === "zh-CN" ? "目录" : "Contents"}
|
||||
</button>
|
||||
<h1 className={styles.pageTitle}>{localizedPage.title}</h1>
|
||||
<p className={styles.pageDescription}>{localizedPage.description}</p>
|
||||
<div className={styles.pageIntro}>
|
||||
<div className={styles.introKicker}>
|
||||
<BookOpen size={16} aria-hidden="true" />
|
||||
{locale === "zh-CN" ? "PolyWeather 产品手册" : "PolyWeather Product Manual"}
|
||||
</div>
|
||||
<h1 className={styles.pageTitle}>{localizedPage.title}</h1>
|
||||
<p className={styles.pageDescription}>{localizedPage.description}</p>
|
||||
<div className={styles.pageMeta} aria-label={locale === "zh-CN" ? "文档范围" : "Document scope"}>
|
||||
<span>{locale === "zh-CN" ? "当前工作台" : "Current terminal"}</span>
|
||||
<span>{locale === "zh-CN" ? `${DOCS_PAGES.length} 篇文档` : `${DOCS_PAGES.length} docs`}</span>
|
||||
<span>{locale === "zh-CN" ? `${localizedPage.sections.length} 个章节` : `${localizedPage.sections.length} sections`}</span>
|
||||
</div>
|
||||
</div>
|
||||
{localizedPage.sections.map((section) => (
|
||||
<section key={section.id} id={section.id} className={styles.section}>
|
||||
<h2 className={styles.sectionTitle}>{section.title}</h2>
|
||||
|
||||
@@ -60,13 +60,13 @@ const FEATURES = {
|
||||
"zh-CN": [
|
||||
"市场扫描台 + V4-Pro 深度复核",
|
||||
"今日日内机场报文规则分析(含高温时段)",
|
||||
"未来日期分析 + 城市决策卡",
|
||||
"多城市图表巡检 + 未来日期分析",
|
||||
"全平台智能气象推送",
|
||||
],
|
||||
"en-US": [
|
||||
"Market Scan Terminal + V4-Pro review",
|
||||
"Intraday METAR rule-based analysis with peak-time window",
|
||||
"Future-date analysis + city decision cards",
|
||||
"Multi-city chart monitoring + future-date analysis",
|
||||
"Cross-platform alerts",
|
||||
],
|
||||
};
|
||||
|
||||
Reference in New Issue
Block a user