Icona per i macchinisti nella lista

go.mod

@@ -4,6 +4,7 @@ go 1.13
 
 require (
 	github.com/alecthomas/chroma v0.9.4
+	github.com/alecthomas/repr v0.1.0 // indirect
 	github.com/go-chi/chi/v5 v5.0.7
 	github.com/joho/godotenv v1.4.0
 	github.com/litao91/goldmark-mathjax v0.0.0-20210217064022-a43cf739a50f

go.sum

@@ -5,6 +5,8 @@ github.com/alecthomas/chroma v0.9.4/go.mod h1:jtJATyUxlIORhUOFNA9NZDWGAQ8wpxQQqN
 github.com/alecthomas/colour v0.0.0-20160524082231-60882d9e2721/go.mod h1:QO9JBoKquHd+jz9nshCh40fOfO+JzsoXy8qTHF68zU0=
 github.com/alecthomas/kong v0.2.1-0.20190708041108-0548c6b1afae/go.mod h1:+inYUSluD+p4L8KdviBSgzcqEjUQOfC5fQDRFuc36lI=
 github.com/alecthomas/repr v0.0.0-20180818092828-117648cd9897/go.mod h1:xTS7Pm1pD1mvyM075QCDSRqH6qRLXylzS24ZTpRiSzQ=
+github.com/alecthomas/repr v0.1.0 h1:ENn2e1+J3k09gyj2shc0dHr/yjaWSHRlrJ4DPMevDqE=
+github.com/alecthomas/repr v0.1.0/go.mod h1:2kn6fqh/zIyPLmm3ugklbEi5hg5wS435eygvNfaDQL8=
 github.com/danwakefield/fnmatch v0.0.0-20160403171240-cbb64ac3d964/go.mod h1:Xd9hchkHSWYkEqJwUGisez3G1QY8Ryz0sdWrLPMGjLk=
 github.com/davecgh/go-spew v1.1.0/go.mod h1:J7Y8YcW2NihsgmVo/mv3lAwl/skON4iLHjSsI+c5H38=
 github.com/davecgh/go-spew v1.1.1 h1:vj9j/u1bqnvCEfJOwUhtlOARqs3+rkHYY13jYWTU97c=

public/style.css

@@ -12,6 +12,7 @@
     --bg-darker-2: #d5d5d5;
     --bg-darker-2-1: #c8c8c8;
     --bg-darker-3: #c0c0c0;
+    --bg-darker-4: #b8b8b8;
 
     --accent-1: #278542;
     --accent-1-fg: #154d24;
@@ -40,7 +41,8 @@
     box-sizing: border-box;
 }
 
-html, body {
+html,
+body {
     margin: 0;
 }
 
@@ -187,7 +189,8 @@ nav .nav-main .nav-item {
     z-index: 2;
 }
 
-nav .nav-main .nav-element:hover, nav .nav-main .nav-button:hover {
+nav .nav-main .nav-element:hover,
+nav .nav-main .nav-button:hover {
     background: var(--bg-darker);
 }
 
@@ -244,7 +247,8 @@ nav .nav-main .nav-item.dropdown .nav-items::before {
     background: var(--bg-darker);
 } */
 
-nav .nav-main .nav-item.dropdown .name:hover + .nav-items, nav .nav-main .nav-item.dropdown .name + .nav-items:hover {
+nav .nav-main .nav-item.dropdown .name:hover + .nav-items,
+nav .nav-main .nav-item.dropdown .name + .nav-items:hover {
     display: flex;
     flex-direction: column;
 }
@@ -357,7 +361,10 @@ section {
 
 /* Typography */
 
-h1, h2, h3, h4 {
+h1,
+h2,
+h3,
+h4 {
     margin: 0;
     margin-top: 1rem;
     margin-bottom: 0.5rem;
@@ -382,13 +389,17 @@ h4 {
     font-weight: var(--font-weight-bold);
 }
 
-p, ul, ol, li {
+p,
+ul,
+ol,
+li {
     margin: 0.5rem 0;
     width: 70ch;
     max-width: 100%;
 }
 
-ul, ol {
+ul,
+ol {
     padding: 0 0 0 1.5rem;
 }
 
@@ -430,7 +441,8 @@ a:hover {
 
 /* Buttons */
 
-button, .button {
+button,
+.button {
     font-family: var(--font-sf);
     font-weight: var(--font-weight-medium);
     font-size: 17px;
@@ -455,7 +467,8 @@ button, .button {
     cursor: pointer;
 }
 
-button:hover, .button:hover {
+button:hover,
+.button:hover {
     background: var(--bg-darker-2-1);
     box-shadow: 0 4px 8px 0 #00000033;
 }
@@ -502,7 +515,8 @@ select {
 
 /* Text Fields */
 
-input[type=text], input[type=password] {
+input[type='text'],
+input[type='password'] {
     border: none;
     background: none;
 
@@ -523,7 +537,7 @@ input[type=text], input[type=password] {
     font-weight: var(--font-weight-normal);
 }
 
-input[type=password] {
+input[type='password'] {
     font-family: caption;
 }
 
@@ -546,7 +560,7 @@ input[type=password] {
     height: 2rem;
     width: 1px;
 
-    background: var(--bg-darker-3);
+    background: var(--bg-darker-4);
 }
 
 .compound .icon {
@@ -563,7 +577,10 @@ input[type=password] {
     margin-right: 0.25rem;
 }
 
-.compound > button, .compound > .button, .compound > input, .compound > select {
+.compound > button,
+.compound > .button,
+.compound > input,
+.compound > select {
     border: none;
     box-shadow: none;
 }
@@ -695,6 +712,12 @@ form .field-set input {
     width: 100%;
 }
 
+.page-utenti .user-item .icon {
+    width: 1.5rem;
+    display: grid;
+    place-content: center;
+}
+
 .search {
     margin: 2rem 0;
     display: flex;
@@ -703,7 +726,7 @@ form .field-set input {
     gap: 1rem;
 }
 
-.search input[type=text] {
+.search input[type='text'] {
     width: 50ch;
     height: 2.5rem;
 }
@@ -741,7 +764,8 @@ form .field-set input {
     justify-content: center;
 }
 
-.news-content .tags, .news-content .date {
+.news-content .tags,
+.news-content .date {
     justify-content: center;
 }
 
@@ -762,11 +786,13 @@ table {
     border-collapse: collapse;
 }
 
-table td, table th {
+table td,
+table th {
     padding: 0.5rem;
 }
 
-table td:not(:first-child), table th:not(:first-child) {
+table td:not(:first-child),
+table th:not(:first-child) {
     border-left: 1px solid var(--bg-darker-3);
 }
 

utenti.go

@@ -9,6 +9,7 @@ type UserInfo struct {
 	Uid           string `string:"uid"`
 	Nome          string `json:"nome"`
 	Cognome       string `json:"cognome"`
+	IsMacchinista bool   `json:"macchinista,omitempty"`
 }
 
 func GetUtenti() ([]UserInfo, error) {

views/utenti.html

@@ -1,15 +1,13 @@
-{{template "base" .}}
-
-{{define "title"}}Utenti • PHC{{end}}
-
-{{define "body"}}
+{{template "base" .}} {{define "title"}}Utenti • PHC{{end}} {{define "body"}}
 <section>
     <h2>
         <i class="fas fa-users"></i>
         Lista degli Utenti
     </h2>
     <p>
-        Questa è la lista di tutti gli utenti con un account su Poisson. Scrivi nome, cognome o username di un utente per filtrare la lista in tempo reale. Altrimenti di base in cima compariranno gli utenti con più "follower".
+        Questa è la lista di tutti gli utenti con un account su Poisson. Scrivi nome, cognome o
+        username di un utente per filtrare la lista in tempo reale. Altrimenti di base in cima
+        compariranno gli utenti con più "follower".
     </p>
     <div class="search">
         <div class="compound padded">
@@ -24,17 +22,23 @@
             </select>
         </div>
         <div class="compound">
-            <input type="text" id="search-field" placeholder="Cerca..." autocomplete="off">
+            <input type="text" id="search-field" placeholder="Cerca..." autocomplete="off" />
             <button class="icon">
                 <i class="fas fa-search"></i>
             </button>
         </div>
     </div>
     <div class="user-list card-list">
-        {{ $config := .Config }}
         {{ range .Utenti }}
         <div class="user-item card">
-            <a class="full-name" href="{{ $config.UserPagesBaseUrl }}{{ .Uid }}">{{ .Nome }} {{ .Cognome }}</a>
+            <a class="full-name" href="{{ $.UserPagesBaseUrl }}{{ .Uid }}">
+                {{ .Nome }} {{ .Cognome }}
+            </a>
+            {{ if .IsMacchinista }}
+            <div class="icon" title="Macchinista">
+                <i class="fas fa-wrench"></i>
+            </div>
+            {{ end }}
         </div>
         {{ end }}
     </div>