From 1b7561b2972e342beb886de2ac32e22c26189f64 Mon Sep 17 00:00:00 2001
From: Josha von Gizycki <josha.von.gizycki@triology.de>
Date: Wed, 14 Oct 2020 20:51:28 +0200
Subject: [PATCH] add some css and structure to html

---
 backend/backend.iml                 |  3 ++-
 backend/resources/public/index.html |  3 ++-
 frontend/assets/sass/style.scss     | 34 +++++++++++++++++++++++++++++
 frontend/src/Main.elm               | 16 ++++++++++----
 frontend/src/Navigation.elm         | 18 ++-------------
 5 files changed, 52 insertions(+), 22 deletions(-)
diff --git a/backend/backend.iml b/backend/backend.iml
index 9051e46..8bbd6f0 100644
--- a/backend/backend.iml
+++ b/backend/backend.iml
@@ -3,9 +3,10 @@
   <component name="NewModuleRootManager" inherit-compiler-output="true">
     <exclude-output />
     <content url="file://$MODULE_DIR$">
+      <sourceFolder url="file://$MODULE_DIR$/resources" isTestSource="false" />
       <sourceFolder url="file://$MODULE_DIR$/src" isTestSource="false" />
       <sourceFolder url="file://$MODULE_DIR$/test" isTestSource="true" />
-      <sourceFolder url="file://$MODULE_DIR$/resources/public/compiled" type="java-resource" />
+      <excludePattern pattern="elm-stuff" />
     </content>
     <orderEntry type="inheritedJdk" />
     <orderEntry type="sourceFolder" forTests="false" />
diff --git a/backend/resources/public/index.html b/backend/resources/public/index.html
index 783b8e7..007feca 100644
--- a/backend/resources/public/index.html
+++ b/backend/resources/public/index.html
@@ -3,7 +3,8 @@
     <head>
         <meta charset="utf-8">
         <title>Open-Retro</title>
-        <script src="/compiled/js/app.js"></script>
+        <link rel="stylesheet" href="compiled/css/style.css">
+        <script src="compiled/js/app.js"></script>
     </head>
     <body>
         <script>
diff --git a/frontend/assets/sass/style.scss b/frontend/assets/sass/style.scss
index eb6d901..aedab33 100644
--- a/frontend/assets/sass/style.scss
+++ b/frontend/assets/sass/style.scss
@@ -1,3 +1,37 @@
 html {
   font-family: sans-serif;
 }
+
+body {
+  display: grid;
+  grid-template-areas:
+          "title navbar"
+          "content content";
+  grid-template-columns: 20rem 1fr;
+  margin: 0;
+}
+
+.app-title {
+  grid-area: title;
+  margin: 0;
+}
+
+nav {
+  grid-area: navbar;
+  align-self: center;
+
+  ul {
+    list-style-type: none;
+    margin: 0;
+    padding: 0;
+
+    li {
+      display: inline-block;
+      margin-right: 1rem;
+    }
+  }
+}
+
+main {
+  grid-area: content;
+}
diff --git a/frontend/src/Main.elm b/frontend/src/Main.elm
index 6c6a16f..d0e10b3 100644
--- a/frontend/src/Main.elm
+++ b/frontend/src/Main.elm
@@ -83,8 +83,17 @@ view : Model -> Browser.Document Msg
 view model =
     { title = "Open-Retro"
     , body =
-        [ h1 [] [ text "Open-Retro" ]
-        , nav [] [ Navigation.navTree ]
+        [ h1 [ class "app-title" ] [ text "Open-Retro" ]
+        , nav []
+            [ ul []
+                [ li []
+                    [ input [ placeholder "Board ID..." ] []
+                    ]
+                , li []
+                    [ text "⊕ New board"
+                    ]
+                ]
+            ]
         , main_ [] (appContent model)
         , node "link" [ rel "stylesheet", href "/compiled/css/style.css" ] []
         ]
@@ -100,5 +109,4 @@ appContent model =
 
 homePage : Model -> List (Html Msg)
 homePage model =
-    [ h2 [] [ text "Home" ]
-    ]
+    []
diff --git a/frontend/src/Navigation.elm b/frontend/src/Navigation.elm
index 9864f37..c7fb0f6 100644
--- a/frontend/src/Navigation.elm
+++ b/frontend/src/Navigation.elm
@@ -1,4 +1,4 @@
-module Navigation exposing (Route(..), linkClicked, navTree, routeParser)
+module Navigation exposing (Route(..), linkClicked, routeParser)
 
 import Browser
 import Browser.Navigation as Nav
@@ -26,20 +26,6 @@ routeParser : Parser (Route -> Route) Route
 routeParser =
     oneOf
         [ map Home top
-        --, map ShowTicket (s "tickets" </> Url.Parser.int)
-        ]
 
-
-navTree : Html msg
-navTree =
-    ul []
-        [ li [] [ a [ href "/" ] [ text "Home" ] ]
-        , li [] [ a [ href "/projects" ] [ text "Projects" ] ]
-        , li []
-            [ details [ Attr.attribute "open" "open" ]
-                [ summary [] [ a [ href "/tickets" ] [ text "Tickets" ] ]
-                , ul []
-                    [ li [] [ a [ href "/tickets/new" ] [ text "New Ticket" ] ] ]
-                ]
-            ]
+        --, map ShowTicket (s "tickets" </> Url.Parser.int)
         ]
