diff --git a/overlay/index.html b/overlay/index.html
index 87dca2a..c3bb03c 100644
--- a/overlay/index.html
+++ b/overlay/index.html
@@ -8,6 +8,7 @@
+ Loading
diff --git a/src/js/overlay.js b/src/js/overlay.js
index 897e3cd..9e867f6 100644
--- a/src/js/overlay.js
+++ b/src/js/overlay.js
@@ -32,7 +32,10 @@ let lastMatchId = '';
let win = 0;
let lose = 0;
-document.querySelector('#overlay').innerHTML = `
+const loading = document.querySelector("#loading");
+const overlay = document.querySelector("#overlay");
+
+overlay.innerHTML = `
@@ -54,6 +57,7 @@ document.querySelector('#overlay').innerHTML = `
`
+overlay.style.display = "none";
// Elements
const imgRank = document.getElementById("imgRank");
@@ -78,6 +82,8 @@ async function main(nickname, tag) {
await decorateCard()
await checkData(region, puuid)
+ loading.remove()
+ overlay.style.display = "block";
setIntervalAsync(checkData, 30000, region, puuid);
}
diff --git a/src/scss/main.scss b/src/scss/main.scss
index 295d7b4..43e361c 100644
--- a/src/scss/main.scss
+++ b/src/scss/main.scss
@@ -426,6 +426,7 @@ input.nickname {
background-repeat: no-repeat;
background-size: cover;
position: relative;
+ overflow: hidden;
&::after {
content: "";
position: absolute;
diff --git a/src/scss/overlay.scss b/src/scss/overlay.scss
index d420120..4de89cf 100644
--- a/src/scss/overlay.scss
+++ b/src/scss/overlay.scss
@@ -40,6 +40,7 @@ body {
box-sizing: border-box;
overflow: hidden;
}
+
#elements {
display: flex;
flex-direction: row;