diff options
| author | Jan Tuomi <jans.tuomi@gmail.com> | 2021-06-30 14:34:01 +0300 |
|---|---|---|
| committer | Jan Tuomi <jans.tuomi@gmail.com> | 2021-06-30 14:34:01 +0300 |
| commit | f80b6fd6c7d7e6394cf1d5df4b8fe418348d629b (patch) | |
| tree | 656d198aa583c5750ec79610d8ce947fa3098a62 /frontend/pages/index.tsx | |
| parent | 752b96afdf2fa285492deaf3a676d2b2c2e47c9f (diff) | |
Add tomi
Diffstat (limited to 'frontend/pages/index.tsx')
| -rw-r--r-- | frontend/pages/index.tsx | 19 |
1 files changed, 15 insertions, 4 deletions
diff --git a/frontend/pages/index.tsx b/frontend/pages/index.tsx index 4f3f4af..27cabb7 100644 --- a/frontend/pages/index.tsx +++ b/frontend/pages/index.tsx @@ -1,8 +1,8 @@ import Head from "next/head"; import { ReactElement, useEffect, useState } from "react"; import { io } from "socket.io-client"; -import styles from "../styles/Home.module.css"; import * as config from "../config"; +import styles from "../styles/Home.module.css"; const socket = io(config.backendUrl); @@ -26,20 +26,31 @@ const Home = (): ReactElement => { socket.emit("increment"); }; + const rotateDeg = value !== undefined ? 10 * value : 0; + return ( <div className={styles.container}> <Head> <title>tomi.science</title> <meta name="description" content="Tomi Koskinen's academic portfolio" /> - <link rel="icon" href="/favicon.ico" /> + <link rel="icon" href="/tomi_sq.png" /> </Head> - <div> + <button onClick={increment} className={styles.tomiBtn} style={{ + transform: `rotate(${rotateDeg}deg)`, + }}> + <div className={styles.btnInner}> + <span className={styles.counter}>{value}</span> + { /* eslint-disable-next-line @next/next/no-img-element */ } + <img src="/tomi_sq.png" alt="" /> + </div> + </button> + {/* <div> value: {value} </div> <div> <button onClick={increment}>increment</button> - </div> + </div> */} </div> ); }; |