On-site Title Sheet fixes

credits.html

@@ -19,7 +19,7 @@
     <style>
         figure {display:flex;align-items:flex-start}
         figure img.pfp {margin-left:-30px;width:150px;height:100%;object-fit: cover;border-radius:5px;}
-        figcaption {padding-left:10px;text-align:left}
+        figcaption {padding-left:10px;text-align:left;margin-right:-35px;}
         hr {border-style:dashed}
         div#Contribute button {min-width:300px;}
         div#Contribute button img {float:left;}
@@ -101,7 +101,7 @@
 
         <hr>
 
-        <h2>Website Developers</h2>
+        <h2>Website Developer</h2>
 
         <hr>
 
@@ -177,7 +177,7 @@
         <figure>
             <img loading="lazy" src="media/pfp-cosmo.png" class="pfp" style="cursor:help">
             <figcaption>
-                <b><i>cosmobona56</i></b> is one of the Discord moderators.
+                <b><i>cosmobona56</i></b> is one of the Discord administrators.
                 <br><br>
                 <a target="_blank" href="https://www.youtube.com/@cosmo.tv_de"><button><img loading="lazy" src="meta/ico-yt.png" class="ico"></button></a>
                 <a target="_blank" href="https://cosmobona56.de"><button><img loading="lazy" src="meta/ico-web.png" class="ico"></button></a>

index.html

@@ -67,7 +67,7 @@
             <img src="media/screenshot-game.png" class="slide" loading="lazy" alt="Indivdual game page, cursor hovering over a download button">
             <img src="media/screenshot-news.png" class="slide" loading="lazy" alt="Indivdual WiiMart Wednesday page, showing what titles have been added">
         </div>
-       <div id="disclaimer"  title="this text is scrollable, highlight right or use arrow keys to scroll.">*Images for preview purposes, Recommended Titles and relevant information may be outdated, or subject to change.</div>
+       <div id="disclaimer">*Images for preview purposes, Recommended Titles and relevant information may be outdated, or subject to change.</div>
     </div>
 
     <h1>What's on it?</h1>

meta/main.css

@@ -1,4 +1,4 @@
-@font-face {font-family: 'Shop'; src: url('shop.ttf') format('truetype'); font-weight: normal; font-style: normal;}
+@font-face {font-family:'Shop'; src: url('shop.ttf') format('truetype'); font-weight: normal; font-style: normal;}
 
 /*Main things*/
 body {scroll-behavior:smooth;text-align: center;font-family: sans-serif;font-family:'Shop',sans-serif; overflow-x:hidden;transition:.1s ease-in-out; }
@@ -16,16 +16,16 @@ details ul {padding-left: 0;}
 details li {font-size:smaller;list-style:none;vertical-align:middle;}
 summary {padding-left: 5px;padding-right: 5px;cursor: pointer;user-select: none}
 
-.details-impt-info[open]   {transition:.3s ease-in-out; margin-bottom:3px;}
+.details-impt-info[open]  {transition:.3s ease-in-out; margin-bottom:3px;}
 .details-impt-info[open] summary {position:sticky; top:0; left:0; background-image:url("/meta/fadebg-wmw.png"); background-color:#73bad146; background-size:100% !important; }
-a.btn { background-color: #E6FFF2;border-radius: 10px;padding: 4px;margin-bottom: 10px;color:black;text-decoration: none;filter: drop-shadow(1px 1px 1px black);font-weight: 100;display:inline; transition:.2s ease-in-out;}
+a.btn {background-color: #E6FFF2;border-radius: 10px;padding: 4px;margin-bottom: 10px;color:black;text-decoration: none;filter: drop-shadow(1px 1px 1px black);font-weight: 100;display:inline; transition:.2s ease-in-out;}
-a.btn:hover { background-color: #C7FDFF;   padding:5px; font-size:16px; transition:.2s ease-in-out;}
+a.btn:hover {background-color: #C7FDFF; padding:5px; font-size:16px;}
 a.btn:active {filter: none;}  
 span.active {background-color: #c7c7c7;border-radius: 10px;padding: 4px;font-weight: 100;display:inline;cursor:auto;user-select:none}
 span.date {float:right;}
 span.hide {color:black}
-button {transform:scale(1);margin-bottom: 6px;font-family:'Shop',sans-serif;padding: 5px;outline: 1px solid #34BEED;border-radius: 3px;filter: drop-shadow(1px 1px 3.4px #bbbbbb);border:none; transition: transform 0.4s ease-in-out;}
+button {margin-bottom: 6px;font-family:'Shop',sans-serif;padding: 5px;outline: 1px solid #34BEED;border-radius: 3px;filter: drop-shadow(1px 1px 3.4px #bbbbbb);border:none; transition: transform 0.4s ease-in-out;}
-button:hover { transform:scale(1.03);transition: transform 0.2s ease-in-out; box-shadow: inset 0 0 0 3px #34BEED;cursor:pointer}
+button:hover {box-shadow: inset 0 0 0 3px #34BEED;cursor:pointer}
 button:disabled {outline: 1px solid #9A9A9A;box-shadow:none;cursor:default}
 
 details {text-align:left;padding-left: 5px;padding-right: 5px;}
@@ -33,7 +33,7 @@ details ul {padding-left: 0;}
 details li {font-size:smaller;list-style:none;vertical-align:middle;}
 summary {padding-left: 5px;padding-right: 5px;cursor: pointer;user-select: none}
 details li img {width:25px;height:25px;vertical-align:middle;margin:1px;outline:solid 1px #9900FF;border-radius:2px}
-details li a img:hover {outline: solid 2px #9900FF}
+details li a img:hover {outline:solid 2px #9900FF}
 details li img.pf {outline:none}
 
 /* add to the <details> element class="details-impt-info" if the <details> contains Important Info, obvously. */

meta/titles-table.js

@@ -31,10 +31,23 @@ document.addEventListener('DOMContentLoaded', async () => {
         "B_08_BalanceCtrl.gif": "Wii Balance Board",
         "B_08_DSCtrl.gif": "Nintendo DS",
         "B_08_MicrophoneCtrl.gif": "Microphone",
-        "B_08_MotionCtrl.gif": "Motion Plus remote",
+        "B_08_MotionCtrl.gif": "Wii Remote Plus",
         "B_08_TWLCtrl.gif": "Nintendo DSi",
     };
 
+    const purplePublishers = [
+        "Subnetic",
+        "A for Animation",
+        "dustinbriggs1991",
+        "saulfabreg",
+        "ThatOneYoshi",
+        "RM05",
+        "idkwhereisthisname",
+        "ForgottenArchive",
+        "RedYoshiKart",
+        "RollPlayStation"
+    ];
+
     function getControllerStringFromHTML(htmlString) {
         if (!htmlString || htmlString.trim() === '') {
             return { text: "Missing", style: "color:red;font-weight:bold;" };
@@ -116,7 +129,7 @@ document.addEventListener('DOMContentLoaded', async () => {
         allKeys.delete('title2');
         allKeys.add('title');
 
-        const sortedKeys = ['id', 'console', 'title', 'publisher', 'points', 'genre', 'players', 'controllers', 'language', 'thumbnail', 'size', 'rating', 'ratingdetails'];
+        const sortedKeys = ['id', 'console', 'title', 'publisher', 'date', 'points', 'genre', 'players', 'controllers', 'language', 'thumbnail', 'size', 'rating', 'ratingdetails'];
         
         table.innerHTML = '';
 
@@ -130,6 +143,11 @@ document.addEventListener('DOMContentLoaded', async () => {
 
         games.forEach(game => {
             const row = document.createElement('tr');
+            
+            if (purplePublishers.includes(game.publisher)) {
+                row.style.color = "#d940ffff";
+            }
+            
             sortedKeys.forEach(key => {
                 const cell = document.createElement('td');
                 const cellValue = game[key];
@@ -188,3 +206,4 @@ document.addEventListener('DOMContentLoaded', async () => {
 
 // fun fact, the gem in Gemdation stands for Gemini
 // ok bro
+// orb ko

title-sheet.html

@@ -1,10 +1,10 @@
 <!DOCTYPE html><html lang="en">
 <head>
-    <meta charset="utf-8">
-    <title>Title Sheet</title>
     <script src="meta/music.js"></script>
     <script src="meta/loader.js"></script>
     <script src="meta/titles-table.js"></script>
+    <meta charset="utf-8">
+    <title>Title Sheet</title>
     <meta http-equiv="X-UA-compatible" content="IE=edge">
     <meta property="og:title" content="WiiMart Title Sheet">
     <meta property="og:description" content="View all the titles WiiMart is hosting.">
@@ -16,8 +16,11 @@
     <style>
         .table-container {overflow-x: auto; max-width: 100%; display:none;}
         #titles {width: 100%;  border-collapse: collapse;}
-        #titles th, #titles td {border: 1px solid #ddd; padding: 2px; text-align: left; white-space: nowrap;}
+        #titles th, #titles td {border: 1px solid black; padding: 2px; text-align: left; white-space: nowrap;}
-        #titles th {background-color: #34BEED; color: white;}
+        #titles th {color:white;background-color:#9A9A9A;}
+        table a {text-decoration:none;}
+        span#region {color:black}
+        @media (prefers-color-scheme: dark) {#titles th, #titles td {border: 1px solid white;} span#region {color:white}}
     </style>
 </head>
 <body>
@@ -32,7 +35,7 @@
         <p>This spreadsheet is large and may not work on certain hardware.</p>
         <p>To begin viewing, press a region code.</p>
     
-        <div id="btns">
+        <div style="padding-bottom:10px" id="btns">
             <button>US</button>
             <button>CA</button>
             <button>MX</button>
@@ -44,11 +47,10 @@
             <button>JP</button>
             <button>NL</button>
         </div>
-        <p style="color:grey">This file is taken from <a href="https://oss-auth.thecheese.io/oss/oss/common/js/games.json" style="color:grey">games.json</a></p>
     </div>
 
     <div class="table-container">            
-        <h2><button style="float:left;margin-left:20px;">Return</button> <b>Region</b>: <span id="region" style="color:white"></span> </h2>
+        <h2><button style="float:left;margin-left:20px;">Return</button> <b>Region</b>: <span id="region"></span> </h2>
         <table id="titles">
         </table>
     </div>