index.html

<!DOCTYPE html>
<html lang="zh-CN">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>POSC · PenOS 开放研究社区</title>
  <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
  <link rel="stylesheet" href="css/style.css">
</head>
<body>
  <nav id="navbar">
    <div class="wrap">
      <a class="logo" href="#">POSC</a>
      <ul>
        <li><a href="#about">关于</a></li>
        <li><a href="#principles">纲领</a></li>
        <li><a href="#projects">项目</a></li>
        <li><a href="./unlock.html">公开方案</a></li>
        <li><a href="#extended-services">拓展服务</a></li>
        <li><a href="#ecosystem">社区生态</a></li>
        <li><a href="#community">加入</a></li>
      </ul>
      <button id="theme-btn" aria-label="切换主题">
        <span class="material-icons" style="font-size:20px;">dark_mode</span>
      </button>
    </div>
  </nav>

  <header>
    <div class="grid-bg"></div>
    <div class="wrap">
      <span class="tag">PenOS 开放研究社区</span>
      <h1>探索词典笔的<br><span>另一种可能</span></h1>
      <p class="sub"><span id="typer"></span><span class="caret">|</span></p>
      <div class="btns">
        <a class="btn btn-p" href="#community">加入社区</a>
        <a class="btn btn-g" href="#projects">看看项目</a>
      </div>
    </div>
  </header>

  <section id="about">
    <div class="wrap">
      <h2 class="sec-h">我们在做什么</h2>
      <p class="sec-d">不是破解，是研究与再创造。</p>
      <div class="cards">
        <div class="card">
          <div class="ic"><span class="material-icons">science</span></div>
          <h3>系统研究</h3>
          <p>分析 PenOS 的系统架构与应用机制，整理文档与教程，沉淀可复用的技术知识。</p>
        </div>
        <div class="card">
          <div class="ic"><span class="material-icons">extension</span></div>
          <h3>miniapp 开发</h3>
          <p>基于官方 miniapp 框架开发第三方应用，扩展词典笔的能力边界，欢迎更多人一起参与。</p>
        </div>
        <div class="card">
          <div class="ic"><span class="material-icons">build</span></div>
          <h3>工具链</h3>
          <p>提供我们自用的逆向与调试工具，附带详细说明。工具给你，思路靠你自己。</p>
        </div>
        <div class="card">
          <div class="ic"><span class="material-icons">favorite</span></div>
          <h3>开源公益</h3>
          <p>所有成果开源共享，不盈利、不收费。海内存知己，天涯若比邻。</p>
        </div>
      </div>
    </div>
  </section>

  <section id="principles" style="background:var(--bg2);border-top:1px solid var(--line);border-bottom:1px solid var(--line)">
    <div class="wrap">
      <h2 class="sec-h">社区纲领</h2>
      <p class="sec-d">五条准则，简单直接。</p>
      <div class="cards prin">
        <div class="card"><h3>勤动脑</h3><p>先思考，再提问。常识性问题请自行搜索。</p></div>
        <div class="card"><h3>善动手</h3><p>工具自备，教程先读。灵巧的双手胜过千言万语。</p></div>
        <div class="card"><h3>AI 好帮手</h3><p>善用 AI，但不要当甩手掌柜。</p></div>
        <div class="card"><h3>文明交流</h3><p>不骂人，不说脏话，互相尊重。</p></div>
        <div class="card"><h3>工具自取</h3><p>所需工具请上网自行搜索下载。</p></div>
      </div>
    </div>
  </section>

  <section id="projects">
    <div class="wrap">
      <h2 class="sec-h">项目</h2>
      <p class="sec-d">来自 <a href="https://github.com/penosext" target="_blank" style="color:var(--acc);">github.com/penosext</a> 的公开仓库</p>
      <div class="proj" id="repo-container">
        <div class="repo-loading">
          <span class="material-icons status-icon spin">hourglass_empty</span>
          <span>正在加载仓库列表 ...</span>
        </div>
      </div>
    </div>
  </section>

  <section id="extended-services" style="background:var(--bg2);border-top:1px solid var(--line);border-bottom:1px solid var(--line);">
    <div class="wrap">
      <h2 class="sec-h">拓展服务与设备生态</h2>
      <p class="sec-d">探索除了 PenOS 之外的更多智能硬件与 AI 交互体系，并提供定制化技术支持。</p>
      <div class="cards">
        <div class="card">
          <div class="ic"><span class="material-icons">display_settings</span></div>
          <h3>远程服务</h3>
          <p>提供远程解锁与安装服务：解锁 ADB 权限（可自由安装软件）。收费：<b>20 RMB</b>。<br><span style="color:var(--acc);font-size:13px;display:inline-block;margin-top:4px;">* 远程服务请联系群管理操作</span></p>
          <div style="margin-top: 18px;">
            <a href="http://qm.qq.com/cgi-bin/qm/qr?_wv=1027&k=jEoEgYPl9j8motIVfFRQHPrJgFffWpRi&authKey=c3Kgcchbbf4cJT8wkZ7QZePy6kBzeVq%2FHRnZMTx3gmkEKXg0gVqrNne5WKxkgOWG&noverify=0&group_code=1004342178" target="_blank" class="btn-detail">了解详情</a>
          </div>
        </div>
        <div class="card">
          <div class="ic"><span class="material-icons">smart_toy</span></div>
          <h3>阿尔法蛋 (AlphaEgg)</h3>
          <p>研究淘云科技硬件固件机制，探索智能词典笔与儿童机器人应用的旁路加载、协议分析与本地化功能增强。</p>
        </div>
        <div class="card">
          <div class="ic"><span class="material-icons">record_voice_over</span></div>
          <h3>科大讯飞 (iFLYTEK)</h3>
          <p>基于讯飞星火大模型与智能硬件接口，适配多端 AI 能力，探索录音笔、翻译机与学习机的深层交互与调试可能性。</p>
        </div>
      </div>
    </div>
  </section>

  <section id="ecosystem">
    <div class="wrap">
      <h2 class="sec-h">POSC 社区服务生态</h2>
      <p class="sec-d">访问社区基础设施，获取论坛探讨、云盘资源与技术文档支持。</p>
      <div class="cards">
        <div class="card">
          <div class="ic"><span class="material-icons">forum</span></div>
          <h3>POSC BBS</h3>
          <p>社区技术讨论论坛，沉淀深度交流帖与资源沉淀。</p>
          <a class="link" href="https://bbs.posc.net" target="_blank" style="margin-top:12px;">bbs.posc.net</a>
        </div>
        <div class="card">
          <div class="ic"><span class="material-icons">cloud_download</span></div>
          <h3>POSC Pan</h3>
          <p>官方云盘服务，下载开发所需镜像、工具与公共资源包。</p>
          <a class="link" href="https://pan.posc.net" target="_blank" style="margin-top:12px;">pan.posc.net</a>
        </div>
        <div class="card">
          <div class="ic"><span class="material-icons">description</span></div>
          <h3>POSC Docs</h3>
          <p>技术知识库与官方在线文档。<br><span style="color:#f28b82;font-size:13px;display:inline-block;margin-top:4px;">* 严禁上传含有 shell 与 adb 相关的程序</span></p>
          <a class="link" href="https://docs.posc.net" target="_blank" style="margin-top:12px;">docs.posc.net</a>
        </div>
      </div>
    </div>
  </section>

  <section id="community" class="comm">
    <div class="wrap comm-grid">
      <div>
        <h2 class="sec-h">加入我们</h2>
        <p class="sec-d">QQ 群，唯一入口。</p>
        <div class="qq">961114239</div>
        <p class="note">加群前请先阅读教程。我们无义务教授工具的基础用法。</p>
      </div>
      <ul class="rules">
        <li><b>入群须知</b> — 凡事先看教程，不会问 AI，最后才问人</li>
        <li><b>禁止</b> — 询问常识性问题（npm 怎么装、py 脚本怎么跑等）</li>
        <li><b>禁止</b> — 辱骂群员或管理员，违者警告，再犯移出</li>
        <li><b>鸣谢</b> — 感谢各位大佬提供的 http 漏洞与 miniapp 开发端</li>
      </ul>
    </div>
  </section>

  <footer>
    <div class="wrap">
      <p class="footer-main">仅供学习与技术探讨，切勿盗取贩卖后果自负</p>
      <p class="footer-sub">By@POSC · PenOSCrack</p>
    </div>
  </footer>

  <script src="js/script.js"></script>
</body>
</html>