index.html

@@ -49,12 +49,12 @@
       <nav id="section-list"></nav>
       <nav id="tab-list"></nav>
       <section id="tabs">
-        <div class="page center" id="Welcome" data-tab="$Welcome">
+        <div class="page active" id="Welcome" data-tab="$Welcome">
           <header>
             <img class="icon" src="assets/images/outline.svg" />
             <img class="type" src="assets/images/type.svg" />
           </header>
-          <div class="maxw">
+          <div>
             <p>
               This handbook is a collection of tweaks of the /tg/station wiki
               pages to make them prettier and easier to navigate.
@@ -71,57 +71,10 @@
                 not as polished as they should be.
               </li>
             </ul>
-            <p>
-              Click any guide in the top menu to open it or
-              <a href="#" id="welcome_expand">click here</a> to learn about some
-              of the extra features packed in.
-            </p>
-          </div>
-          <div class="features">
-            <h2>
-              <div class="maxw">
-                <div>Extra Features</div>
-              </div>
-            </h2>
-            <div class="maxw">
-              <h3 class="nobg">Jump to section/item</h3>
-              <p>
-                Press <b>SHIFT+S</b> on any page (except this one) to open up a
-                quick search menu.
-              </p>
-              <p>
-                Results for most pages are section titles, but some pages like
-                Chemistry have support for searching recipes etc.
-              </p>
-              <div class="images">
-                <img
-                  src="assets/images/welcome/bs-local.png"
-                  style="width: 40%;"
-                  loading="lazy"
-                />
-                <img
-                  src="assets/images/welcome/bs-global.png"
-                  style="width: 40%;"
-                  loading="lazy"
-                />
-              </div>
-              <p>
-                By default, only results for the current page are shown, you can
-                use <code>@</code> as prefix to search in all guides at once.
-              </p>
-              <h3 class="nobg">(Chemistry) Auto-Expanded tooltips</h3>
-              <p>
-                Recipes for reagent ingredients are now always shown in each
-                recipe rather than being tooltips.
-              </p>
-              <h3 class="nobg">(Chemistry) Beaker sizing</h3>
-              <p>
-                Press <b>SHIFT+B</b> to set your target reagent output and the
-                inputs will change from "part" to "ml". This is currently quite
-                inaccurate, use it as a guideline but apply common sense.
-              </p>
-            </div>
           </div>
+          <p>
+            Click any guide in the top menu to open it.
+          </p>
         </div>
       </section>
     </main>

src/index.ts

@@ -5,7 +5,6 @@ import { searchBox } from "./scripts/search";
 
 // @ts-expect-error: Parcel image import
 import unknown from "~/assets/images/tab-icons/unknown.svg";
-import { bindFunctions } from "./scripts/index";
 
 async function load() {
   const sectionListContainer = document.getElementById("section-list");
@@ -37,7 +36,8 @@ async function load() {
 
   const promises = sections.flatMap(async (section) => {
     manager.createSection(section.name);
-
+    return null;
+    /*
     return section.tabs.map(async (tab) => {
       // Load page
       await manager.openTab(section.name, tab.page, {
@@ -47,6 +47,7 @@ async function load() {
       // Remove icon from loading
       icons.removeChild(icons.querySelector(`img[data-tab=${tab.page}]`));
     });
+    */
   });
 
   manager.showSection("Medical");
@@ -54,14 +55,9 @@ async function load() {
   // manager.createSection("Medical");
   // const promises = [manager.openTab("Medical", "Infections", {})];
 
-  const welcome = document.getElementById("Welcome");
-  bindFunctions(welcome, "$Welcome");
-
   Promise.all(promises).then(() => {
     // Remove app-wide loading
     manager.setLoading(false);
-
-    welcome.classList.add("active");
   });
 }
 if ("serviceWorker" in navigator) {

src/scripts/index.ts

@@ -2,7 +2,6 @@ import { chemistryScript, processChemistry } from "./pages/chemistry";
 import { processVirology, virologyScript } from "./pages/virology";
 import { genericScript } from "./pages/generic";
 import { processGlobal } from "./pages/global";
-import { welcomeScript } from "./pages/welcome";
 
 // This is used for cache busting when userscript changes significantly.
 // Only change it when you made changes to the processHTML part!
@@ -60,9 +59,6 @@ export function bindFunctions(root: HTMLElement, docname: string): void {
       genericScript(root, docname);
       virologyScript(root);
       break;
-    case "$Welcome":
-      welcomeScript(root);
-      break;
     default:
       genericScript(root, docname);
       break;

src/scripts/pages/welcome.ts

@@ -1,19 +0,0 @@
-import { nextAnimationFrame } from "../../utils";
-
-export function welcomeScript(root: HTMLElement): void {
-  const expandLink = document.getElementById("welcome_expand");
-  expandLink.addEventListener("click", async () => {
-    const featureDiv = root.querySelector<HTMLDivElement>(".features");
-    featureDiv.style.display = "block";
-    root.classList.remove("center");
-    await nextAnimationFrame();
-    featureDiv.style.opacity = "1";
-    featureDiv.scrollIntoView({
-      block: "start",
-      inline: "nearest",
-      behavior: "smooth",
-    });
-  });
-}
-
-export default { welcomeScript };

src/scripts/search.ts

@@ -63,7 +63,7 @@ export function searchBox(): HTMLElement {
     }
     // Check for special flags
     let entries: SearchEntry[] = allEntries;
-    global = str[0] === "@";
+    global = str[0] === ",";
 
     // Unless we're doing a global search don't show entries for other pages
     if (!global) {

style/pages/welcome.scss

@@ -1,17 +1,11 @@
 #Welcome {
     display: flex;
     flex-direction: column;
-    &.center {
+    align-items: center;
-        align-items: center;
+    justify-content: center;
-        justify-content: center;
-    }
-    &:not(.center) {
-        header {
-            margin-top: 20px;
-        }
-    }
     font-size: 12pt;
     line-height: 1.4em;
+    padding: 10pt;
     header {
         display: flex;
         flex-direction: row;
@@ -28,44 +22,8 @@
             width: 400px;
         }
     }
-
+    p,
-    .features {
+    ul {
-        width: 100%;
-        opacity: 0;
-        display: none;
-        transition: all 200ms;
-    }
-
-    .maxw {
-        margin: 0 auto;
         max-width: 960px;
-        text-align: left;
-    }
-
-    h3 {
-        font-size: 15pt;
-    }
-
-    h3.nobg {
-        background: transparent;
-        margin-bottom: 0;
-        padding-bottom: 0;
-        position: relative;
-        z-index: 2;
-    }
-
-    code {
-        display: inline-block;
-        background-color: #222;
-        border-radius: 3px;
-        padding: 2px 5px;
-    }
-
-    .images {
-        display: flex;
-        flex-wrap: wrap;
-        img {
-            margin: 10px;
-        }
     }
 }