Add Web Font Loader to index.html for improved font loading and remove cursive fallback from font-family declarations.

This commit is contained in:
Z. Cliffe Schreuders
2025-04-24 00:33:04 +01:00
parent 38682be9f2
commit 58bb0be6b0

View File

@@ -9,6 +9,22 @@
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Press+Start+2P&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=VT323&display=swap" rel="stylesheet">
<!-- Web Font Loader script to ensure fonts load properly -->
<script src="https://ajax.googleapis.com/ajax/libs/webfont/1.6.26/webfont.js"></script>
<script>
WebFont.load({
google: {
families: ['Press Start 2P', 'VT323']
},
active: function() {
console.log('Fonts loaded successfully');
// If you have a loading screen, you could hide it here
// document.getElementById('loading').style.display = 'none';
}
});
</script>
<style>
body {
margin: 0;
@@ -28,7 +44,7 @@
left: 50%;
transform: translate(-50%, -50%);
color: white;
font-family: 'Press Start 2P', cursive;
font-family: 'Press Start 2P';
font-size: 24px;
display: none;
}
@@ -41,7 +57,7 @@
width: 500px;
max-width: 80%;
z-index: 2000;
font-family: 'Press Start 2P', cursive;
font-family: 'Press Start 2P';
pointer-events: none;
}
@@ -125,7 +141,7 @@
color: white;
box-shadow: 0 2px 15px rgba(0, 0, 0, 0.5);
z-index: 1999;
font-family: 'Press Start 2P', cursive;
font-family: 'Press Start 2P';
display: none;
overflow: hidden;
transition: all 0.3s ease;
@@ -402,7 +418,7 @@
color: white;
box-shadow: 0 2px 15px rgba(0, 0, 0, 0.5);
z-index: 1999;
font-family: 'Press Start 2P', cursive;
font-family: 'Press Start 2P';
display: none;
overflow: hidden;
transition: all 0.3s ease;
@@ -662,7 +678,7 @@
/* border-radius: 5px; */
box-shadow: 0 2px 15px rgba(0, 0, 0, 0.5);
z-index: 1999;
font-family: 'Press Start 2P', cursive;
font-family: 'Press Start 2P';
display: none;
overflow: hidden;
transition: all 0.3s ease;
@@ -1104,7 +1120,7 @@
transform-origin: center; /* Set the origin for scaling */
}
body {
font-family: 'Press Start 2P', 'VT323', cursive;
font-family: 'Press Start 2P', 'VT323';
}
/* Mobile device detection and responsive scaling */