reevebyte.github.io/contact.html at main · reevebyte/reevebyte.github.io · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
<!doctype html>
<html lang="zh-CN">
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta name="description" content="ReeveByte 的恶搞联系页。" />
    <meta name="theme-color" content="#0f4c5c" />
    <title>联系 | ReeveByte</title>
    <link rel="icon" type="image/svg+xml" href="assets/favicon.svg" />
    <link rel="stylesheet" href="styles.css" />
  </head>
  <body>
    <header class="site-header page-header" data-header>
      <a class="brand" href="index.html" aria-label="ReeveByte home">
        <span class="brand-mark">Rb</span>
        <span>ReeveByte</span>
      </a>
      <nav class="site-nav" aria-label="主导航">
        <a href="work.html"><span class="nav-icon" aria-hidden="true">□</span>作品</a>
        <a href="stack.html"><span class="nav-icon" aria-hidden="true">△</span>能力</a>
        <a class="is-active" href="contact.html"><span class="nav-icon" aria-hidden="true">@</span>联系</a>
      </nav>
    </header>

    <main class="page-shell">
      <section class="page-hero page-hero-split" aria-labelledby="contact-title">
        <div>
          <p class="eyebrow">Signal center</p>
          <h1 id="contact-title">联系我：把脑洞装箱，贴上邮票，然后发射。</h1>
          <p>
            合作、建议、项目想法、页面不顺眼报告，都可以从这里出发。
            我会认真查看，假装镇定，并尽量给出人类能读懂的回复。
          </p>
        </div>
        <aside class="page-note">
          <span>回复速度</span>
          <strong>看咖啡</strong>
          <p>咖啡浓度越高，消息被发现的概率越接近玄学。</p>
        </aside>
      </section>

      <section class="section contact-hub" aria-labelledby="contact-hub-title">
        <div class="section-heading">
          <p class="eyebrow">Channels</p>
          <h2 id="contact-hub-title">三条信号通道</h2>
        </div>

        <div class="contact-grid">
          <a class="contact-card primary-card" href="mailto:mo0nster@163.com">
            <span>@</span>
            <h3>邮件发射台</h3>
            <p>适合合作、长文、详细需求，以及“我有一个不成熟的小想法”。</p>
            <strong>mo0nster@163.com</strong>
          </a>

          <a class="contact-card" href="https://github.com/reevebyte" target="_blank" rel="noreferrer">
            <span>□</span>
            <h3>GitHub 展柜</h3>
            <p>适合围观代码、检查动静、顺手看看这个人有没有在认真提交。</p>
            <strong>github.com/reevebyte</strong>
          </a>

          <a class="contact-card" href="work.html">
            <span>△</span>
            <h3>作品传送门</h3>
            <p>还没想好说什么？先去看作品，回来时灵感通常会更嚣张。</p>
            <strong>先逛一圈</strong>
          </a>
        </div>
      </section>

      <section class="section signal-panel" aria-labelledby="signal-title">
        <div>
          <p class="eyebrow">Before sending</p>
          <h2 id="signal-title">发信前小纸条</h2>
        </div>
        <div class="signal-list">
          <p><strong>项目合作：</strong>请带上目标、时间、预算范围，页面会少走弯路。</p>
          <p><strong>技术交流：</strong>欢迎直接抛问题，最好附上上下文，别只发“在吗”。</p>
          <p><strong>友好围观：</strong>可以夸，也可以提建议，错别字举报优先级很高。</p>
        </div>
      </section>

      <section class="section contact-section">
        <div>
          <p class="eyebrow">Launch</p>
          <h2>收件箱已经开灯，虽然它依然装得很冷静。</h2>
        </div>
        <div class="contact-actions">
          <a class="button primary" href="mailto:mo0nster@163.com?subject=来自%20ReeveByte%20主页的神秘信号">
            <span aria-hidden="true">@</span>
            发送邮件
          </a>
          <a class="button secondary" href="https://github.com/reevebyte" target="_blank" rel="noreferrer">
            <span aria-hidden="true">□</span>
            查看 GitHub
          </a>
        </div>
      </section>
    </main>

    <footer class="site-footer">
      <p>© <span data-year></span> ReeveByte. 信号稳定，回复随缘。</p>
      <a href="index.html">回到主页</a>
    </footer>

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