Some tweaks to the options page

src/pages/popup/popup.js

@@ -6,8 +6,8 @@ import utils from "../../assets/javascripts/utils.js"
 
 document.getElementById("more-options").addEventListener("click", () => browser.runtime.openOptionsPage())
 
-const allSites = document.getElementsByClassName("all_sites")[0]
+const allSites = document.getElementById("all_sites")
-const currSite = document.getElementsByClassName("current_site")[0]
+const currSite = document.getElementById("current_site")
 const currentSiteDivider = document.getElementById("current_site_divider")
 
 const config = await utils.getConfig()
@@ -42,7 +42,7 @@ browser.tabs.query({ active: true, currentWindow: true }, async tabs => {
 		url = new URL(tabs[0].url)
 		servicesHelper.switchInstance(url).then(r => {
 			if (r) {
-				document.getElementById("change_instance_div").style.display = "block"
+				document.getElementById("change_instance_div").style.display = ""
 				document.getElementById("change_instance").addEventListener("click", async () =>
 					browser.tabs.update({ url: await servicesHelper.switchInstance(url) })
 				)
@@ -50,7 +50,7 @@ browser.tabs.query({ active: true, currentWindow: true }, async tabs => {
 		})
 		servicesHelper.copyRaw(url, true).then(r => {
 			if (r) {
-				document.getElementById("copy_original_div").style.display = "block"
+				document.getElementById("copy_original_div").style.display = ""
 				document.getElementById("copy_original").addEventListener("click", () =>
 					servicesHelper.copyRaw(url)
 				)
@@ -58,7 +58,7 @@ browser.tabs.query({ active: true, currentWindow: true }, async tabs => {
 		})
 		servicesHelper.reverse(url).then(r => {
 			if (r) {
-				document.getElementById("redirect_to_original_div").style.display = "block"
+				document.getElementById("redirect_to_original_div").style.display = ""
 				document.getElementById("redirect_to_original").addEventListener("click", () =>
 					browser.runtime.sendMessage("reverseTab")
 				)
@@ -66,7 +66,7 @@ browser.tabs.query({ active: true, currentWindow: true }, async tabs => {
 		})
 		servicesHelper.redirectAsync(url, "main_frame", null, true).then(r => {
 			if (r) {
-				document.getElementById("redirect_div").style.display = "block"
+				document.getElementById("redirect_div").style.display = ""
 				document.getElementById("redirect").addEventListener("click", () =>
 					browser.runtime.sendMessage("redirectTab")
 				)
@@ -77,8 +77,7 @@ browser.tabs.query({ active: true, currentWindow: true }, async tabs => {
 	const options = await utils.getOptions()
 
 	// Set visibility of all service buttons
-	for (let i = 0; i < options.popupServices.length; ++i) {
+	for (const service of options.popupServices) {
-		const service = options.popupServices[i]
 		divs[service].all.classList.remove("hide")
 		divs[service].all_toggle.checked = options[service].enabled
 	}
@@ -90,7 +89,7 @@ browser.tabs.query({ active: true, currentWindow: true }, async tabs => {
 			divs[service].all.classList.add("hide")
 			divs[service].current.classList.remove("hide")
 			divs[service].current_toggle.checked = options[service].enabled
-			currentSiteDivider.style.display = "block"
+			currentSiteDivider.style.display = ""
 		}
 	}
 })

src/pages/popup/popup.pug

@@ -6,13 +6,13 @@ html(lang="en")
         link(href="../stylesheets/styles.css" rel="stylesheet")
         link(href="./style.css" rel="stylesheet")
     body(dir="auto")
-        div(class="current_site")
+        div(id="current_site")
-            include /src/pages/widgets/switches
+            include /src/pages/popup/switches
             div(id="current_site_divider" style="display: none")
                 hr
 
-        div(class="all_sites")
+        div(id="all_sites")
-            include /src/pages/widgets/switches
+            include /src/pages/popup/switches
 
         hr
 

src/pages/popup/switches.pug

@@ -1,4 +1,4 @@
-each val, service in services    
+each _, service in services    
     div(class=service + " some-block hide")
         a(class="title" href=services[service].url)
             if services[service].imageType == 'svgMono'