From e68370f3191625fa5eb3f404a78066fde2734ded Mon Sep 17 00:00:00 2001
From: kjuulh <contact@kjuulh.io>
Date: Mon, 25 Apr 2022 22:59:07 +0200
Subject: [PATCH] Add letter spacing

---
 .../domain/wishes/createWish/CreateWish.tsx   |  2 +-
 styles/globals.css                            |  4 ++++
 tailwind.config.js                            | 19 +++++++++++++++----
 3 files changed, 20 insertions(+), 5 deletions(-)

diff --git a/components/domain/wishes/createWish/CreateWish.tsx b/components/domain/wishes/createWish/CreateWish.tsx
index 9513057..b2755c7 100644
--- a/components/domain/wishes/createWish/CreateWish.tsx
+++ b/components/domain/wishes/createWish/CreateWish.tsx
@@ -19,7 +19,7 @@ const CreateWish: FC<CreateWishProps> = (props) => {
             type="text"
             name="wishName"
             placeholder="Your wish!"
-            className="w-full appearance-none bg-pink-100 p-6 text-center text-lg outline-none"
+            className="w-full appearance-none bg-pink-100 p-6 text-center text-xl outline-none font-medium"
             onChange={(e) =>
               props.onSubmit({ ...props.wish, name: e.target.value })
             }
diff --git a/styles/globals.css b/styles/globals.css
index b5c61c9..c82bad8 100644
--- a/styles/globals.css
+++ b/styles/globals.css
@@ -1,3 +1,7 @@
 @tailwind base;
 @tailwind components;
 @tailwind utilities;
+
+* {
+    @apply tracking-normal;
+}
\ No newline at end of file
diff --git a/tailwind.config.js b/tailwind.config.js
index ffb1593..6d5c96f 100644
--- a/tailwind.config.js
+++ b/tailwind.config.js
@@ -4,10 +4,21 @@ module.exports = {
     './components/**/*.{js,ts,jsx,tsx}',
   ],
   theme: {
-    extend: {
-      fontFamily: {
-        sans: ['"Dancing Script"', 'cursive'],
-      },
+    extend: {},
+
+    fontFamily: {
+      sans: ['"Dancing Script"', 'cursive'],
+    },
+
+    letterSpacing: {
+      tightest: '-.075em',
+      tighter: '-.05em',
+      tight: '-.025em',
+      normal: '0.03em',
+      wide: '.045em',
+      wider: '.07em',
+      widest: '.1em',
+      widest: '.25em',
     },
   },
   plugins: [],