From 8bbfc57ea8c92f7b272858b7298753ecb812637c Mon Sep 17 00:00:00 2001 From: Antonio De Lucreziis Date: Tue, 21 Dec 2021 19:13:51 +0100 Subject: [PATCH] Fix public/, campi di testo e bottoni --- main.go | 4 +- public/style.css | 101 ++++++++++++++++++++++++++++++++++++++++++++-- views/base.html | 6 +-- views/login.html | 58 ++++++++++++++++---------- views/utenti.html | 10 ++--- 5 files changed, 143 insertions(+), 36 deletions(-) diff --git a/main.go b/main.go index b66b582..f4c402f 100644 --- a/main.go +++ b/main.go @@ -19,8 +19,8 @@ func main() { r.Use(middleware.Logger) r.Use(middleware.Recoverer) - // Static assets - r.Handle("/assets/*", http.StripPrefix("/assets", http.FileServer(http.Dir("./assets")))) + // Static content + r.Handle("/public/*", http.StripPrefix("/public", http.FileServer(http.Dir("./public")))) r.Handle("/blog/*", http.StripPrefix("/blog", http.FileServer(http.Dir("./blog/public")))) // Templates & Renderer diff --git a/public/style.css b/public/style.css index 7254a1a..a51cd5e 100644 --- a/public/style.css +++ b/public/style.css @@ -1,4 +1,4 @@ -/* TODO: Don't use CDN and serve as assets */ +/* TODO: Don't use CDN and serve as static files */ @import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;700&display=swap'); :root { @@ -332,6 +332,8 @@ h1, h2, h3, h4 { p { margin: 0.5rem 0; + width: 70ch; + max-width: 100%; } /* Controls */ @@ -347,8 +349,101 @@ a:hover { text-decoration: underline; } -/* Responsiveness */ +/* Buttons */ + +button, .button { + font-family: var(--font-sf); + font-weight: var(--font-weight-medium); + font-size: 17px; + + background: #278542; + border: none; + height: 2rem; + padding: 0 1rem; + + border-right: 5px solid #ecc333; + position: relative; + + z-index: 2; + color: #111; + transition: all 100ms ease-in-out; + box-shadow: 0 0 0 0 transparent; + cursor: pointer; +} + +button::before, .button::before { + position: absolute; + content: ""; + top: -5px; + bottom: -5px; + background: #278542; + width: 100%; + left: 0; + z-index: -1; + border-radius: 2px; + transition: all 100ms ease-in-out; + -webkit-mask-image: radial-gradient(circle at top left, transparent 0, transparent 5px, black 6px), radial-gradient(circle at top right, transparent 0, transparent 5px, black 6px), radial-gradient(circle at bottom left, transparent 0, transparent 5px, black 6px), radial-gradient(circle at bottom right, transparent 0, transparent 5px, black 6px); + -webkit-mask-position: top left, top right, bottom left, bottom right; + -webkit-mask-repeat: no-repeat; + -webkit-mask-size: 50% 50%; + mask-image: radial-gradient(circle at top left, transparent 0, transparent 5px, black 6px), radial-gradient(circle at top right, transparent 0, transparent 5px, black 6px), radial-gradient(circle at bottom left, transparent 0, transparent 5px, black 6px), radial-gradient(circle at bottom right, transparent 0, transparent 5px, black 6px); + mask-position: top left, top right, bottom left, bottom right; + mask-repeat: no-repeat; + mask-size: 50% 50%; +} + +button:hover, input[type=submit]:hover, .button:hover { + color: #f22; + box-shadow: 0 4px 13px 0 #00000044; +} + +/* Text Fields */ + +input[type=text], input[type=password] { + border: none; + background: none; -@media screen and (max-width: 950px) { + height: 2rem; + padding: 0 0.5rem; + + font-size: 17px; + + background: #fff; + border-radius: 4px; + border: 1px solid var(--bg-darker-2); + box-shadow: 0 0 8px 0 #00000020; + + font-family: var(--font-sf); + font-size: 17px; + font-weight: var(--font-weight-normal); +} + +input[type=password] { + font-family: caption; +} + +/* Forms */ + +.field-set { + display: grid; + grid-template-columns: 1fr 2fr; + grid-auto-rows: auto; + + gap: 0.5rem; + padding: 1rem; +} + +.field-set label { + grid-column: 1 / 2; +} +.field-set input { + grid-column: 2 / 3; } + +.field-set .alone { + grid-column: 1 / 3; + place-self: center; + + margin-top: 1rem; +} \ No newline at end of file diff --git a/views/base.html b/views/base.html index e2f8de6..5175e09 100644 --- a/views/base.html +++ b/views/base.html @@ -57,8 +57,8 @@ }); - - + + @@ -66,7 +66,7 @@
diff --git a/views/login.html b/views/login.html index 00d68b8..d3fb2ea 100644 --- a/views/login.html +++ b/views/login.html @@ -3,31 +3,47 @@ {{define "title"}}PHC • Accedi • phc.dm.xxxxx.xx{{end}} {{define "body"}} +
+

Account di Poisson

+
+
+
+ + Accedi +
+

+ Inserisci le tue credenziali di Poisson per accedere. +

- -

- - Accedi -

+
+ + + + + + + +
+
+
+
+ +
+

Ottenere un account

- Inserisci le tue credenziali di Poisson per accedere. + Se vuoi ottenere un account compila* il modulo di richiesta e portacelo in PHC o inviacelo via + email all'indirizzo {{ .Config.Email }}.

- Per il recupero credenziali vieni direttamente al PHC a parlarne con calma con noi altrimenti puoi inviaci una email all'indirizzo {{ .Config.Email }}. + * In realtà ancora non esiste il modulo

-
- - -
-
- - -
-
-
- - -
- +
+
+

Recupero credenziali

+

+ Per il recupero credenziali vieni direttamente al PHC a parlarne con calma con noi altrimenti puoi inviaci una + email all'indirizzo {{ .Config.Email }}. +

+
{{end}} \ No newline at end of file diff --git a/views/utenti.html b/views/utenti.html index 3c0661b..e5e3785 100644 --- a/views/utenti.html +++ b/views/utenti.html @@ -5,19 +5,15 @@ {{define "body"}}

- - Utenti + Lista degli Utenti

- -

- 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. +

+ 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".

-
-