From 5a2b49900187f836822694df6f476f696d183e83 Mon Sep 17 00:00:00 2001
From: Jakub Knetl <knetl.j@gmail.com>
Date: Wed, 27 Dec 2023 07:35:47 +0100
Subject: [PATCH] Chapter 2 - add global CSS styles with tailwind to root
 layout

---
 app/layout.tsx    | 2 ++
 app/page.tsx      | 7 ++++---
 package-lock.json | 2 +-
 3 files changed, 7 insertions(+), 4 deletions(-)

diff --git a/app/layout.tsx b/app/layout.tsx
index 225b603..c1b7464 100644
--- a/app/layout.tsx
+++ b/app/layout.tsx
@@ -1,3 +1,5 @@
+import '@/app/ui/global.css';
+
 export default function RootLayout({
   children,
 }: {
diff --git a/app/page.tsx b/app/page.tsx
index 8e0184f..e0fc546 100644
--- a/app/page.tsx
+++ b/app/page.tsx
@@ -10,6 +10,7 @@ export default function Page() {
       </div>
       <div className="mt-4 flex grow flex-col gap-4 md:flex-row">
         <div className="flex flex-col justify-center gap-6 rounded-lg bg-gray-50 px-6 py-10 md:w-2/5 md:px-20">
+          <div className="h-0 w-0 border-b-[30px] border-l-[20px] border-r-[20px] border-b-black border-l-transparent border-r-transparent"/>
           <p className={`text-xl text-gray-800 md:text-3xl md:leading-normal`}>
             <strong>Welcome to Acme.</strong> This is the example for the{' '}
             <a href="https://nextjs.org/learn/" className="text-blue-500">
@@ -18,10 +19,10 @@ export default function Page() {
             , brought to you by Vercel.
           </p>
           <Link
-            href="/login"
-            className="flex items-center gap-5 self-start rounded-lg bg-blue-500 px-6 py-3 text-sm font-medium text-white transition-colors hover:bg-blue-400 md:text-base"
+              href="/login"
+              className="flex items-center gap-5 self-start rounded-lg bg-blue-500 px-6 py-3 text-sm font-medium text-white transition-colors hover:bg-blue-400 md:text-base"
           >
-            <span>Log in</span> <ArrowRightIcon className="w-5 md:w-6" />
+            <span>Log in</span> <ArrowRightIcon className="w-5 md:w-6"/>
           </Link>
         </div>
         <div className="flex items-center justify-center p-6 md:w-3/5 md:px-28 md:py-12">
diff --git a/package-lock.json b/package-lock.json
index 64273d0..43432d7 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,5 +1,5 @@
 {
-  "name": "nextjs-dashboard2",
+  "name": "nextjs-dashboard",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {