Team_Website/Pages/shop.html
2024-09-19 09:56:01 -07:00

73 lines
2.7 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<link
rel="icon"
type="image/x-icon"
href="/Resources/Favicons/favicon.png"
/>
<link rel="stylesheet" href="/Pages/style.css" />
<script src="https://cdn.tailwindcss.com"></script>
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<script>
window.addEventListener("DOMContentLoaded", (event) => {
fetch("/Pages/navbar.html")
.then((response) => response.text())
.then((data) => {
document.getElementById("navbar").innerHTML = data;
});
fetch("/Pages/socials.html")
.then((response) => response.text())
.then((data) => {
document.getElementById("socials").innerHTML = data;
});
});
</script>
</head>
<body class="flex flex-col min-h-screen">
<!--Navigation Bar-->
<header id="navbar" class="mb-16"></header>
<!-- Body -->
<main class="flex-grow flex flex-col">
<div class="flex justify-center items-center">
<h1 class="text-3xl font-bold px-4">Shop</h1>
<img
src="/Resources/Icons/team-icon.png"
class="w-20"
alt="Team Icon"
/>
</div>
<div class="flex-grow relative overflow-auto">
<iframe
class="w-full p-4"
src="https://www.zeffy.com/embed/ticketing/78ec0d8d-12a7-4f4a-9b97-7c9beea43fd5"
style="border: 0; overflow: hidden"
frameborder="0"
allowpaymentrequest
allowTransparency="true"
id="shopIframe"
></iframe>
</div>
<script>
const iframe = document.getElementById("shopIframe");
iframe.onload = function () {
setIframeHeight();
// Optionally, recheck the height every 1 second (1000ms) if the content might change dynamically.
setInterval(setIframeHeight, 1000);
};
function setIframeHeight() {
const iframeDocument =
iframe.contentDocument || iframe.contentWindow.document;
iframe.style.height =
iframeDocument.documentElement.scrollHeight + "px";
}
</script>
</main>
<!-- Footer -->
<div id="socials"></div>
</body>
</html>