diff --git a/src/contact.html b/src/contact.html
index f4a4d1e..1d53f6a 100644
--- a/src/contact.html
+++ b/src/contact.html
@@ -6,10 +6,9 @@
Contact
+
+>
diff --git a/src/events.html b/src/events.html
index 7ff1126..1d88e0f 100644
--- a/src/events.html
+++ b/src/events.html
@@ -5,10 +5,10 @@
---
Events
+
+
+>
diff --git a/src/scripts/app.js b/src/scripts/app.js
index 8685621..4cfb94b 100644
--- a/src/scripts/app.js
+++ b/src/scripts/app.js
@@ -30,4 +30,14 @@ $(document).ready(() => {
localStorage.setItem('theme', newTheme);
applyTheme(newTheme);
});
+
+ // iframe loading
+ const iframe = document.querySelector('iframe');
+ if (iframe) {
+ setTimeout(() => {
+ iframe.style.visibility = 'visible';
+ const loadingIcon = document.querySelector('.loading-icon');
+ loadingIcon.style.display = 'none';
+ }, 2000);
+ }
});
diff --git a/src/styles/style.css b/src/styles/style.css
index f90a4a8..d218559 100644
--- a/src/styles/style.css
+++ b/src/styles/style.css
@@ -341,6 +341,7 @@ iframe {
border-radius: 1rem;
background-color: var(--white);
overflow: hidden;
+ visibility: hidden;
}
.day-mode iframe {
@@ -352,6 +353,25 @@ iframe {
box-shadow: 0px 4px 6px rgba(128, 128, 128, 0.45);
}
+.loading-icon {
+ width: 50px;
+ height: 50px;
+ border: 5px solid var(--day-blue);
+ border-top: 5px solid var(--day-purple);
+ border-radius: 50%;
+ animation: spin 3s linear infinite;
+ margin: 0 auto;
+}
+
+@keyframes spin {
+ 0% {
+ transform: rotate(0deg);
+ }
+ 100% {
+ transform: rotate(360deg);
+ }
+}
+
/* home */
.tagline {