From 4f433803a494db600e17e1cd72aaee5772b29ed3 Mon Sep 17 00:00:00 2001
From: Fabio Lovato <fabiol@devcode.it>
Date: Sun, 21 May 2023 17:01:29 +0200
Subject: [PATCH] Completamento pagina evento Videogiochi Liberi

---
 assets/css/custom.css                         | 282 +++++++++++-------
 .../2023-05-21 videogiochi-liberi/index.md    |   4 +
 layouts/shortcodes/call-to-action.html        |   3 +
 3 files changed, 181 insertions(+), 108 deletions(-)
 create mode 100644 layouts/shortcodes/call-to-action.html

diff --git a/assets/css/custom.css b/assets/css/custom.css
index 8955892..c0a8f6d 100644
--- a/assets/css/custom.css
+++ b/assets/css/custom.css
@@ -1,25 +1,25 @@
-body{
+body {
     background: #eee;
 }
 
-.projects-list{
+.projects-list {
     text-align: left;
 }
 
-.list ul.projects-list > li{
+.list ul.projects-list>li {
     display: inline;
 }
 
-.projects-list > li > img{
+.projects-list>li>img {
     float: left;
 }
 
 .list ul.tags,
-.page ul.tags{
+.page ul.tags {
     text-align: right;
 }
 
-.list ul.tags > li{
+.list ul.tags>li {
     display: inline;
     color: #ddd;
     font-size: 80%;
@@ -29,13 +29,13 @@ body{
 }
 
 
-.list ul.projects-list li .title{
+.list ul.projects-list li .title {
     font-size: 1.5em;
     line-height: 1.3em;
     margin-bottom: 0.5em;
 }
 
-.list ul.projects-list li .date{
+.list ul.projects-list li .date {
     width: auto;
     margin: 0;
     position: absolute;
@@ -47,7 +47,7 @@ body{
     font-size: 70%;
 }
 
-.list ul.projects-list li .new{
+.list ul.projects-list li .new {
     width: auto;
     text-align: center;
     margin: 0;
@@ -59,7 +59,7 @@ body{
     background: rgb(207, 9, 105);
 }
 
-.list ul.projects-list li .wip{
+.list ul.projects-list li .wip {
     width: auto;
     text-align: center;
     margin: 0;
@@ -71,7 +71,7 @@ body{
     background: rgb(210, 119, 50);
 }
 
-.list ul.projects-list li .completed{
+.list ul.projects-list li .completed {
     width: auto;
     text-align: center;
     margin: 0;
@@ -83,7 +83,7 @@ body{
     background: rgb(16, 134, 28);
 }
 
-.project-image{
+.project-image {
     display: inline;
     float: left;
     position: relative;
@@ -91,13 +91,13 @@ body{
     margin-bottom: 1em;
 }
 
-.page ul.tags > li{
+.page ul.tags>li {
     display: inline;
     color: #999;
 }
 
 /** NEWS **/
-.news-image{
+.news-image {
     display: inline;
     float: left;
     position: relative;
@@ -106,19 +106,19 @@ body{
     width: 40%;
 }
 
-.list ul.news-list li .date{
+.list ul.news-list li .date {
     width: auto;
 }
 
-.list ul.news-list li .reading-time{
+.list ul.news-list li .reading-time {
     margin-left: 1em;
 }
 
-.list ul.news-list li a.title{
+.list ul.news-list li a.title {
     font-size: 1.3em;
 }
 
-.list ul.news-list .tag{
+.list ul.news-list .tag {
     display: inline-block;
     padding: 0.3rem 0.6rem;
     background-color: #e0e0e0;
@@ -128,30 +128,30 @@ body{
     margin-bottom: 2px;
 }
 
-.list ul.news-list .tag a{
+.list ul.news-list .tag a {
     color: #212121;
 }
 
-.list ul.news-list:not(.pagination) li{
+.list ul.news-list:not(.pagination) li {
     display: block;
 }
 
-hr.light{
+hr.light {
     border: 1px solid #eee;
 }
 
-blockquote{
+blockquote {
     padding: 10px;
     border-left: 4px solid #e0e0e0;
     line-height: 3.2rem;
 }
 
-blockquote p{
+blockquote p {
     font-size: 1.2em;
     margin: 2rem 0 2rem 1em;
 }
 
-.donations > div{
+.donations>div {
     position: relative;
     width: 49%;
     padding: 4%;
@@ -159,13 +159,13 @@ blockquote p{
     min-height: 350px;
 }
 
-.donations > div > a.btn{
+.donations>div>a.btn {
     position: absolute;
     bottom: 10px;
     right: 10px;
 }
 
-.donations > div:first-of-type{
+.donations>div:first-of-type {
     margin-right: 2%;
 }
 
@@ -198,7 +198,7 @@ blockquote p{
     }
 }
 
-.stripe-btn{
+.stripe-btn {
     background: #635bff;
     color: #fff;
     padding: 0.1em 0.4em;
@@ -207,134 +207,191 @@ blockquote p{
 }
 
 .social-share {
-	position: relative;
-	top: -0.5em;
+    position: relative;
+    top: -0.5em;
 }
- 
+
 .social-share ul {
-	margin: 0;
+    margin: 0;
 }
- 
+
 .social-share ul li p {
-	display: none;
+    display: none;
 }
 
 .social-share .share-icons li {
-	padding: 0 !important;
-	padding-bottom: 10px !important;
+    padding: 0 !important;
+    padding-bottom: 10px !important;
 }
- 
+
 .social-share .share-btn {
-	padding: 0.25em;
-	width: 3em;
+    padding: 0.25em;
+    width: 3em;
 }
- 
-.social-share-nav .share-btn h3{
-	color: #ffffff;
+
+.social-share-nav .share-btn h3 {
+    color: #ffffff;
 }
 
 ul.share-icons {
-	cursor: default;
-	list-style: none;
-	padding-left: 0;
-	margin-top: 1em;
+    cursor: default;
+    list-style: none;
+    padding-left: 0;
+    margin-top: 1em;
 }
 
 ul.share-icons li {
-	display: inline-block;
-	padding: 0 1em 0 0;
+    display: inline-block;
+    padding: 0 1em 0 0;
 }
 
 ul.share-icons li:last-child {
-	padding-right: 0;
+    padding-right: 0;
 }
 
-ul.share-icons li > * {
-	text-decoration: none;
-	border: 0;
+ul.share-icons li>* {
+    text-decoration: none;
+    border: 0;
 }
 
-ul.share-icons li > *:before {
-	-moz-osx-font-smoothing: grayscale;
-	-webkit-font-smoothing: antialiased;
-	font-family: FontAwesome;
-	font-style: normal;
-	font-weight: normal;
-	text-transform: none !important;
+ul.share-icons li>*:before {
+    -moz-osx-font-smoothing: grayscale;
+    -webkit-font-smoothing: antialiased;
+    font-family: FontAwesome;
+    font-style: normal;
+    font-weight: normal;
+    text-transform: none !important;
 }
 
-ul.share-icons li > * .label {
-	display: none;
+ul.share-icons li>* .label {
+    display: none;
 }
- 
+
 .share-btn {
-	display: inline-block;
-	color: #ffffff;
-	border: none;
-	border-radius: 4px;
-	box-shadow: 0 2px 0 0 rgba(0,0,0,0.2);
-	outline: none;
-	text-align: center;
-	text-decoration: none;
+    display: inline-block;
+    color: #ffffff;
+    border: none;
+    border-radius: 4px;
+    box-shadow: 0 2px 0 0 rgba(0, 0, 0, 0.2);
+    outline: none;
+    text-align: center;
+    text-decoration: none;
 }
- 
+
 .share-btn:hover {
-	color: #ffffff !important;
+    color: #ffffff !important;
 }
 
 .share-btn:active {
-	position: relative;
-	top: 2px;
-	box-shadow: none;
-	color: #e2e2e2;
-	outline: none;
+    position: relative;
+    top: 2px;
+    box-shadow: none;
+    color: #e2e2e2;
+    outline: none;
 }
+
 .share-btn .widget-social__link-icon {
-	margin: 0;
+    margin: 0;
+}
+
+.share-btn.mastodon {
+    background: #3088d4;
+}
+
+.share-btn.twitter {
+    background: #55acee;
+}
+
+.share-btn.google-plus {
+    background: #dd4b39;
+}
+
+.share-btn.facebook {
+    background: #3B5998;
+}
+
+.share-btn.linkedin {
+    background: #4875B4;
+}
+
+.share-btn.stumbleupon {
+    background: #EB4823;
+}
+
+.share-btn.pinterest {
+    background: #BD081C;
+}
+
+.share-btn.reddit {
+    background: #ff5700;
+}
+
+.share-btn.email {
+    background: #444444;
+}
+
+.share-btn.whatsapp {
+    background: #25d366;
 }
- 
-.share-btn.mastodon    { background: #3088d4; }
-.share-btn.twitter     { background: #55acee; }
-.share-btn.google-plus { background: #dd4b39; }
-.share-btn.facebook    { background: #3B5998; }
-.share-btn.linkedin    { background: #4875B4; }
-.share-btn.stumbleupon { background: #EB4823; }
-.share-btn.pinterest   { background: #BD081C; }
-.share-btn.reddit      { background: #ff5700; }
-.share-btn.email       { background: #444444; }
-.share-btn.whatsapp    { background: #25d366; }
 
 
-.share-btn.mastodon:hover    { background: #3583c7; }
-.share-btn.twitter:hover     { background: #4c9ad6; }
-.share-btn.google-plus:hover { background: #c64333; }
-.share-btn.facebook:hover    { background: #2f4779; }
-.share-btn.linkedin:hover    { background: #4069a2; }
-.share-btn.stumbleupon:hover { background: #d3401f; }
-.share-btn.pinterest:hover   { background: #AD0000; }
-.share-btn.reddit:hover      { background: #e54e00; }
-.share-btn.email:hover       { background: #363636; }
+.share-btn.mastodon:hover {
+    background: #3583c7;
+}
 
-p{
+.share-btn.twitter:hover {
+    background: #4c9ad6;
+}
+
+.share-btn.google-plus:hover {
+    background: #c64333;
+}
+
+.share-btn.facebook:hover {
+    background: #2f4779;
+}
+
+.share-btn.linkedin:hover {
+    background: #4069a2;
+}
+
+.share-btn.stumbleupon:hover {
+    background: #d3401f;
+}
+
+.share-btn.pinterest:hover {
+    background: #AD0000;
+}
+
+.share-btn.reddit:hover {
+    background: #e54e00;
+}
+
+.share-btn.email:hover {
+    background: #363636;
+}
+
+p {
     margin: 0.5em 0;
     line-height: 1.4em;
 }
 
-@media (max-width: 768px){
-    .donations > div{
+@media (max-width: 768px) {
+    .donations>div {
         width: 100%;
         margin: 2%;
         min-height: auto;
     }
 }
 
-.quick-div{
+.quick-div {
     color: #fff;
     display: inline-block;
     line-height: 1em;
     border: none;
 }
-.quick-div > .url{
+
+.quick-div>.url {
     text-decoration: none;
     color: #fff;
     line-height: 1.8em;
@@ -344,19 +401,19 @@ p{
     margin-left: -4px;
 }
 
-.quick-div > .url:hover{
+.quick-div>.url:hover {
     background: #076137;
     color: #fff;
     margin-left: 0;
 }
 
-.quick-div > .icon{
+.quick-div>.icon {
     padding: 8px;
     background: #fff;
     border: 1px solid #ddd;
 }
 
-.big-button{
+.big-button {
     margin: 6px 0;
     display: inline-block;
     padding: 0.5em 1em;
@@ -373,19 +430,28 @@ p{
     transform: translateY(2px);
 }
 
-hr{
+.big-button.green {
+    border-color: #007306;
+    color: #007306;
+}
+
+hr {
     border: 2px dashed #bbb;
     margin: 30px 0;
 }
 
-.quick-summary{
+.quick-summary {
     background: #ddd;
     border-left: 8px solid #ccc;
     padding: 1em;
     color: #555;
 }
 
-.quick-summary h4{
+.quick-summary h4 {
     margin: 0 0 0.5em 0;
     color: #444;
+}
+
+.text-center {
+    text-align: center;
 }
\ No newline at end of file
diff --git a/content/novita/2023-05-21 videogiochi-liberi/index.md b/content/novita/2023-05-21 videogiochi-liberi/index.md
index 42da625..e244b0a 100644
--- a/content/novita/2023-05-21 videogiochi-liberi/index.md	
+++ b/content/novita/2023-05-21 videogiochi-liberi/index.md	
@@ -34,6 +34,10 @@ Esiste la necessità di creare alternative che siano accessibili a tuttɜ. **Min
 
 L'evento si terrà da remoto, significa che potrai partecipare comodamente da casa collegandoti dal tuo computer all'indirizzo che invieremo poco prima dell'inizio. Consigliamo di attivare la webcam per vedersi tra partecipanti e interagire meglio, e di usare un computer per poter provare al momento Minetest o eventuali altri giochi proposti.
 
+Conferma la tua presenza da qui:
+
+{{< call-to-action title="✔️ Voglio partecipare" url="https://mobilizon.it/events/456231a8-aec2-43c6-97ba-fff1c974afa6" >}}
+
 L'evento è organizzato in collaborazione con:
 
 [![Etica Digitale](etica-digitale.png)](https://eticadigitale.org)
diff --git a/layouts/shortcodes/call-to-action.html b/layouts/shortcodes/call-to-action.html
new file mode 100644
index 0000000..f0b2e38
--- /dev/null
+++ b/layouts/shortcodes/call-to-action.html
@@ -0,0 +1,3 @@
+<div class="text-center">
+    <a href="{{ .Get "url" }}" class="big-button green" target="_blank">{{ .Get "title" }}</a>
+</div>
\ No newline at end of file