From 18b1b9ac4568adad2538b9e59742c478e411c278 Mon Sep 17 00:00:00 2001
From: lowercasedonkey <lowercasedonkey@gmail.com>
Date: Thu, 13 Aug 2020 14:12:24 -0400
Subject: [PATCH] tab-links

---
 src/Mods/SecExp/attackOptions.tw           | 10 +++++-----
 src/Mods/SecExp/buildings/secBarracks.tw   |  8 ++++----
 src/Mods/SecExp/edicts.tw                  |  4 ++--
 src/Mods/SpecialForce/Firebase.tw          |  6 +++---
 src/events/intro/introSummary.tw           |  8 ++++----
 src/facilities/nursery/nursery.tw          |  6 +++---
 src/gui/options/options.tw                 | 10 +++++-----
 src/interaction/policies/policies.tw       | 12 ++++++------
 src/js/rulesAssistantOptions.js            |  2 +-
 src/js/utilsSC.js                          |  8 ++++----
 src/npc/slaveStats.tw                      | 14 +++++++-------
 src/npc/startingGirls/startingGirls.tw     | 16 ++++++++--------
 src/personalAssistant/assistantOptions.tw  |  6 +++---
 src/uncategorized/economics.tw             | 18 +++++++++---------
 src/uncategorized/remoteSurgery.tw         | 12 ++++++------
 src/uncategorized/slaveInteract.tw         | 18 +++++++++---------
 src/uncategorized/underperformingSlaves.tw |  4 ++--
 17 files changed, 81 insertions(+), 81 deletions(-)

diff --git a/src/Mods/SecExp/attackOptions.tw b/src/Mods/SecExp/attackOptions.tw
index 0eea7a19a3a..8ea89c1acba 100644
--- a/src/Mods/SecExp/attackOptions.tw
+++ b/src/Mods/SecExp/attackOptions.tw
@@ -216,8 +216,8 @@ approximately <strong><<print _estimatedMen>> men</strong> are coming, they seem
 	<</link>>
 <</if>>
 <br>For this battle you choose to follow <span id="tactic"><strong><<print $chosenTactic>></strong></span> tactics.<br>
-<button class="tablinks" onclick="App.UI.tabbar.openTab(event, 'defensiveTactics')" id="tab defensive tactics">Defensive tactics</button>
-<button class="tablinks" onclick="App.UI.tabbar.openTab(event, 'offensiveTactics')" id="tab offensiveTactics">Offensive Tactics</button>
+<button class="tab-links" onclick="App.UI.tabbar.openTab(event, 'defensiveTactics')" id="tab defensive tactics">Defensive tactics</button>
+<button class="tab-links" onclick="App.UI.tabbar.openTab(event, 'offensiveTactics')" id="tab offensiveTactics">Offensive Tactics</button>
 
 <div id="defensiveTactics" class="tab-content">
 	<div class="content">
@@ -424,13 +424,13 @@ approximately <strong><<print _estimatedMen>> men</strong> are coming, they seem
 	<br><br>
 <</if>>
 <<if $militiaUnits.length > 0>>
-	<button class="tablinks" onclick="App.UI.tabbar.openTab(event, 'militia')" id="tab militia">Militia: ($militiaUnits.length)</button>
+	<button class="tab-links" onclick="App.UI.tabbar.openTab(event, 'militia')" id="tab militia">Militia: ($militiaUnits.length)</button>
 <</if>>
 <<if $slaveUnits.length > 0>>
-	<button class="tablinks" onclick="App.UI.tabbar.openTab(event, 'slaves')" id="tab slaves">Slaves: ($slaveUnits.length)</button>
+	<button class="tab-links" onclick="App.UI.tabbar.openTab(event, 'slaves')" id="tab slaves">Slaves: ($slaveUnits.length)</button>
 <</if>>
 <<if $mercUnits.length > 0>>
-	<button class="tablinks" onclick="App.UI.tabbar.openTab(event, 'mercs')" id="tab mercs">Mercs: ($mercUnits.length)</button>
+	<button class="tab-links" onclick="App.UI.tabbar.openTab(event, 'mercs')" id="tab mercs">Mercs: ($mercUnits.length)</button>
 <</if>>
 
 <div id="militia" class="tab-content">
diff --git a/src/Mods/SecExp/buildings/secBarracks.tw b/src/Mods/SecExp/buildings/secBarracks.tw
index 637c1334d6e..301922d81cb 100644
--- a/src/Mods/SecExp/buildings/secBarracks.tw
+++ b/src/Mods/SecExp/buildings/secBarracks.tw
@@ -140,15 +140,15 @@ Your current maximum number of units is <<print App.SecExp.battle.maxUnits()>> (
 <</if>>
 <div class="tab-bar">
 	<<if $arcologyUpgrade.drones == 1>>
-		<button class="tablinks" onclick="App.UI.tabbar.openTab(event, 'Bots')" id="tab Bots">Security Drones</button>
+		<button class="tab-links" onclick="App.UI.tabbar.openTab(event, 'Bots')" id="tab Bots">Security Drones</button>
 	<</if>>
 	<<if $SecExp.edicts.defense.militia >= 1>>
-		<button class="tablinks" onclick="App.UI.tabbar.openTab(event, 'Militia')" id="tab Militia">Militia: ($militiaUnits.length)</button>
+		<button class="tab-links" onclick="App.UI.tabbar.openTab(event, 'Militia')" id="tab Militia">Militia: ($militiaUnits.length)</button>
 	<</if>>
 	<<if $mercenaries >= 1>>
-		<button class="tablinks" onclick="App.UI.tabbar.openTab(event, 'Mercs')" id="tab Mercs">Mercenaries: ($mercUnits.length)</button>
+		<button class="tab-links" onclick="App.UI.tabbar.openTab(event, 'Mercs')" id="tab Mercs">Mercenaries: ($mercUnits.length)</button>
 	<</if>>
-	<button class="tablinks" onclick="App.UI.tabbar.openTab(event, 'Slaves')" id="tab Slaves">Slaves: ($slaveUnits.length)</button>
+	<button class="tab-links" onclick="App.UI.tabbar.openTab(event, 'Slaves')" id="tab Slaves">Slaves: ($slaveUnits.length)</button>
 </div>
 <<run App.UI.tabbar.handlePreSelectedTab($tabChoice.secBarracks)>>
 <div id="Bots" class="tab-content">
diff --git a/src/Mods/SecExp/edicts.tw b/src/Mods/SecExp/edicts.tw
index 1c00e29feed..957ac456ce0 100644
--- a/src/Mods/SecExp/edicts.tw
+++ b/src/Mods/SecExp/edicts.tw
@@ -5,9 +5,9 @@
 //Passing any edict will cost <<print cashFormat(5000)>> and some authority. More edicts will become available as the arcology develops.//
 <<run App.UI.tabbar.handlePreSelectedTab($tabChoice.edicts)>>
 <br>
-<button class="tablinks" onclick="App.UI.tabbar.openTab(event, 'Society')" id="tab Society">Society</button>
+<button class="tab-links" onclick="App.UI.tabbar.openTab(event, 'Society')" id="tab Society">Society</button>
 <<if $battlesCount > 0 || $rebellionsCount > 0 || $mercenaries > 0>>
-	<button class="tablinks" onclick="App.UI.tabbar.openTab(event, 'Military')" id="tab Military">Military</button>
+	<button class="tab-links" onclick="App.UI.tabbar.openTab(event, 'Military')" id="tab Military">Military</button>
 <</if>>
 
 <div id="Society" class="tab-content">
diff --git a/src/Mods/SpecialForce/Firebase.tw b/src/Mods/SpecialForce/Firebase.tw
index 0ac357d8f6e..a477569fe83 100644
--- a/src/Mods/SpecialForce/Firebase.tw
+++ b/src/Mods/SpecialForce/Firebase.tw
@@ -30,10 +30,10 @@
 	<<run App.UI.tabbar.handlePreSelectedTab($tabChoice.Firebase)>>
 	<div class="tab-bar">
 		<<if _size !== _max>>
-			<button class="tablinks" onclick="App.UI.tabbar.openTab(event, 'Upgrades')" id="tab Upgrades">Upgrades</button>
+			<button class="tab-links" onclick="App.UI.tabbar.openTab(event, 'Upgrades')" id="tab Upgrades">Upgrades</button>
 		<</if>>
-		<button class="tablinks" onclick="App.UI.tabbar.openTab(event, 'Actions')" id="tab Actions">Actions</button>
-		<button class="tablinks" onclick="App.UI.tabbar.openTab(event, 'FS')" id="tab FS">Future Societies</button>
+		<button class="tab-links" onclick="App.UI.tabbar.openTab(event, 'Actions')" id="tab Actions">Actions</button>
+		<button class="tab-links" onclick="App.UI.tabbar.openTab(event, 'FS')" id="tab FS">Future Societies</button>
 	</div>
 
 	<div id="Upgrades" class="tab-content">
diff --git a/src/events/intro/introSummary.tw b/src/events/intro/introSummary.tw
index 108a10c3041..8f268af067f 100644
--- a/src/events/intro/introSummary.tw
+++ b/src/events/intro/introSummary.tw
@@ -98,10 +98,10 @@ You may review your settings before clicking "Continue" to begin.<br>
 <<run App.UI.tabbar.handlePreSelectedTab($tabChoice.IntroSummary)>>
 
 <div class="tab-bar">
-	<button class="tablinks" onclick="App.UI.tabbar.openTab(event, 'World')" id="tab World">World</button>
-	<button class="tablinks" onclick="App.UI.tabbar.openTab(event, 'slaves')" id="tab slaves">Slaves</button>
-	<button class="tablinks" onclick="App.UI.tabbar.openTab(event, 'PC')" id="tab PC">Player Character</button>
-	<button class="tablinks" onclick="App.UI.tabbar.openTab(event, 'UI')" id="tab UI">UI</button>
+	<button class="tab-links" onclick="App.UI.tabbar.openTab(event, 'World')" id="tab World">World</button>
+	<button class="tab-links" onclick="App.UI.tabbar.openTab(event, 'slaves')" id="tab slaves">Slaves</button>
+	<button class="tab-links" onclick="App.UI.tabbar.openTab(event, 'PC')" id="tab PC">Player Character</button>
+	<button class="tab-links" onclick="App.UI.tabbar.openTab(event, 'UI')" id="tab UI">UI</button>
 </div>
 
 <div id="UI" class="tab-content">
diff --git a/src/facilities/nursery/nursery.tw b/src/facilities/nursery/nursery.tw
index ab79855ef37..01b3b0cfddc 100644
--- a/src/facilities/nursery/nursery.tw
+++ b/src/facilities/nursery/nursery.tw
@@ -97,9 +97,9 @@
 </p>
 
 <div class="tab-bar">
-	/* <button class="tablinks" onclick="App.UI.tabbar.openTab(event, 'nannies')" id="tab nannies">Nannies</button> */
-	<button class="tablinks" onclick="App.UI.tabbar.openTab(event, 'pregnantSlaves')" id="tab pregnantSlaves">Pregnant Slaves</button>
-	<button class="tablinks" onclick="App.UI.tabbar.openTab(event, 'children')" id="tab children">Children</button>
+	/* <button class="tab-links" onclick="App.UI.tabbar.openTab(event, 'nannies')" id="tab nannies">Nannies</button> */
+	<button class="tab-links" onclick="App.UI.tabbar.openTab(event, 'pregnantSlaves')" id="tab pregnantSlaves">Pregnant Slaves</button>
+	<button class="tab-links" onclick="App.UI.tabbar.openTab(event, 'children')" id="tab children">Children</button>
 </div>
 
 /*
diff --git a/src/gui/options/options.tw b/src/gui/options/options.tw
index ee3820525a8..d955bfbaa31 100644
--- a/src/gui/options/options.tw
+++ b/src/gui/options/options.tw
@@ -70,11 +70,11 @@
 <<run App.UI.tabbar.handlePreSelectedTab($tabChoice.Options)>>
 
 <div class="tab-bar">
-	<button class="tablinks" onclick="App.UI.tabbar.openTab(event, 'Display')" id="tab Display">Display</button>
-	<button class="tablinks" onclick="App.UI.tabbar.openTab(event, 'CONTENT&FLAVOR')" id="tab CONTENT&FLAVOR">Content & flavour</button>
-	<button class="tablinks" onclick="App.UI.tabbar.openTab(event, 'MODS')" id="tab MODS">Mods</button>
-	<button class="tablinks" onclick="App.UI.tabbar.openTab(event, 'DEBUG/CHEATING')" id="tab DEBUG/CHEATING">Debug/cheating</button>
-	<button class="tablinks" onclick="App.UI.tabbar.openTab(event, 'Experimental')" id="tab Experimental">Experimental</button>
+	<button class="tab-links" onclick="App.UI.tabbar.openTab(event, 'Display')" id="tab Display">Display</button>
+	<button class="tab-links" onclick="App.UI.tabbar.openTab(event, 'CONTENT&FLAVOR')" id="tab CONTENT&FLAVOR">Content & flavour</button>
+	<button class="tab-links" onclick="App.UI.tabbar.openTab(event, 'MODS')" id="tab MODS">Mods</button>
+	<button class="tab-links" onclick="App.UI.tabbar.openTab(event, 'DEBUG/CHEATING')" id="tab DEBUG/CHEATING">Debug/cheating</button>
+	<button class="tab-links" onclick="App.UI.tabbar.openTab(event, 'Experimental')" id="tab Experimental">Experimental</button>
 </div>
 
 <div id="Display" class="tab-content">
diff --git a/src/interaction/policies/policies.tw b/src/interaction/policies/policies.tw
index 8a0c8d80952..260306b0563 100644
--- a/src/interaction/policies/policies.tw
+++ b/src/interaction/policies/policies.tw
@@ -28,12 +28,12 @@
 	More policies will become available as the arcology develops.
 </p>
 <div class="tab-bar">
-	<button class="tablinks" onclick="App.UI.tabbar.openTab(event, 'SMRs')" id="tab SMRs">Slave Market Regulations</button>
-	<button class="tablinks" onclick="App.UI.tabbar.openTab(event, 'ST')" id="tab ST">Sexual Trendsetting</button>
-	<button class="tablinks" onclick="App.UI.tabbar.openTab(event, 'Population')" id="tab Population">Population & Domestic</button>
-	<button class="tablinks" onclick="App.UI.tabbar.openTab(event, 'Education')" id="tab Education">Education</button>
-	<button class="tablinks" onclick="App.UI.tabbar.openTab(event, 'FS')" id="tab FS">Future Societies</button>
-	<button class="tablinks" onclick="App.UI.tabbar.openTab(event, 'SRP')" id="tab SRP">Slave Retirement Planning</button>
+	<button class="tab-links" onclick="App.UI.tabbar.openTab(event, 'SMRs')" id="tab SMRs">Slave Market Regulations</button>
+	<button class="tab-links" onclick="App.UI.tabbar.openTab(event, 'ST')" id="tab ST">Sexual Trendsetting</button>
+	<button class="tab-links" onclick="App.UI.tabbar.openTab(event, 'Population')" id="tab Population">Population & Domestic</button>
+	<button class="tab-links" onclick="App.UI.tabbar.openTab(event, 'Education')" id="tab Education">Education</button>
+	<button class="tab-links" onclick="App.UI.tabbar.openTab(event, 'FS')" id="tab FS">Future Societies</button>
+	<button class="tab-links" onclick="App.UI.tabbar.openTab(event, 'SRP')" id="tab SRP">Slave Retirement Planning</button>
 </div>
 
 <div id="SMRs" class="tab-content">
diff --git a/src/js/rulesAssistantOptions.js b/src/js/rulesAssistantOptions.js
index 1f6a99430c7..a12f0ca42cc 100644
--- a/src/js/rulesAssistantOptions.js
+++ b/src/js/rulesAssistantOptions.js
@@ -222,7 +222,7 @@ globalThis.rulesAssistantOptions = (function() {
 
 		static makeTabButton(name, text) {
 			const btn = document.createElement("button");
-			btn.className = "tablinks";
+			btn.className = "tab-links";
 			btn.id = `tab ${name}`;
 			btn.innerHTML = text;
 			btn.onclick = (event) => App.UI.tabbar.openTab(event, name);
diff --git a/src/js/utilsSC.js b/src/js/utilsSC.js
index fbdb8c98615..a5319a21cf3 100644
--- a/src/js/utilsSC.js
+++ b/src/js/utilsSC.js
@@ -160,7 +160,7 @@ App.UI.tabbar = function() {
 		for (let i = 0; i < tabcontent.length; i++) {
 			tabcontent[i].style.display = "none";
 		}
-		const tablinks = document.getElementsByClassName("tablinks");
+		const tablinks = document.getElementsByClassName("tab-links");
 		for (let i = 0; i < tablinks.length; i++) {
 			tablinks[i].className = tablinks[i].className.replace(" active", "");
 		}
@@ -175,7 +175,7 @@ App.UI.tabbar = function() {
 	 * @returns {string}
 	 */
 	function tabButton(name, text) {
-		return `<button class="tablinks" onclick="App.UI.tabbar.openTab(event, '${name}')" id="tab ${name}">${text}</button>`;
+		return `<button class="tab-links" onclick="App.UI.tabbar.openTab(event, '${name}')" id="tab ${name}">${text}</button>`;
 	}
 
 	/**
@@ -187,7 +187,7 @@ App.UI.tabbar = function() {
 	function tabButtonDOM(name, text, plainLink = false) {
 		if (plainLink) {
 			const link = document.createElement("a");
-			link.classList.add("tablinks", "pure");
+			link.classList.add("tab-links", "pure");
 			link.id = `tab ${name}`;
 			link.textContent = text;
 			link.addEventListener('click', event => {
@@ -196,7 +196,7 @@ App.UI.tabbar = function() {
 			return link;
 		} else {
 			const button = document.createElement("button");
-			button.classList.add("tablinks");
+			button.classList.add("tab-links");
 			button.id = `tab ${name}`;
 			button.textContent = text;
 			button.addEventListener('click', event => {
diff --git a/src/npc/slaveStats.tw b/src/npc/slaveStats.tw
index 6efbb5c0b47..5a72a97d45f 100644
--- a/src/npc/slaveStats.tw
+++ b/src/npc/slaveStats.tw
@@ -72,13 +72,13 @@ Expenses: <<= num($activeSlave.lastWeeksRepExpenses)>>,
 Income: <<= num($activeSlave.lastWeeksRepIncome)>>
 
 <div class="tab-bar">
-	<button class="tablinks" onclick="App.UI.tabbar.openTab(event, 'Skills')" id="tab Skills">Skills</button>
-	<button class="tablinks" onclick="App.UI.tabbar.openTab(event, 'Mental')" id="tab Mental">Mental</button>
-	<button class="tablinks" onclick="App.UI.tabbar.openTab(event, 'Body')" id="tab Body">Body</button>
-	<button class="tablinks" onclick="App.UI.tabbar.openTab(event, 'Porn')" id="tab Porn">Porn</button>
-	<button class="tablinks" onclick="App.UI.tabbar.openTab(event, 'Implants_Piercings_Tattoos')" id="tab Implants_Piercings_Tattoos">Implants, piercings & tattoos</button>
-	<button class="tablinks" onclick="App.UI.tabbar.openTab(event, 'Family')" id="tab Family">Family</button>
-	<button class="tablinks" onclick="App.UI.tabbar.openTab(event, 'Misc')" id="tab Misc">Misc</button>
+	<button class="tab-links" onclick="App.UI.tabbar.openTab(event, 'Skills')" id="tab Skills">Skills</button>
+	<button class="tab-links" onclick="App.UI.tabbar.openTab(event, 'Mental')" id="tab Mental">Mental</button>
+	<button class="tab-links" onclick="App.UI.tabbar.openTab(event, 'Body')" id="tab Body">Body</button>
+	<button class="tab-links" onclick="App.UI.tabbar.openTab(event, 'Porn')" id="tab Porn">Porn</button>
+	<button class="tab-links" onclick="App.UI.tabbar.openTab(event, 'Implants_Piercings_Tattoos')" id="tab Implants_Piercings_Tattoos">Implants, piercings & tattoos</button>
+	<button class="tab-links" onclick="App.UI.tabbar.openTab(event, 'Family')" id="tab Family">Family</button>
+	<button class="tab-links" onclick="App.UI.tabbar.openTab(event, 'Misc')" id="tab Misc">Misc</button>
 </div>
 
 <div id="Skills" class="tab-content">
diff --git a/src/npc/startingGirls/startingGirls.tw b/src/npc/startingGirls/startingGirls.tw
index d7c5f90839f..38fac03a614 100644
--- a/src/npc/startingGirls/startingGirls.tw
+++ b/src/npc/startingGirls/startingGirls.tw
@@ -365,16 +365,16 @@
 <h2>You are customizing this slave:</h2> <<includeDOM App.Desc.longSlave(V.activeSlave, {market: "generic"})>>
 
 <div class="tab-bar">
-	<button class="tablinks" onclick="App.UI.tabbar.openTab(event, 'Overview')" id="tab Overview">Overview</button>
-	<button class="tablinks" onclick="App.UI.tabbar.openTab(event, 'Physical')" id="tab Physical">Physical</button>
-	<button class="tablinks" onclick="App.UI.tabbar.openTab(event, 'Mental')" id="tab Mental">Mental</button>
-	<button class="tablinks" onclick="App.UI.tabbar.openTab(event, 'Skills')" id="tab Skills">Skills</button>
-	<button class="tablinks" onclick="App.UI.tabbar.openTab(event, 'Family', App.StartingGirls.uncommittedFamilyTree(V.activeSlave))" id="tab Family">Family</button>
-	<button class="tablinks" onclick="App.UI.tabbar.openTab(event, 'Customization')" id="tab Customization">Customization</button>
+	<button class="tab-links" onclick="App.UI.tabbar.openTab(event, 'Overview')" id="tab Overview">Overview</button>
+	<button class="tab-links" onclick="App.UI.tabbar.openTab(event, 'Physical')" id="tab Physical">Physical</button>
+	<button class="tab-links" onclick="App.UI.tabbar.openTab(event, 'Mental')" id="tab Mental">Mental</button>
+	<button class="tab-links" onclick="App.UI.tabbar.openTab(event, 'Skills')" id="tab Skills">Skills</button>
+	<button class="tab-links" onclick="App.UI.tabbar.openTab(event, 'Family', App.StartingGirls.uncommittedFamilyTree(V.activeSlave))" id="tab Family">Family</button>
+	<button class="tab-links" onclick="App.UI.tabbar.openTab(event, 'Customization')" id="tab Customization">Customization</button>
 	<<if $cash >= _slaveCost>>
-		<button class="tablinks" onclick="App.UI.tabbar.openTab(event, 'assignRemove')" id="tab assignRemove">Finalize</button>
+		<button class="tab-links" onclick="App.UI.tabbar.openTab(event, 'assignRemove')" id="tab assignRemove">Finalize</button>
 	<<else>>
-		<button class="tablinks, show-warning" onclick="App.UI.tabbar.openTab(event, 'assignRemove')" id="tab assignRemove">Finalize</button>
+		<button class="tab-links, show-warning" onclick="App.UI.tabbar.openTab(event, 'assignRemove')" id="tab assignRemove">Finalize</button>
 	<</if>>
 </div>
 
diff --git a/src/personalAssistant/assistantOptions.tw b/src/personalAssistant/assistantOptions.tw
index 05b0cd5c09e..3b5819c7501 100644
--- a/src/personalAssistant/assistantOptions.tw
+++ b/src/personalAssistant/assistantOptions.tw
@@ -29,11 +29,11 @@ Seated at your desk, you glance at the visual representation of
 
 <<run App.UI.tabbar.handlePreSelectedTab($tabChoice.Assistant)>>
 <div class="tab-bar">
-	<button class="tablinks" onclick="App.UI.tabbar.openTab(event, 'upgrades')" id="tab upgrades">Computer Core Upgrades</button>
+	<button class="tab-links" onclick="App.UI.tabbar.openTab(event, 'upgrades')" id="tab upgrades">Computer Core Upgrades</button>
 	<<if $week >= 11>>
-		<button class="tablinks" onclick="App.UI.tabbar.openTab(event, 'settings')" id="tab settings">Settings</button>
+		<button class="tab-links" onclick="App.UI.tabbar.openTab(event, 'settings')" id="tab settings">Settings</button>
 		<<if $assistant.personality != 0>>
-			<button class="tablinks" onclick="App.UI.tabbar.openTab(event, 'appearance')" id="tab appearance">Appearance</button>
+			<button class="tab-links" onclick="App.UI.tabbar.openTab(event, 'appearance')" id="tab appearance">Appearance</button>
 		<</if>>
 	<</if>>
 </div>
diff --git a/src/uncategorized/economics.tw b/src/uncategorized/economics.tw
index 9d537e077b0..6921cffd81d 100644
--- a/src/uncategorized/economics.tw
+++ b/src/uncategorized/economics.tw
@@ -49,22 +49,22 @@
 <body>
 
 <div class="tab-bar">
-	<button class="tablinks" onclick="App.UI.tabbar.openTab(event, 'Arcologies')" id="defaultOpen">Arcologies</button>
-	<button class="tablinks" onclick="App.UI.tabbar.openTab(event, 'Management')">Arcology Management</button>
+	<button class="tab-links" onclick="App.UI.tabbar.openTab(event, 'Arcologies')" id="defaultOpen">Arcologies</button>
+	<button class="tab-links" onclick="App.UI.tabbar.openTab(event, 'Management')">Arcology Management</button>
 	<<if $FSAnnounced > 0>>
-		<button class="tablinks" onclick="App.UI.tabbar.openTab(event, 'Societies')">Society Development</button>
+		<button class="tab-links" onclick="App.UI.tabbar.openTab(event, 'Societies')">Society Development</button>
 	<</if>>
 	<<if $corp.Incorporated == 1>>
-		<button class="tablinks" onclick="App.UI.tabbar.openTab(event, 'Corporation')">Corporation Developments</button>
+		<button class="tab-links" onclick="App.UI.tabbar.openTab(event, 'Corporation')">Corporation Developments</button>
 	<</if>>
 	<<if $secExpEnabled > 0>>
-		<button class="tablinks" onclick="App.UI.tabbar.openTab(event, 'Authority')">Authority</button>
-		<button class="tablinks" onclick="App.UI.tabbar.openTab(event, 'securityReport')">Security</button>
+		<button class="tab-links" onclick="App.UI.tabbar.openTab(event, 'Authority')">Authority</button>
+		<button class="tab-links" onclick="App.UI.tabbar.openTab(event, 'securityReport')">Security</button>
 	<</if>>
-	<button class="tablinks" onclick="App.UI.tabbar.openTab(event, 'Reputation')">Reputation</button>
-	<button class="tablinks" onclick="App.UI.tabbar.openTab(event, 'Business')">Personal Business</button>
+	<button class="tab-links" onclick="App.UI.tabbar.openTab(event, 'Reputation')">Reputation</button>
+	<button class="tab-links" onclick="App.UI.tabbar.openTab(event, 'Business')">Personal Business</button>
 	<<if $PC.boobs >= 1000 || $PC.pregKnown == 1 || $playerAging != 0>>
-		<button class="tablinks" onclick="App.UI.tabbar.openTab(event, 'Personal')">Personal Notes</button>
+		<button class="tab-links" onclick="App.UI.tabbar.openTab(event, 'Personal')">Personal Notes</button>
 	<</if>>
 </div>
 
diff --git a/src/uncategorized/remoteSurgery.tw b/src/uncategorized/remoteSurgery.tw
index e6d576e697b..b314d960197 100644
--- a/src/uncategorized/remoteSurgery.tw
+++ b/src/uncategorized/remoteSurgery.tw
@@ -63,12 +63,12 @@
 </div>
 
 <div class="tab-bar">
-	<button class="tablinks" onclick="App.UI.tabbar.openTab(event, 'hairFace')" id="tab hairFace">Hair and Face</button>
-	<button class="tablinks" onclick="App.UI.tabbar.openTab(event, 'upper')" id="tab upper">Upper</button>
-	<button class="tablinks" onclick="App.UI.tabbar.openTab(event, 'lower')" id="tab lower">Lower</button>
-	<button class="tablinks" onclick="App.UI.tabbar.openTab(event, 'Race')" id="tab Race">Race</button>
-	<button class="tablinks" onclick="App.UI.tabbar.openTab(event, 'Structural')" id="tab Structural">Structural</button>
-	<button class="tablinks" onclick="App.UI.tabbar.openTab(event, 'ExtremeSurgery')" id="tab ExtremeSurgery">Extreme Surgery</button>
+	<button class="tab-links" onclick="App.UI.tabbar.openTab(event, 'hairFace')" id="tab hairFace">Hair and Face</button>
+	<button class="tab-links" onclick="App.UI.tabbar.openTab(event, 'upper')" id="tab upper">Upper</button>
+	<button class="tab-links" onclick="App.UI.tabbar.openTab(event, 'lower')" id="tab lower">Lower</button>
+	<button class="tab-links" onclick="App.UI.tabbar.openTab(event, 'Race')" id="tab Race">Race</button>
+	<button class="tab-links" onclick="App.UI.tabbar.openTab(event, 'Structural')" id="tab Structural">Structural</button>
+	<button class="tab-links" onclick="App.UI.tabbar.openTab(event, 'ExtremeSurgery')" id="tab ExtremeSurgery">Extreme Surgery</button>
 </div>
 
 <div id="hairFace" class="tab-content">
diff --git a/src/uncategorized/slaveInteract.tw b/src/uncategorized/slaveInteract.tw
index cdfc3b42ded..991607d0027 100644
--- a/src/uncategorized/slaveInteract.tw
+++ b/src/uncategorized/slaveInteract.tw
@@ -81,15 +81,15 @@
 	</span>
 </p>
 <div class="tab-bar">
-	<button class="tablinks" onclick="App.UI.tabbar.openTab(event, 'Description'), jQuery('#LSD').empty().append(App.Desc.longSlave(getSlave(V.activeSlave.ID)))" id="tab Description">Description</button>
-	<button class="tablinks" onclick="App.UI.tabbar.openTab(event, 'Modify')" id="tab Modify">Modify</button>
-	<button class="tablinks" onclick="App.UI.tabbar.openTab(event, 'Work')" id="tab Work">Work</button>
-	<button class="tablinks" onclick="App.UI.tabbar.openTab(event, 'Appearance'), App.UI.Wardrobe.refreshAll(getSlave(V.activeSlave.ID))" id="tab Appearance">Appearance</button>
-	<button class="tablinks" onclick="App.UI.tabbar.openTab(event, 'PhysicalRegimen')" id="tab PhysicalRegimen">Physical Regimen</button>
-	<button class="tablinks" onclick="App.UI.tabbar.openTab(event, 'Rules')" id="tab Rules">Rules</button>
-	<button class="tablinks" onclick="App.UI.tabbar.openTab(event, 'Financial')" id="tab Financial">Financial</button>
-	<button class="tablinks" onclick="App.UI.tabbar.openTab(event, 'Customize'), App.UI.SlaveInteract.custom(getSlave(V.activeSlave.ID))" id="tab Customize">Customize</button>
-	<button class="tablinks" onclick="App.UI.tabbar.openTab(event, 'FamilyTab'), renderFamilyTree(V.slaves, V.activeSlave.ID)" id="tab FamilyTab">Family</button>
+	<button class="tab-links" onclick="App.UI.tabbar.openTab(event, 'Description'), jQuery('#LSD').empty().append(App.Desc.longSlave(getSlave(V.activeSlave.ID)))" id="tab Description">Description</button>
+	<button class="tab-links" onclick="App.UI.tabbar.openTab(event, 'Modify')" id="tab Modify">Modify</button>
+	<button class="tab-links" onclick="App.UI.tabbar.openTab(event, 'Work')" id="tab Work">Work</button>
+	<button class="tab-links" onclick="App.UI.tabbar.openTab(event, 'Appearance'), App.UI.Wardrobe.refreshAll(getSlave(V.activeSlave.ID))" id="tab Appearance">Appearance</button>
+	<button class="tab-links" onclick="App.UI.tabbar.openTab(event, 'PhysicalRegimen')" id="tab PhysicalRegimen">Physical Regimen</button>
+	<button class="tab-links" onclick="App.UI.tabbar.openTab(event, 'Rules')" id="tab Rules">Rules</button>
+	<button class="tab-links" onclick="App.UI.tabbar.openTab(event, 'Financial')" id="tab Financial">Financial</button>
+	<button class="tab-links" onclick="App.UI.tabbar.openTab(event, 'Customize'), App.UI.SlaveInteract.custom(getSlave(V.activeSlave.ID))" id="tab Customize">Customize</button>
+	<button class="tab-links" onclick="App.UI.tabbar.openTab(event, 'FamilyTab'), renderFamilyTree(V.slaves, V.activeSlave.ID)" id="tab FamilyTab">Family</button>
 </div>
 
 <div id="artFrame">
diff --git a/src/uncategorized/underperformingSlaves.tw b/src/uncategorized/underperformingSlaves.tw
index eb95a581f25..9effeb9039a 100644
--- a/src/uncategorized/underperformingSlaves.tw
+++ b/src/uncategorized/underperformingSlaves.tw
@@ -21,8 +21,8 @@
 </p>
 <<run App.UI.tabbar.handlePreSelectedTab($tabChoice.Options)>>
 <div class="tab-bar">
-	<button class="tablinks" onclick="App.UI.tabbar.openTab(event, 'highSale')" id="tab highSale">Worth much but earning little</button>
-	<button class="tablinks" onclick="App.UI.tabbar.openTab(event, 'expensive')" id="tab expensive">Costing vs earning</button>
+	<button class="tab-links" onclick="App.UI.tabbar.openTab(event, 'highSale')" id="tab highSale">Worth much but earning little</button>
+	<button class="tab-links" onclick="App.UI.tabbar.openTab(event, 'expensive')" id="tab expensive">Costing vs earning</button>
 </div>
 
 <div id="highSale" class="tab-content">
-- 
GitLab