From ea963a78617923237fb4b1ee89561295b94bae27 Mon Sep 17 00:00:00 2001
From: diego tonini <diego.tonini93@gmail.com>
Date: Wed, 14 Feb 2024 18:06:20 +0100
Subject: [PATCH] =?UTF-8?q?fix:=20delete=20readme=20=C3=A8=20adjust=20some?=
 =?UTF-8?q?=20sizes?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .nvmrc                       |  1 +
 README.md                    | 30 ------------------------------
 package.json                 |  3 +++
 src/components/card.tsx      |  6 +++++-
 src/components/countdown.tsx |  6 +++++-
 src/index.css                |  4 ++--
 6 files changed, 16 insertions(+), 34 deletions(-)
 create mode 100644 .nvmrc

diff --git a/.nvmrc b/.nvmrc
new file mode 100644
index 0000000..25bf17f
--- /dev/null
+++ b/.nvmrc
@@ -0,0 +1 @@
+18
\ No newline at end of file
diff --git a/README.md b/README.md
index 0d6babe..e69de29 100644
--- a/README.md
+++ b/README.md
@@ -1,30 +0,0 @@
-# React + TypeScript + Vite
-
-This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.
-
-Currently, two official plugins are available:
-
-- [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react/README.md) uses [Babel](https://babeljs.io/) for Fast Refresh
-- [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react-swc) uses [SWC](https://swc.rs/) for Fast Refresh
-
-## Expanding the ESLint configuration
-
-If you are developing a production application, we recommend updating the configuration to enable type aware lint rules:
-
-- Configure the top-level `parserOptions` property like this:
-
-```js
-export default {
-  // other rules...
-  parserOptions: {
-    ecmaVersion: 'latest',
-    sourceType: 'module',
-    project: ['./tsconfig.json', './tsconfig.node.json'],
-    tsconfigRootDir: __dirname,
-  },
-}
-```
-
-- Replace `plugin:@typescript-eslint/recommended` to `plugin:@typescript-eslint/recommended-type-checked` or `plugin:@typescript-eslint/strict-type-checked`
-- Optionally add `plugin:@typescript-eslint/stylistic-type-checked`
-- Install [eslint-plugin-react](https://github.com/jsx-eslint/eslint-plugin-react) and add `plugin:react/recommended` & `plugin:react/jsx-runtime` to the `extends` list
diff --git a/package.json b/package.json
index f4ef5e0..9d2bc09 100644
--- a/package.json
+++ b/package.json
@@ -39,5 +39,8 @@
     "eslint-plugin-react-refresh": "^0.4.5",
     "typescript": "^5.2.2",
     "vite": "^5.1.0"
+  },
+  "engines": {
+    "node": "18"
   }
 }
diff --git a/src/components/card.tsx b/src/components/card.tsx
index 3621405..17c37f0 100644
--- a/src/components/card.tsx
+++ b/src/components/card.tsx
@@ -67,6 +67,7 @@ const Content = styled(animated.div)`
   width: 100%;
   height: 100%;
   transform-style: preserve-3d;
+  perspective: 500px;
 `;
 
 const Card = styled.div`
@@ -96,7 +97,10 @@ export const ContentShared = styled.div`
 
   border-radius: 14px;
   background: #9c27b0;
-  border: 6px solid #009688;
+  border: 3px solid #009688;
+  @media (min-width: 768px) {
+    border-width: 6px;
+  }
 `;
 
 const ContentFront = styled(ContentShared)`
diff --git a/src/components/countdown.tsx b/src/components/countdown.tsx
index c03755b..ea6b9b1 100644
--- a/src/components/countdown.tsx
+++ b/src/components/countdown.tsx
@@ -26,5 +26,9 @@ const Container = styled.div`
   display: grid;
   grid-template-columns: repeat(4, 1fr);
   grid-template-rows: 1fr;
-  grid-column-gap: 2rem;
+  grid-column-gap: 1rem;
+
+  @media (min-width: 768px) {
+    grid-column-gap: 2rem;
+  }
 `;
diff --git a/src/index.css b/src/index.css
index 4852832..12881c4 100644
--- a/src/index.css
+++ b/src/index.css
@@ -24,10 +24,10 @@ body {
 #root {
   max-width: 1280px;
   margin: 0 auto;
-  padding: 2rem;
+  padding: 1rem;
   text-align: center;
 }
 
 * {
-  box-sizing: border-box;
+  box-sizing: border-box!important;
 }
\ No newline at end of file