From 1ba2383ef79e5bf4fbfaae9a0e483dc3e55871aa Mon Sep 17 00:00:00 2001 From: Negar Date: Sun, 10 Mar 2024 20:48:26 +0330 Subject: [PATCH] show the number of turns --- src/App.css | 2 +- src/App.js | 8 ++++++++ src/index.css | 16 +--------------- 3 files changed, 10 insertions(+), 16 deletions(-) diff --git a/src/App.css b/src/App.css index 33562a6..95752be 100644 --- a/src/App.css +++ b/src/App.css @@ -1,5 +1,5 @@ .App { - max-width: 860px; + max-width: 590px; margin: 40px auto; } button{ diff --git a/src/App.js b/src/App.js index 03a4571..f66c78d 100644 --- a/src/App.js +++ b/src/App.js @@ -24,6 +24,8 @@ function App() { .sort(() => Math.random() - 0.5) .map((card) => ({ ...card, id: Math.random() })) + setChoiceTwo(null) + setChoiceOne(null) setCards(shuffledCards) setTurns(0) } @@ -62,6 +64,11 @@ function App() { setDisabled(false) } + //start a new game automagically + useEffect(() => { + shuffleCards() + }, []) + return (

Magic Match

@@ -78,6 +85,7 @@ function App() { /> ))}
+

Turns: {turns}

); } diff --git a/src/index.css b/src/index.css index 52ea809..2d02316 100644 --- a/src/index.css +++ b/src/index.css @@ -1,22 +1,8 @@ -/* body { - margin: 0; - font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', - 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', - sans-serif; - -webkit-font-smoothing: antialiased; - -moz-osx-font-smoothing: grayscale; -} - -code { - font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New', - monospace; -} */ - /* base styles */ body { font-family: 'Courier New', Courier, monospace; margin: 0; - font-size: 1.5rem; + font-size: 1rem; text-align: center; background: #1b1523; color: #fff;