diff --git a/public/script.js b/public/script.js
new file mode 100644
index 0000000..6dbe88e
--- /dev/null
+++ b/public/script.js
@@ -0,0 +1,26 @@
+async function fetchApproved() {
+  try {
+    const response = await fetch('/api/approved');
+    const data = await response.json();
+    return data;
+  } catch (error) {
+    console.error('Error fetching approved data:', error);
+    return [];
+  }
+}
+
+async function updateTicker() {
+  const approvedData = await fetchApproved();
+  const tickerContent = approvedData
+    .map(entry => `${entry.name} (${entry.location}): ${entry.comment}`)
+    .join(' – ');
+
+  const tickerElement = document.getElementById('ticker-content');
+  tickerElement.textContent = tickerContent;
+}
+
+// Fetch on load
+updateTicker();
+
+// Refresh every 30 seconds (adjust as needed)
+setInterval(updateTicker, 30000);
diff --git a/public/syle.css b/public/syle.css
new file mode 100644
index 0000000..afa62bd
--- /dev/null
+++ b/public/syle.css
@@ -0,0 +1,40 @@
+/* Basic layout */
+body {
+    margin: 0;
+    font-family: sans-serif;
+    background: #f0f0f0;
+}
+
+h1 {
+    text-align: center;
+    padding: 1rem;
+}
+
+/* Ticker styles */
+#ticker-container {
+    position: fixed;
+    bottom: 0;
+    width: 100%;
+    background-color: #333;
+    color: #fff;
+    height: 40px;
+    display: flex;
+    align-items: center;
+    overflow: hidden;
+}
+
+#ticker-content {
+    white-space: nowrap;
+    animation: ticker 20s linear infinite;
+    padding-left: 100%;
+}
+
+@keyframes ticker {
+    0% {
+        transform: translateX(0);
+    }
+
+    100% {
+        transform: translateX(-100%);
+    }
+}
\ No newline at end of file