[Project base]

main.go

@@ -18,31 +18,51 @@ func main() {
 
 	navItems := []NavItem{
 		NewNavItem("Suche", "/search"),
+		NewNavItem("Verwaltung", "/admin"),
 	}
 
 	app.Get("/", func(c *fiber.Ctx) error {
 		return c.Render("search", fiber.Map{
-			"Title":      "Suche",
-			"Stylenames": NewStyleItemList("colors", "main", "search"),
-			"NavItems":   navItems,
+			"Title":             "Suche",
+			"Stylenames":        NewStyleItemList("colors", "main", "search"),
+			"NavItems":          navItems,
+			"ActivePage":        "/search",
+			"SearchResultCount": -1,
 		})
 	})
 
 	app.Get("/search", func(c *fiber.Ctx) error {
 		return c.Render("search", fiber.Map{
-			"Title":      "Suche",
-			"Stylenames": NewStyleItemList("colors", "main", "search"),
-			"NavItems":   navItems,
+			"Title":             "Suche",
+			"Stylenames":        NewStyleItemList("colors", "main", "search"),
+			"NavItems":          navItems,
+			"ActivePage":        "/search",
+			"SearchResultCount": -1,
 		})
 	})
 
 	app.Post("/search", func(c *fiber.Ctx) error {
 		return c.Render("search", fiber.Map{
-			"Title":      "Suche",
-			"Stylenames": NewStyleItemList("colors", "main", "search"),
-			"NavItems":   navItems,
+			"Title":             "Suche",
+			"Stylenames":        NewStyleItemList("colors", "main", "search"),
+			"NavItems":          navItems,
+			"ActivePage":        "/search",
+			"SearchResultCount": 0,
 		})
 	})
 
+	app.Get("/admin", func(c *fiber.Ctx) error {
+		return c.Render("admin/tables", fiber.Map{
+			"Title":      "Verwaltung",
+			"Stylenames": NewStyleItemList("colors", "main", "admin"),
+			"NavItems":   navItems,
+			"ActivePage": "/admin",
+		})
+	})
+
+	app.Get("/admin/locations/overview", func(c *fiber.Ctx) error {
+		return c.Render("admin/overview")
+	})
+
 	log.Fatal(app.Listen(":3000"))
 }

static/css/main.css

@@ -25,7 +25,11 @@ a:visited {
 
 header, footer {
   background-color: var(--bg-light);
-  height: 100px;
+  height: 150px;
+}
+
+footer {
+  height: 50px;
 }
 
 header {
@@ -38,11 +42,14 @@ header > h1 {
   padding: 0;
   margin: 0;
   text-align: center;
+  font-size: 4.5em;
 }
 
-header > nav, footer > nav {
+:is(header, footer) > nav {
   display: flex;
   justify-content: center;
+  gap: 20px;
+  font-size: 1.5em;
 }
 
 footer > nav {
@@ -54,6 +61,26 @@ footer > nav > a {
   margin: auto;
 }
 
+:is(header, footer) > nav > a::before {
+  content: '< ';
+}
+
+:is(header, footer) > nav > a::after {
+  content: ' >';
+}
+
+:is(header, footer) > nav > a:is(:hover, .active)::before {
+  content: '\00a0>';
+}
+
+:is(header, footer) > nav > a:is(:hover, .active)::after {
+  content: '<\00a0';
+}
+
+:is(header, footer) > nav > a:visited {
+  color: var(--link);
+}
+
 main {
   min-height: calc(100vh - 200px);
 }

static/css/search.css

@@ -0,0 +1,54 @@
+main {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    flex-direction: column;
+    gap: 50px;
+}
+
+main > form {
+    display: flex;
+    margin-bottom: 50px;
+}
+
+main > form > input {
+    width: 420px;
+    height: 50px;
+    border-radius: 0px;
+    border-bottom-left-radius: 25px;
+    border-top-left-radius: 25px;
+    border: none;
+    font-size: 24px;
+    padding: 0 10px 0 10px;
+    background-color: var(--bg-light);
+    color: var(--fg);
+    border-right: 2px solid var(--bg-border);
+}
+
+main > form > input:focus {
+    outline: none;
+}
+
+main > form > button {
+    width: 50px;
+    height: 50px;
+    border: none;
+    border-radius: 0px;
+    border-bottom-right-radius: 25px;
+    border-top-right-radius: 25px;
+    cursor: pointer;
+    background-color: var(--bg-light);
+    font-size: 24px;
+}
+
+main > table {
+    width: 800px;
+    border-collapse: collapse;
+    background-color: var(--bg-light);
+}
+
+main > table tr :is(td, th) {
+    border: 2px solid var(--bg-border);
+    padding: 5px;
+    text-align: center;
+}

types.go

@@ -1,5 +1,7 @@
 package main
 
+// Web
+
 type NavItem struct {
 	Caption     string
 	Destination string
@@ -14,3 +16,16 @@ type Stylename string
 func NewStyleItemList(stylenames ...Stylename) []Stylename {
 	return stylenames
 }
+
+// Database
+
+type Location struct {
+	id          int
+	parent      int
+	Name        string
+	Description string
+}
+
+func (l *Location) GetParent() *Location {
+	return nil
+}

views/admin/edit.html

@@ -0,0 +1,16 @@
+{{template "partials/base-top" .}}
+
+<form action="/admin/{{ .Table }}/edit" method="post">
+    {{ range .InputFields }}
+    <label for="{{ .Id }}">{{ .Label }}</label>
+    <input type="{{ .Type }}" name="{{ .Name }}" id="{{ .Id }}">
+    {{ end }}
+    <input type="hidden" name="doEdit">
+    <input type="hidden" name="id" value="{{ .RowId }}">
+    <div class="form-footer">
+        <button type="submit">💾</button>
+        <a href="/admin/{{ .Table }}/overview">❌</a>
+    </div>
+</form>
+
+{{template "partials/base-bottom" .}}

views/admin/overview.html

@@ -0,0 +1,28 @@
+{{template "partials/base-top" .}}
+
+<table>
+    <tr>
+        {{ range .Columns }}
+        <th>{{ . }}</th>
+        {{ end }}
+    </tr>
+    {{ range .Rows }}
+    <tr>
+        {{ range .Columns }}
+        <td>{{ . }}</td>
+        {{ end }}
+        <td>
+            <form action="/admin/{{ .Table }}/edit">
+                <input type="hidden" name="id" value="{{ .Id }}">
+                <button type="submit">⛭</button>
+            </form>
+            <form action="/admin/{{ .Table }}/delete">
+                <input type="hidden" name="id" value="{{ .Id }}">
+                <button type="submit">⊖</button>
+            </form>
+        </td>
+    </tr>
+    {{ end }}
+</table>
+
+{{template "partials/base-bottom" .}}

views/admin/tables.html

@@ -0,0 +1,7 @@
+{{template "partials/base-top" .}}
+
+{{ range .Tables }}
+<a href="/admin/{{ .Table }}/overview">{{ .Caption }}</a>
+{{ end }}
+
+{{template "partials/base-bottom" .}}

views/alert.html

@@ -0,0 +1,9 @@
+{{template "partials/base-top" .}}
+
+<div class="message-box">
+    <h2 class="title">{{ .Title }}</h2>
+    <p class="message">{{ .Message }}</p>
+    <a href="/admin/{{ .Table }}/overview">🆗</a>
+</div>
+
+{{template "partials/base-bottom" .}}

views/partials/base-top.html

@@ -13,7 +13,7 @@
       <h1>fisch</h1>
       <nav>
         {{ range .NavItems }}
-        <a href="{{ .Destination }}">{{ .Caption }}</a>
+        <a href="{{ .Destination }}" {{ if eq .Destination $.ActivePage }} class="active" {{ end }}>{{ .Caption }}</a>
         {{ end }}
       </nav>
     </header>

views/search.html

@@ -5,4 +5,33 @@
   <button type="submit">🔍</button>
 </form>
 
+
+{{ if eq .SearchResultCount -1 }}
+
+{{ else }}
+
+{{ if gt .SearchResultCount 0 }}
+
+<table>
+  <tr>
+    <th>Ort</th>
+    <th>Kistenbezeichnung</th>
+    <th>Möglicher Inhalt</th>
+  </tr>
+  <tr>
+    <td>A</td>
+    <td>A</td>
+    <td>A</td>
+  </tr>
+</table>
+
+{{ else }}
+
+<p>Keine Ergebnisse gefunden.</p>
+
+{{ end }}
+
+{{ end }}
+
+
 {{template "partials/base-bottom" .}}