redo some makefile stuff, add jdbc for backend

.idea/libraries/Deps__org_clojure_java_jdbc_0_7_11.xml

@@ -0,0 +1,9 @@
+<component name="libraryTable">
+  <library name="Deps: org.clojure/java.jdbc:0.7.11">
+    <CLASSES>
+      <root url="jar://$MAVEN_REPOSITORY$/org/clojure/java.jdbc/0.7.11/java.jdbc-0.7.11.jar!/" />
+    </CLASSES>
+    <JAVADOC />
+    <SOURCES />
+  </library>
+</component>

Makefile

@@ -1,10 +1,11 @@
 ROOT=$(shell pwd)
-BACKEND_ASSETS_DIR=backend/resources/public/compiled
 
-TARGET_CSS_DIR=$(BACKEND_ASSETS_DIR)/css
+SOURCE_ASSETS_IMG_DIR=frontend/assets/img
+SOURCE_ASSETS_IMG_FILES=$(wildcard frontend/assets/img/*)
+TARGET_ASSETS_IMG_DIR=frontend/compiled/img
+
+TARGET_CSS_DIR=frontend/compiled/css
 TARGET_CSS_FILE=$(TARGET_CSS_DIR)/style.css
-LIVE_CSS_DIR=frontend/compiled/css
-LIVE_CSS_FILE=$(LIVE_CSS_DIR)/style.css
 
 TARGET_JS_DIR=$(BACKEND_ASSETS_DIR)/js
 TARGET_JS_FILE=$(TARGET_JS_DIR)/app.js
@@ -15,7 +16,7 @@ SOURCE_SASS_FILE=frontend/assets/sass/style.scss
 INDEX_FILE=backend/resources/public/index.html
 
 .PHONY: compile
-compile: $(TARGET_JS_FILE) $(TARGET_CSS_FILE)
+compile: $(TARGET_JS_FILE) $(TARGET_CSS_FILE) $(TARGET_ASSETS_IMG_DIR)
 
 $(TARGET_JS_FILE): $(SOURCE_ELM_FILES)
 	mkdir -p $(TARGET_JS_DIR)
@@ -25,9 +26,9 @@ $(TARGET_CSS_FILE): $(SOURCE_SASS_FILE)
 	mkdir -p $(TARGET_CSS_DIR)
 	sassc --style compressed $(SOURCE_SASS_FILE) > $(TARGET_CSS_FILE)
 
-$(LIVE_CSS_FILE): $(SOURCE_SASS_FILE)
+$(TARGET_ASSETS_IMG_DIR): $(SOURCE_ASSETS_IMG_FILES)
-	mkdir -p $(LIVE_CSS_DIR)
+	mkdir -p $(TARGET_ASSETS_IMG_DIR)
-	sassc $(SOURCE_SASS_FILE) > $(LIVE_CSS_FILE)
+	cp $(SOURCE_ASSETS_IMG_DIR)/* $(TARGET_ASSETS_IMG_DIR)
 
 .PHONY: compile-debug
 compile-debug:
@@ -44,6 +45,6 @@ elm-live:
  		--debug \
  		--output=compiled/js/app.js
 
-.PHONE: sass-live
+.PHONY: assets-live
-sass-live:
+assets-live:
-	while sleep 1; do make -s $(LIVE_CSS_FILE); done
+	while sleep 1; do make -s $(TARGET_CSS_FILE); make -s $(TARGET_ASSETS_IMG_DIR); done

backend/backend.iml

@@ -44,6 +44,7 @@
     <orderEntry type="library" name="Deps: borkdude/edamame:0.0.11-alpha.13" level="project" />
     <orderEntry type="library" name="Deps: metosin/malli:0.0.1-20200924.063109-27" level="project" />
     <orderEntry type="library" name="Deps: com.cognitect/transit-clj:1.0.324" level="project" />
+    <orderEntry type="library" name="Deps: org.clojure/java.jdbc:0.7.11" level="project" />
     <orderEntry type="library" name="Deps: crypto-random:1.2.0" level="project" />
     <orderEntry type="library" name="Deps: ring/ring-codec:1.1.2" level="project" />
     <orderEntry type="library" name="Deps: metosin/reitit-malli:0.5.6" level="project" />

backend/deps.edn

@@ -2,5 +2,6 @@
  {http-kit/http-kit {:mvn/version "2.3.0"}
   metosin/reitit {:mvn/version "0.5.6"}
   ring/ring-defaults {:mvn/version "0.3.2"}
-  hiccup/hiccup {:mvn/version "1.0.5"}}
+  hiccup/hiccup {:mvn/version "1.0.5"}
+  org.clojure/java.jdbc {:mvn/version "0.7.11"}}
  :paths ["src" "resources"]}

backend/resources/public/index.html

@@ -25,6 +25,8 @@
             let uuid = localStorage.getItem("uuid") || createUUID();
             localStorage.setItem("uuid", uuid)
 
+            console.debug("your uuid is " + uuid)
+
             Elm.Main.init({
                 flags: {
                     userUuid: uuid

frontend/assets/img/klammer.svg

@@ -0,0 +1,12 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!-- Generator: Adobe Illustrator 19.2.1, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg width="68.013" height="198.4" version="1.1" viewBox="0 0 68.013 198.4" xml:space="preserve" xmlns="http://www.w3.org/2000/svg" xmlns:cc="http://creativecommons.org/ns#" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"><metadata><rdf:RDF><cc:Work rdf:about=""><dc:format>image/svg+xml</dc:format><dc:type rdf:resource="http://purl.org/dc/dcmitype/StillImage"/><dc:title/></cc:Work></rdf:RDF></metadata>
+<style type="text/css">
+	.st0{fill:#565656;}
+	.st1{fill:#FFCC00;}
+	.st2{fill:#FFFFFF;}
+</style>
+
+
+<path class="st1" d="m60.513 198.4h-25.2c-4.1 0-7.5-3.4-7.5-7.5v-35h-20.3c-2.7 0-5.1-1.4-6.5-3.7-1.3-2.3-1.4-5.2 0-7.5l26.8-47.2v-90c0-4.1 3.4-7.5 7.5-7.5h25.2c4.1 0 7.5 3.4 7.5 7.5s-3.4 7.5-7.5 7.5h-17.7v84.5c0 1.3-0.3 2.6-1 3.7l-21.4 37.7h14.9c4.1 0 7.5 3.4 7.5 7.5v35h17.7c4.1 0 7.5 3.4 7.5 7.5s-3.3 7.5-7.5 7.5z" fill="#fc0"/>
+</svg>

frontend/assets/sass/style.scss

@@ -1,3 +1,5 @@
+$ciColor: #691487;
+
 html {
   font-family: sans-serif;
 }
@@ -5,22 +7,42 @@ html {
 body {
   display: grid;
   grid-template-areas:
-          "title navbar"
+          "navbar navbar"
           "content content";
   grid-template-columns: 20rem 1fr;
   margin: 0;
 }
 
-.app-title {
-  grid-area: title;
-  margin: 0;
-}
-
 nav {
   grid-area: navbar;
   align-self: center;
 
+  background-color: $ciColor;
+  color: white;
+  padding: 5px;
+
+  display: grid;
+  grid-template-areas: "title rest-nav";
+  grid-template-columns: 15em 1fr;
+
+  .app-title {
+    margin: 0;
+    padding-left: .5em;
+    grid-area: title;
+    background-image: url("../img/klammer.svg");
+    background-repeat: no-repeat;
+    background-size: contain;
+  }
+
+  .board-search-input {
+    background-color: white;
+    border-radius: .3em;
+    border: 1px solid white;
+    padding: .4em;
+  }
+
   ul {
+    grid-area: rest-nav;
     list-style-type: none;
     margin: 0;
     padding: 0;

frontend/src/Main.elm

@@ -83,11 +83,11 @@ view : Model -> Browser.Document Msg
 view model =
     { title = "Open-Retro"
     , body =
+        [ nav []
             [ h1 [ class "app-title" ] [ text "Open-Retro" ]
-        , nav []
+            , ul []
-            [ ul []
                 [ li []
-                    [ input [ placeholder "Board ID..." ] []
+                    [ input [ class "board-search-input", placeholder "Board ID..." ] []
                     ]
                 , li []
                     [ text "⊕ New board"