aboutsummaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
-rw-r--r--frontend/pages/index.tsx14
-rw-r--r--frontend/styles/Home.module.css1
2 files changed, 14 insertions, 1 deletions
diff --git a/frontend/pages/index.tsx b/frontend/pages/index.tsx
index 16d413d..58b3b56 100644
--- a/frontend/pages/index.tsx
+++ b/frontend/pages/index.tsx
@@ -1,11 +1,23 @@
import Head from "next/head";
import { ReactElement, useEffect, useState } from "react";
import { io } from "socket.io-client";
+import Marquees, { MarqueeLink } from "../components/Marquees/Marquees";
import * as config from "../config";
import styles from "../styles/Home.module.css";
const socket = io(config.backendUrl);
+const mockData: MarqueeLink[] = [
+ { title: "Foobar of Foos and Bars", url: "https://example.com" },
+ { title: "Foobar of Foos and Bars", url: "https://example.com" },
+ { title: "Foobar of Foos and Bars", url: "https://example.com" },
+ { title: "Foobar of Foos and Bars", url: "https://example.com" },
+ { title: "Foobar of Foos and Bars", url: "https://example.com" },
+ { title: "Foobar of Foos and Bars", url: "https://example.com" },
+ { title: "Foobar of Foos and Bars", url: "https://example.com" },
+ { title: "Foobar of Foos and Bars", url: "https://example.com" },
+];
+
const Home = (): ReactElement => {
const [value, setValue] = useState<number | undefined>(undefined);
@@ -37,6 +49,7 @@ const Home = (): ReactElement => {
</Head>
<button onClick={increment} className={styles.tomiBtn} style={{
transform: `rotate(${rotateDeg}deg)`,
+ display: value === undefined ? "none" : "inherit",
}}>
<div className={styles.btnInner}>
<span className={styles.counter}>{value}</span>
@@ -44,6 +57,7 @@ const Home = (): ReactElement => {
<img src="/tomi_sq.png" alt="" />
</div>
</button>
+ <Marquees links={mockData} />
</div>
);
};
diff --git a/frontend/styles/Home.module.css b/frontend/styles/Home.module.css
index 1b82f36..6f43b54 100644
--- a/frontend/styles/Home.module.css
+++ b/frontend/styles/Home.module.css
@@ -2,7 +2,6 @@
min-height: 100vh;
height: 100vh;
width: 100vw;
- padding: 0 0.5rem;
overflow: hidden;
position: relative;
}