fanfic

Unnamed repository; edit this file 'description' to name the repository.
Log | Files | Refs

index.html (1898B)


      1 <!doctype html>
      2 <html lang="jp">
      3     <head>
      4         <meta charset="utf-8" />
      5         <title>Trinity Library - Fanfic Index</title>
      6         <meta name="author" content="ハチか" />
      7         <meta name="description" content="ファンフィクション(二次創作置き場)" />
      8         <link rel="stylesheet" href="styles.css" />
      9     </head>
     10     <body>
     11         <header>
     12             Library
     13             <button class="theme-toggle" id="theme-btn">MODE: LIGHT</button>
     14         </header>
     15         <nav>
     16             <a href="index.html">ホーム</a>
     17             <a href="list.html">蔵書目録</a>
     18             <a href="sns.html">sns一覧</a>
     19             <a href="about.html">about</a>
     20         </nav>
     21         <main>
     22             <span class="doc-id" id="doc-id"
     23                 >DOC_TYPE: INDEX / REF_NO: 773</span
     24             >
     25             <h1>ホーム</h1>
     26             <p>
     27                 ようこそトリニティの図書館へ.<br />
     28                 ここは静寂と知性が交差する場所です。
     29             </p>
     30         </main>
     31         <footer>
     32             このページは主にBlueArchiveの二次創作であり,公式を模す意図はありません.
     33         </footer>
     34 
     35         <script>
     36             const btn = document.getElementById("theme-btn");
     37             const docId = document.getElementById("doc-id");
     38             let isDark = false;
     39 
     40             btn.addEventListener("click", () => {
     41                 isDark = !isDark;
     42                 document.documentElement.setAttribute(
     43                     "data-theme",
     44                     isDark ? "dark" : "light",
     45                 );
     46                 btn.textContent = isDark ? "MODE: DARK" : "MODE: LIGHT";
     47 
     48                 docId.textContent = isDark
     49                     ? "DOC_TYPE: NIGHT_ARCHIVE / REF_NO: 404"
     50                     : "DOC_TYPE: INDEX / REF_NO: 773";
     51             });
     52         </script>
     53     </body>
     54 </html>