---
import ProjectWall from '../components/geek/ProjectWall.astro';
import Heatmap from '../components/geek/Heatmap.astro';
import BaseLayout from '../layouts/BaseLayout.astro';
import GithubProfile from '../components/geek/GithubProfile.astro';
import { t } from '../i18n/ui';
import { githubReadmeMarkdown, openSourceCopy, openSourceOptions, pageTypography, renderMarkdown } from '../lib/site-content';

// 叙述文案 + 置顶名单 + 项目墙选项均改由 content/site/opensource.yaml 供给（后台可改）
const copy = await openSourceCopy('zh');
const options = await openSourceOptions();
// 开篇来源：github-readme → 构建期取 profile 仓 README（缓存 content/.github-readme.md，失败回落 yaml blurb）
const readmeMd = options.introFrom === 'github-readme' ? await githubReadmeMarkdown() : null;
const readmeHtml = readmeMd ? await renderMarkdown(readmeMd) : null;
const typo = await pageTypography('siteOpenSource', 'opensource');
---
<BaseLayout title="开源 · wait4x" description="我的开源活动：仓库、贡献与本站源码">
  <h1 class="page-title">开源<span class="count mono">Open Source</span></h1>
  <div class={typo.className || undefined} style={typo.style || undefined}>
  <GithubProfile locale="zh" />
  {/* 兼容通道（不推荐）：intro_from=github-readme 时把 profile README 原样渲染在档案卡下方。
      它会引入 7 类第三方外链图（shields.io / readme-typing-svg / stats / snake / 访客徽章）并带失效的
      align 居中；慢网或被墙时整片空白。默认 off，正常内容由上方原生档案卡 + opensource.yaml 叙述承载。 */}
  {readmeHtml && <div class="blurb readme-intro" set:html={readmeHtml} />}
  <Heatmap labels={{
    title: t('heatmap_title', 'zh'), summary: t('heatmap_summary', 'zh'),
    less: t('heatmap_less', 'zh'), more: t('heatmap_more', 'zh'), note: t('heatmap_note', 'zh'),
  }} />
  <ProjectWall limit={99} pinned={copy.pinned} options={options} />
  </div>
</BaseLayout>

<style>
  .page-title { font-size: var(--text-h1); color: var(--ink-1); display: flex; align-items: baseline; gap: var(--space-3); }
  .count { font-size: 13px; color: var(--ink-4); }
  .readme-intro :global(p) { margin-block: 0 var(--space-2); }
  .readme-intro :global(ul) { margin-block: var(--space-1) var(--space-2); padding-left: 1.2em; list-style: disc; }
  .readme-intro :global(h2), .readme-intro :global(h3) { font-size: 16px; margin: var(--space-3) 0 var(--space-1); }
  .readme-intro :global(img) { max-width: 100%; height: auto; border-radius: 8px; }
  .readme-intro :global(a) { color: var(--accent); }
  .blurb { margin-top: var(--space-3); margin-bottom: var(--space-5); font-size: 15px; color: var(--ink-2); line-height: 1.7; max-width: 640px; }
</style>