style: Remove some helper classes and finalize(?) changelogs

Author: FifthTundraG

public/index.html

@@ -16,7 +16,7 @@
         <div class="left-side" id="leftSide">
             <img class="cookie pointer" id="cookie" src="img/cookie.png" alt="cookie" draggable="false">
             <div class="cookie-counter-wrapper">
-                <h3 class="cookie-counter shadow">Cookies: <span id="cookieCount">0</span></h3>
+                <h3 class="cookie-counter">Cookies: <span id="cookieCount">0</span></h3>
                 <h4 class="cookies-per-second-counter">Cookies Per Second: <span id="cookiesPerSecondCount">0</span></h4>
             </div>
             <p class="saving-indicator" id="savingIndicator">Saved!</p>
@@ -128,14 +128,14 @@ <h2>Miscellaneous:</h2>
                     <button class="data-button pointer" id="listModsButton" style="margin-top:3px; margin-left:0px;">List Mods</button>
                 </div>
             </div>
-            <div class="tooltip absolute no-display" id="tooltip">
+            <div class="tooltip no-display" id="tooltip">
                 <div class="tooltip-content">
-                    <p class="tooltip-name black" id="tooltipName">Name</p>
-                    <p class="tooltip-price absolute black" id="tooltipPrice">Price</p>
-                    <p class="tooltip-description black" id="tooltipDesc">Description</p> <!-- Hidden when buildings are hovered since they have no description -->
-                    <p class="tooltip-quote black" id="tooltipQuote">"Quote"</p>
-                    <p class="tooltip-stats black" id="tooltipProduces">Produces</p><!-- Hidden when upgrades are hovered since they have no produces/producing -->
-                    <p class="tooltip-stats black" id="tooltipProducing">Producing</p>
+                    <p class="tooltip-name" id="tooltipName">Name</p>
+                    <p class="tooltip-price" id="tooltipPrice">Price</p>
+                    <p class="tooltip-description" id="tooltipDesc">Description</p> <!-- Hidden when buildings are hovered since they have no description -->
+                    <p class="tooltip-quote" id="tooltipQuote">"Quote"</p>
+                    <p class="tooltip-stats" id="tooltipProduces">Produces</p><!-- Hidden when upgrades are hovered since they have no produces/producing -->
+                    <p class="tooltip-stats" id="tooltipProducing">Producing</p>
                 </div>
             </div>
         </div> <!-- end middle -->

src/scss/buildings.scss

@@ -29,7 +29,6 @@
 
         .building-price {
             margin: 0;
-            margin-left: 0.6px; // todo: keep?
         }
 
         .buildings-bought {

src/scss/main.scss

@@ -34,38 +34,19 @@ body {
     -webkit-touch-callout: none; /* mobile-only */
 }
 
-/* todo 0.7.1: find why these are here and how we can make their elements assigned to their own specific class instead of making every element have these properties*/
-a {
+a { // links should inherit color and be bold always unless otherwise specified
     font-weight: bold;
     color: inherit;
 }
 
-/* todo 0.7.1: i don't like these anymore, keep a few like pointer and no-display but remove stuff like red.  */
+/* todo 0.7.1: keep these two helpers?  */
 /* helper classes */
 .no-display {
     display: none;
 }
 .pointer {
     cursor: pointer;
 }
-.red {
-    color: red;
-}
-.black {
-    color: black;
-}
-.blue {
-    color: blue;
-}
-.absolute {
-    position: absolute;
-}
-.shadow {
-    text-shadow: variables.$shadow;
-}
-.visible {
-    opacity: 1 !important;
-}
 
 /* important things */
 .left-side {

src/scss/tooltip.scss

@@ -3,12 +3,14 @@
 .tooltip {
     width: 285px;
     height: 125px;
+    position: absolute;
+    right: 346px;
+    z-index: 1; /* legit nothing has a higher-than-normal z-index, so this will show above EVERYTHING */
     border: solid 3px black;
     border-right-width: 0px;
     background-color: variables.$colored-container;
+    color: black; //  for children
     pointer-events: none; /* if it's hovered over it won't do the flickering thing */
-    right: 346px;
-    z-index: 1; /* legit nothing has a higher-than-normal z-index, so this will show above EVERYTHING */
 }
 .tooltip-content {
     padding: 0px 3px 0px 3px;
@@ -19,6 +21,7 @@
     margin-bottom: 0px;
 }
 .tooltip-price {
+    position: absolute;
     font-size: 15px;
     right: 0px;
     top: 0px;

src/ts/changelogs.ts

@@ -269,20 +269,16 @@ export const versionChangelogs: Changelog[] = [
     {
         type: "patch",
         version: "0.7.1",
-        name: "tbd",
+        name: "the little things",
         added: [
-            "Metadata is now visible in the modlist (#61, todo)",
-            "ESLint is used for code linting and formatting via ESLint Stylistic."
+            "ESLint is used for code linting and formatting via ESLint Stylistic (#70)"
         ],
         changed: [
             "Switched to SCSS (#59)",
             "Many styles have been adjusted for consistent sizing and spacing. As a result, some elements may appear slightly different.",
-            "Advanced Popup content is now easier to create (#31, todo)",
+            "Advanced Popup content is now easier to create (#31)",
             "All project files are now compliant with ESLint rules."
         ],
-        fixed: [
-            "Loading saves allowed saves from other version branches (#68, todo)"
-        ],
         release: "tbd"
     }
 ];

src/ts/handlers.ts

@@ -332,7 +332,7 @@ export class ModHandler extends UniqueKeyHandler<Mod<unknown>> {
         const popup = new AdvancedPopup(500,350,/*html*/`<h1>Add Mod</h1>
         <h5 style='color:red; margin-bottom:3px; margin-top:5px;'>WARNING!</h5>
         <h5 style='color:red; margin-top:0px; margin-bottom:0px;'>Adding mods without verifying their legitimacy can result in unintended side effects! We are not responsible for any damages that may be caused by mods!</h5>
-        <h5 style='margin-top:5px; margin-bottom:0px;'>For information regarding mods, <a href='https://github.com/clickercookie/clickercookie.github.io/wiki/Modding' class='blue' target="_blank">read the documentation</a>.</h5>
+        <h5 style='margin-top:5px; margin-bottom:0px;'>For information regarding mods, <a href='https://github.com/clickercookie/clickercookie.github.io/wiki/Modding' target="_blank" style="color: blue;">read the documentation</a>.</h5>
         <form onsubmit='return false;' id='addModURLForm' style='margin-top:22px;'>
             <label for='addModURL'>From URL: </label>
             <input id='addModURL'>

src/ts/saving.ts

@@ -79,10 +79,10 @@ export class Savinator {
 
         // Update saving notification
         const indicator = document.getElementById("savingIndicator");
-        indicator.classList.add("visible");
+        indicator.style.opacity = "1";
 
         setTimeout(function() {
-            indicator.classList.remove("visible");
+            indicator.style.opacity = "0";
         }, 1500);
     }