52 lines
1.5 KiB
HTML
52 lines
1.5 KiB
HTML
|
<!DOCTYPE html>
|
||
|
|
<html lang="en">
|
||
|
|
<head>
|
||
|
|
<meta charset="UTF-8" />
|
||
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||
|
|
<title>CSV Boxes</title>
|
||
|
|
<link rel="stylesheet" href="index-styles.css" />
|
||
|
|
</head>
|
||
|
|
<body>
|
||
|
|
<div class="container text-center py-5">
|
||
|
|
<div class="logo-container position-relative">
|
||
|
|
<img src="./pgan_logo.png" alt="PGAN Logo" class="logo mb-4" />
|
||
|
|
<div class="santa-hat"></div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div>
|
||
|
|
<h2>PRIZZES</h2>
|
||
|
|
<div class="boxes" id="low-boxes"></div>
|
||
|
|
</div>
|
||
|
|
<div>
|
||
|
|
<h2>PRIZZES</h2>
|
||
|
|
<div class="boxes" id="high-boxes"></div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
const csvLow = ["3000", "5000", "7000"];
|
||
|
|
const csvHigh = ["10000", "15000", "25000"];
|
||
|
|
|
||
|
|
function createBoxes(data, containerId, nextPage) {
|
||
|
|
const container = document.getElementById(containerId);
|
||
|
|
data.forEach((value) => {
|
||
|
|
const box = document.createElement("div");
|
||
|
|
box.className = "box";
|
||
|
|
box.textContent = value;
|
||
|
|
|
||
|
|
// Add click event to store selected value and navigate
|
||
|
|
box.addEventListener("click", () => {
|
||
|
|
localStorage.setItem("selectedPrice", value); // Save selected price
|
||
|
|
window.location.href = nextPage; // Navigate to the respective page
|
||
|
|
});
|
||
|
|
|
||
|
|
container.appendChild(box);
|
||
|
|
});
|
||
|
|
}
|
||
|
|
|
||
|
|
createBoxes(csvLow, "low-boxes", "offices-low.html");
|
||
|
|
createBoxes(csvHigh, "high-boxes", "offices-high.html");
|
||
|
|
</script>
|
||
|
|
</body>
|
||
|
|
</html>
|