Working noscript message

fileformat · fileformat · commit 0fac48dfd8d9 · 2025-11-01T11:02:20.000-04:00
diff --git a/src/index.html b/src/index.html
@@ -22,7 +22,7 @@
 
 <body class="h-100">
 	<script type="module" src="./index.ts"></script>
-	<div class="scriptonly" id="loading">
+	<div class="d-flex h-100 w-100 align-items-center justify-content-center scriptonly" id="loading">
 		<img src="/images/spinner.gif" alt="Loading..." />
 	</div>
 	<div id="emojitable" style="display:none">
@@ -37,7 +37,7 @@
 		<div class="d-flex flex-column justify-content-center align-items-center w-100 h-100">
 			<div class="d-flex flex-row align-items-center alert alert-danger m-3" role="alert">
 				<img class="pe-2" src="/images/stop.svg" alt="Error" width="100" height="100" />
-				<span class="fs-4">EmojiSearch requires JavaScript. Try <a href="https://www.fileformat.info/info/emoji/">FileFormat.Info</a> to search without Javascript.</span>
+				<span class="fs-4">EmojiSearch requires JavaScript. Try <a href="https://www.fileformat.info/info/emoji/list.htm">FileFormat.Info</a> to search without Javascript.</span>
 			</div>
 		</div>
 	</noscript>
diff --git a/src/index.ts b/src/index.ts
@@ -452,7 +452,7 @@ async function main() {
 		}
 	});
 
-	document.getElementById("loading")!.style.display = "none";
+	document.getElementById("loading")!.classList.add("d-none");
 	document.getElementById("emojitable")!.style.display = "block";
 }
 
diff --git a/src/styles.css b/src/styles.css
@@ -7,17 +7,9 @@ html, body {
 }
 
 body {
-  background-color: #f0f0f0;
   font-family: sans-serif;
 }
 
-div#loading {
-    width: 100%;
-    height: 100%;
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    background-color: white;
-}
+
 
 

Original file line number	Diff line number	Diff line change
`@@ -452,7 +452,7 @@ async function main() {`
`452`	`452`	`}`
`453`	`453`	`});`
`454`	`454`
`455`		`- document.getElementById("loading")!.style.display = "none";`
	`455`	`+ document.getElementById("loading")!.classList.add("d-none");`
`456`	`456`	`document.getElementById("emojitable")!.style.display = "block";`
`457`	`457`	`}`
`458`	`458`