/>
- 
+ 
@@ -184,7 +184,7 @@ Welcome to Hydra Doom
/>
-
+
@@ -201,7 +201,7 @@ Welcome to Hydra Doom
/>
-
+
diff --git a/src/index.ts b/src/index.ts
index 78b8a91e..e974f22d 100644
--- a/src/index.ts
+++ b/src/index.ts
@@ -17,17 +17,6 @@ const { sessionPk } = keys;
let qrCode = await generatePooQrUri();
let qrShown = false;
-function hideQrAndShowCanvas() {
- if (qrCodeWrapper) {
- qrCodeWrapper.style.display = "none";
- }
- if (canvas) {
- canvas.style.width = "100%";
- canvas.style.height = "100%";
- canvas.style.position = "static";
- }
-}
-
async function pollForPoo(ephemeralKey: string) {
const request = await fetch(`https://auth.hydradoom.fun/v1/${ephemeralKey}`);
const status = request.status;
@@ -35,7 +24,6 @@ async function pollForPoo(ephemeralKey: string) {
throw new Error("Invalid Key");
}
if (status === 200) {
- hideQrAndShowCanvas();
startGame();
return;
}
@@ -63,11 +51,7 @@ startButton?.addEventListener("click", async () => {
// Skip QR code
skipButton?.addEventListener("click", () => {
- hideQrAndShowCanvas();
- // Temporarily commented out so we don't start the game twice;
- // in practice, we should only show this skip button if we're showing the QR code,
- // and just start the game immediately if not (if the cabinet key isn't set)
- // startGame();
+ startGame();
});
async function showQrCode() {
@@ -81,6 +65,14 @@ async function showQrCode() {
}
async function startGame() {
+ if (qrCodeWrapper) {
+ qrCodeWrapper.style.display = "none";
+ }
+ if (canvas) {
+ canvas.style.width = "100%";
+ canvas.style.height = "100%";
+ canvas.style.position = "static";
+ }
await fetchNewGame();
if (startButton) {
startButton.style.display = "none";
diff --git a/src/styles.css b/src/styles.css
index c7d7c6f9..1e97f829 100644
--- a/src/styles.css
+++ b/src/styles.css
@@ -307,6 +307,7 @@ main {
}
.logos {
+ align-items: center;
display: flex;
flex-direction: column;
font-size: 0;
@@ -322,8 +323,18 @@ main {
width: 53px;
}
+.iog-logo {
+ align-items: center;
+ background-color: white;
+ border-radius: 100%;
+ display: flex;
+ height: 70px;
+ justify-content: center;
+ width: 70px;
+}
+
.iog-logo img {
- width: 160px;
+ width: 100%;
}
@media (max-width: 1600px) {
@@ -336,9 +347,13 @@ main {
width: 49px;
}
+ .iog-logo {
+ height: 60px;
+ width: 60px;
+ }
+
.iog-logo img {
- width: 130px;
- max-width: initial;
+ width: 100%;
}
}
diff --git a/webpack.config.js b/webpack.config.js
index 93ea657a..7ec08edd 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -56,7 +56,7 @@ module.exports = {
{ from: "assets/images/bg-1-0x.jpg", to: "assets/images" },
{ from: "assets/images/bg-1-5x.jpg", to: "assets/images" },
{ from: "assets/images/sundae-labs-logo.svg", to: "assets/images" },
- { from: "assets/images/iog-logo.svg", to: "assets/images" },
+ { from: "assets/images/iog-logo.png", to: "assets/images" },
],
}),
],