initial commit

luotianyi-dev · Apr 24, 2023 · c2462b3 · c2462b3
commit c2462b3
Show file tree

Hide file tree

Showing 10 changed files with 943 additions and 0 deletions.
diff --git a/.gitignore b/.gitignore
@@ -0,0 +1,3 @@
+.DS_Store
+venv/
+dist/
diff --git a/LICENSE b/LICENSE
diff --git a/README.md b/README.md
@@ -0,0 +1,11 @@
+# 雅音宫羽角色同人网站
+「听，山楂花泪摇曳谁的笛章」
+
+就算被世界遗忘、也请永远不要忘记这个，曾经为天依付出过那么多的女孩。
+
+此项目是 Tianyi Network Web 的一部分。
+
+## 版权
+除了 `html/assets` 下的内容，其余内容使用 `GPL-3.0-only` 协议。
+
+`html/assets` 下的内容并非由 Tianyi Network 创作，应遵循合理、非商用的规则使用。
diff --git a/html/assets/img-01-vsqx.png b/html/assets/img-01-vsqx.png
diff --git a/html/assets/img-02-official.jpg b/html/assets/img-02-official.jpg
diff --git a/html/assets/img-03-detail.jpg b/html/assets/img-03-detail.jpg
diff --git a/html/assets/唱給雅音宮羽.mp3 b/html/assets/唱給雅音宮羽.mp3
diff --git a/html/assets/唱給雅音宮羽.png b/html/assets/唱給雅音宮羽.png
diff --git a/html/index.html b/html/index.html
@@ -0,0 +1,119 @@
+<!DOCTYPE html>
+<html lang="zh-CN">
+<head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <meta name="renderer" content="webkit">
+    <meta http-equiv="Cache-Control" content="no-siteapp" />
+    <meta name="google" content="notranslate">
+    <title>「雅音宫羽」</title>
+    <meta name="description" content="你是全世界的洛天依 却只是我一人的雅音宫羽" />
+    <meta name="decoder" content="[6737259,-15597452,6737272,-15597504,6737259,-15597451,6737262,-15597452,6737256,-15597471,6737261,-15597447,6737256,-15597522,6737251,-15597467,6737269]">
+    <link rel="preload" href="style.css" as="style">
+    <link rel="stylesheet" href="style.css">
+</head>
+<body>
+    <main>
+        <header>
+            <img class="banner" src="assets/唱給雅音宮羽.png" alt="雅音宮羽" />
+            <p class="introduction">
+                「你是全世界的洛天依<br>&emsp;却只是我一人的雅音宫羽」
+            </p>
+        </header>
+        <article>
+            <section>
+                <h2>设定信息</h2>
+                <img class="banner" src="assets/img-03-detail.jpg" alt="雅音宮羽设定" />
+            </section>
+            <section>
+                <h2>思念之歌</h2>
+                <ul class="list">
+                    <a href="https://b23.tv/av333069" target="_blank" rel="noreferrer">
+                        <li>唱給雅音宮羽</li>
+                    </a>
+                    <a href="https://b23.tv/av1773542" target="_blank" rel="noreferrer">
+                        <li>唱給雅音宮羽 · Ⅱ</li>
+                    </a>
+                    <a href="https://b23.tv/av5461608" target="_blank" rel="noreferrer">
+                        <li>唱給雅音宮羽 · Ⅲ</li>
+                    </a>
+                    <a href="https://b23.tv/av12104333" target="_blank" rel="noreferrer">
+                        <li>唱給雅音宮羽 · 终</li>
+                    </a>
+                    <a href="https://b23.tv/av60660066" target="_blank" rel="noreferrer">
+                        <li>Haru</li>
+                    </a>
+                </ul>
+            </section>
+        </article>
+        <footer>
+            <ul>
+                <li>
+                    © 2023 <a href="https://www.luotianyi.dev">Tianyi Network</a>
+                </li>
+                <li>
+                    Content License:
+                    <a href="https://creativecommons.org/licenses/by-sa/4.0/" rel="license noreferrer"
+                        target="_blank">CC BY-SA 4.0</a>
+                </li>
+                <li>
+                    Code License:
+                    <a href="https://opensource.org/license/gpl-3-0/" rel="license noreferrer" target="_blank">GPL 3.0 Only</a>
+                </li>
+                <li>
+                    GitHub:
+                    <a href="https://github.com/luotianyi-dev/web-yayingongyu" rel="noreferrer" target="_blank">web-yayingongyu</a>
+                </li>
+                <li>
+                    Contact: <a href="#" rel="email">[Email Protected]</a>
+                </li>
+            </ul>
+        </footer>
+        <audio style="display: none;" src="assets/唱給雅音宮羽.mp3" loop />
+    </main>
+</body>
+<script>
+    function encodeEmail(text) {
+        const encoder = new TextEncoder();
+        const data = Array.from(encoder.encode(text));
+        data.forEach((v, i) => {
+            if (i % 2 === 0) {
+                data[i] = v + 0x66ccff;
+            } else {
+                data[i] = v - 0xee0000;
+            }
+        });
+        return data;
+    }
+
+    function decodeEmail(data) {
+        const decoded = [];
+        data.forEach((v, i) => {
+            if (i % 2 === 0) {
+                decoded[i] = v - 0x66ccff;
+            } else {
+                decoded[i] = v + 0xee0000;
+            }
+        });
+        const decoder = new TextDecoder();
+        return decoder.decode(Uint8Array.from(decoded));
+    }
+
+    function playAudio() {
+        document.querySelector('audio').play().catch(() => { console.log('浏览器不支持自动播放') })
+    }
+
+    document.querySelectorAll("[rel=email]").forEach(el => {
+        const encryptedEmail = JSON.parse(document.querySelector("meta[name=decoder]").content);
+        const email = decodeEmail(encryptedEmail);
+        if (el.tagName.toLowerCase() === "a") {
+            el.href = `mailto:${email}`;
+        }
+        el.innerText = email;
+    })
+
+    playAudio();
+    document.addEventListener('click', playAudio);
+</script>
+</html>
diff --git a/html/style.css b/html/style.css
@@ -0,0 +1,136 @@
+body {
+    margin: 0;
+    padding: 0;
+    font-family: -apple-system, 'Helvetica Neue', Helvetica, 'Nimbus Sans L', Arial, 'Liberation Sans', 'PingFang SC', 'Hiragino Sans GB',
+        'Source Han Sans CN', 'Source Han Sans SC', 'Microsoft YaHei', 'Wenquanyi Micro Hei', 'WenQuanYi Zen Hei', 'ST Heiti', SimHei,
+        'WenQuanYi Zen Hei Sharp', sans-serif;
+    background: linear-gradient(180deg, rgba(102, 204, 255, 0.2) 0%, #fff 71.2%);
+}
+
+main {
+    width: 600px;
+    margin: 0 auto;
+    padding-top: 200px;
+    min-height: 100%;
+}
+
+img.banner {
+    width: 100%;
+    height: auto;
+}
+
+@media (max-width: 720px) {
+    main {
+        box-sizing: border-box;
+        width: 100%;
+        padding-top: 0;
+    }
+}
+
+/* Header */
+header .introduction {
+    font-family: Georgia, 'Nimbus Roman No9 L', 'Songti SC', STSong, 'AR PL New Sung', 'AR PL SungtiL GB', NSimSun, SimSun, 'TW\-Sung',
+        'WenQuanYi Bitmap Song', 'AR PL UMing CN', 'AR PL UMing HK', 'AR PL UMing TW', 'AR PL UMing TW MBE', PMingLiU, MingLiU, serif;
+    font-size: 1.5rem;
+    line-height: 2.5;
+}
+
+/* Content */
+@media (max-width: 720px) {
+    section {
+        padding-left: 1em;
+        padding-right: 1em;
+    }
+}
+
+article h2 {
+    font-family: Georgia, 'Nimbus Roman No9 L', 'Songti SC', STSong, 'AR PL New Sung', 'AR PL SungtiL GB', NSimSun, SimSun, 'TW\-Sung',
+        'WenQuanYi Bitmap Song', 'AR PL UMing CN', 'AR PL UMing HK', 'AR PL UMing TW', 'AR PL UMing TW MBE', PMingLiU, MingLiU, serif;
+    font-weight: 600;
+    margin-top: 28.8%;
+}
+
+article .list {
+    list-style: none;
+    padding: 0;
+    margin: 0;
+}
+
+article .list li {
+    display: block;
+}
+
+article .list a {
+    display: block;
+    text-decoration: none;
+    margin: 0;
+    color: #666;
+    border-bottom: 2px solid transparent;
+    transition: .15s ease-in-out;
+    padding: .8em 0;
+    border-top: 1.5px solid #aaa;
+    cursor: pointer;
+}
+
+article .list a:last-child {
+    border-bottom: 1.5px solid #aaa;
+}
+
+article .list a:hover {
+    color: #666;
+    background: #eee;
+}
+
+@media (max-width: 720px) {
+    .links {
+        box-sizing: border-box;
+        padding-left: 1rem;
+        padding-right: 1.5rem;
+    }
+}
+
+/* Footer */
+footer {
+    margin: 100px 0;
+}
+
+footer,
+footer a {
+    font-size: .8rem;
+    color: #aaa;
+}
+
+footer a {
+    display: inline-block;
+    text-decoration: none;
+    margin: .3em;
+    border-bottom: 2px solid transparent;
+    transition: .15s ease-in-out;
+}
+
+footer a:hover {
+    color: #666;
+    border-bottom: 2px solid #666;
+    transition: .15s ease-in-out;
+}
+
+footer ul {
+    list-style: none;
+    padding: 0;
+    margin: 0;
+    display: flex;
+    column-gap: 1em;
+    flex-wrap: wrap;
+}
+
+@media (max-width: 720px) {
+    footer {
+        box-sizing: border-box;
+        padding: 1rem;
+        margin: 1rem 0;
+    }
+
+    footer ul {
+        flex-direction: column;
+    }
+}