From b3f2530963dc35e11dbb463e82703b82d26f848e Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Amalie=20Mans=C3=A5ker?= <amalie.erdal.mansaker@nav.no>
Date: Thu, 6 Jul 2023 15:21:21 +0200
Subject: [PATCH] =?UTF-8?q?=F0=9F=9A=A7=20P=C3=A5begynt=20hovedside?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Co-authored-by: Sindre Kjelsrud <sindre.kjelsrud@nav.no>
Co-authored-by: Markus A. R. Johansen <markus.aleksander.rakil.johansen@nav.no>
---
 frontend/package.json    |  1 +
 frontend/pages/index.tsx | 70 ++++++++++++++++++++++++++--------------
 frontend/yarn.lock       |  5 +++
 3 files changed, 51 insertions(+), 25 deletions(-)

diff --git a/frontend/package.json b/frontend/package.json
index 85bb36b..05edf33 100644
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -12,6 +12,7 @@
     "@navikt/aksel-icons": "^4.4.2",
     "@navikt/ds-css": "^4.4.2",
     "@navikt/ds-react": "^4.4.2",
+    "@navikt/ds-tokens": "^4.6.1",
     "@types/node": "20.3.2",
     "@types/react": "18.2.14",
     "@types/react-dom": "18.2.6",
diff --git a/frontend/pages/index.tsx b/frontend/pages/index.tsx
index 0aa08c6..ea7013e 100644
--- a/frontend/pages/index.tsx
+++ b/frontend/pages/index.tsx
@@ -10,32 +10,52 @@ export default function Home() {
   }
 
   return (
-    <main className="flex flex-col py-8 justify-center">
-      <Search
-        label="Søk gjennom innmeldte feil (nøkkelord, tags, status)"
-        variant="primary"
-        hideLabel={false}
-      />
-      <Heading 
-        level="1" 
-        size="medium"
-      >
-        Innmeldte feil (saker, feilmeldingerm poster, feil)
-      </Heading>
-      <div className="w-1/2 flex flex-col gap-4 justify-center text-center">
-        <Button 
-          variant="primary" 
-          onClick={handleFeil}
-        >
-          Meld inn feil
-        </Button>
-        <Button 
-          variant="secondary"
-        >
-          Meld inn funksjonalitetsønsker
-        </Button>
+    <main className="flex flex-col h-screen">
+      <nav className="h-12 bg-black"></nav>
+
+      <div className="flex justify-center grow">
+        <div className="bg-gray-50 w-1/6 p-8 flex flex-col justify-end">
+          <div className="flex flex-col gap-4 text-center bottom-0">
+            <Button 
+              variant="primary" 
+              onClick={handleFeil}
+            >
+              Meld inn feil
+            </Button>
+            <Button 
+              variant="secondary"
+            >
+              Meld inn funksjonalitetsønsker
+            </Button>
+          </div>
+        </div>
+
+        <div className="p-8">
+          <Search
+            label="Søk gjennom innmeldte feil (nøkkelord, tags, status)"
+            variant="primary"
+            hideLabel={false}
+          />
+          <Heading 
+            level="1" 
+            size="medium"
+          >
+            Innmeldte feil (saker, feilmeldingerm poster, feil)
+          </Heading>
+          <div className="grid grid-cols-2 gap-4">
+            <FeilCard />  
+            <FeilCard />  
+            <FeilCard />  
+            <FeilCard />  
+
+
+          </div>
+        </div>
+
+        <div className="bg-gray-50 w-1/6 p-8">
+          <h1>Filter to be</h1>
+        </div>
       </div>
-      <FeilCard />
     </main>
   )
 }
diff --git a/frontend/yarn.lock b/frontend/yarn.lock
index f6df5ab..a122d23 100644
--- a/frontend/yarn.lock
+++ b/frontend/yarn.lock
@@ -205,6 +205,11 @@
     react-day-picker "8.3.4"
     react-modal "3.15.1"
 
+"@navikt/ds-tokens@^4.6.1":
+  version "4.6.1"
+  resolved "https://registry.yarnpkg.com/@navikt/ds-tokens/-/ds-tokens-4.6.1.tgz#d48f7c8bad197297dfb59b20685a6843f41f269e"
+  integrity sha512-pBX5MLUpFftvRGZcbS9wWoMmzeH/iLNvOdMPvMbYTBnU7LUjU3XHLByfc0ogb2eT3gRevpD4DbjzWVx65ZzULw==
+
 "@next/env@13.4.7":
   version "13.4.7"
   resolved "https://registry.yarnpkg.com/@next/env/-/env-13.4.7.tgz#ca12d341edb128ca70384635bd2794125ffb1c01"