style: Standardize kebab-case for class names

FifthTundraG · FifthTundraG · commit f26f31a9db20 · 2025-12-31T18:03:02.000-05:00
diff --git a/public/index.html b/public/index.html
@@ -13,15 +13,15 @@
         <script src="./main.js" type="module" defer></script> <!-- changeMarker -->
     </head>
     <body>
-        <div id="leftSide" class="leftSide">
+        <div class="left-side" id="leftSide">
             <img id="cookie" class="cookie pointer" 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>
                 <h4 class="cookies-per-second-counter">Cookies Per Second: <span id="cookiesPerSecondCount">0</span></h4>
             </div>
             <!-- <h3 class="win shadow" id="win">you win.</h3> -->
             <p class="saving-indicator" id="savingIndicator">Saved!</p>
-            <span class="leftSidePush" id="leftSidePush"></span> <!-- for some reason when you open menus it will change the size of the left side's div and smoosh everything, this prevents that (somehow) -->
+            <span class="left-side-push" id="leftSidePush"></span> <!-- for some reason when you open menus it will change the size of the left side's div and smoosh everything, this prevents that (somehow) -->
             <div class="social-links">
                 <a href="404.html" target="_blank" id="githubHyperlink"> <!-- this HREF is changed programmatically in main.ts in the event of a fork and a different GitHub repo link. -->
                     <img class="github" src="img/github-mark.svg" alt="github">
@@ -139,7 +139,7 @@ <h5 class="middle-subtitle">Miscellaneous:</h5>
                 </div>
             </div>
         </div> <!-- end middle -->
-        <div id="rightSide" class="rightSide">
+        <div class="right-side" id="rightSide">
             <h1 class="store-heading shadow">Store</h1>
             <h3 class="upgrades-marker shadow">Upgrades</h3>
             <div class="upgrades-holder-background">
diff --git a/src/scss/main.scss b/src/scss/main.scss
@@ -86,7 +86,7 @@ small {
 }
 
 /* important things */
-.leftSide {
+.left-side {
     width: 312px;
     height: 100vh;
     border-style: solid;
@@ -97,7 +97,7 @@ small {
     background-image: url(img/backgrounds/background-blue.png);
 }
 
-.rightSide {
+.right-side {
     width: 338px;
     float: right;
     height: 100vh;
@@ -434,7 +434,7 @@ small {
     text-align: center;
 }
 
-.leftSidePush {
+.left-side-push {
     width: 320px;
 }
 
diff --git a/src/ts/main.ts b/src/ts/main.ts
@@ -248,7 +248,7 @@ export class Game implements SaveProvider<GameSaveData> {
             mousePos.setAttribute("style","margin-bottom:0px;");
             devDiv.appendChild(mousePos);
     
-            document.getElementById("leftSide").insertBefore(devDiv, document.getElementById("leftSidePush"));
+            document.getElementById("leftSide").insertBefore(devDiv, document.querySelector(".left-side-push"));
         }
 
         // ------- Event Listeners (very long) -------

Original file line number	Diff line number	Diff line change
`@@ -86,7 +86,7 @@ small {`
`86`	`86`	`}`
`87`	`87`
`88`	`88`	`/* important things */`
`89`		`-.leftSide {`
	`89`	`+.left-side {`
`90`	`90`	`width: 312px;`
`91`	`91`	`height: 100vh;`
`92`	`92`	`border-style: solid;`
`@@ -97,7 +97,7 @@ small {`
`97`	`97`	`background-image: url(img/backgrounds/background-blue.png);`
`98`	`98`	`}`
`99`	`99`
`100`		`-.rightSide {`
	`100`	`+.right-side {`
`101`	`101`	`width: 338px;`
`102`	`102`	`float: right;`
`103`	`103`	`height: 100vh;`
`@@ -434,7 +434,7 @@ small {`
`434`	`434`	`text-align: center;`
`435`	`435`	`}`
`436`	`436`
`437`		`-.leftSidePush {`
	`437`	`+.left-side-push {`
`438`	`438`	`width: 320px;`
`439`	`439`	`}`
`440`	`440`
Original file line number	Diff line number	Diff line change
`@@ -248,7 +248,7 @@ export class Game implements SaveProvider<GameSaveData> {`
`248`	`248`	`mousePos.setAttribute("style","margin-bottom:0px;");`
`249`	`249`	`devDiv.appendChild(mousePos);`
`250`	`250`
`251`		`- document.getElementById("leftSide").insertBefore(devDiv, document.getElementById("leftSidePush"));`
	`251`	`+ document.getElementById("leftSide").insertBefore(devDiv, document.querySelector(".left-side-push"));`
`252`	`252`	`}`
`253`	`253`
`254`	`254`	`// ------- Event Listeners (very long) -------`