From cb0486875cdc3e1addc298f4e8d72b3034dbc794 Mon Sep 17 00:00:00 2001
From: niccostantini <65295160+niccostantini@users.noreply.github.com>
Date: Wed, 9 Oct 2024 23:51:53 +0200
Subject: [PATCH] Style gmail button Make all buttons in the mobile view
 equally wide

---
 src/styles.css    | 31 +++++++++++++++++++++++++++++++
 src/template.html |  6 +++---
 2 files changed, 34 insertions(+), 3 deletions(-)

diff --git a/src/styles.css b/src/styles.css
index c4a8aca..1785a47 100644
--- a/src/styles.css
+++ b/src/styles.css
@@ -40,6 +40,10 @@ r {
     font-weight: 700;
 }
 
+.mail {
+    svg path { fill: #c71610 }
+}
+
 header {
     box-shadow: 0px 5px 18px -6px rgba(0,0,0,0.75);
 }
@@ -266,6 +270,7 @@ footer div:last-child {
             flex-direction: row;
             align-items: center;
             height: 75px;
+            width: 290px;
 
             background-color: var(--air-force-blue);
             color: var(--creamy-white);
@@ -305,6 +310,19 @@ footer div:last-child {
             box-shadow: -6px 7px 5px #0000008f;
         }
 
+        .card.mail {
+            border-top: 3px solid #c71610;
+            border-right: 3px solid #f2a60c;
+            border-bottom: 3px solid #3b60c4;
+            border-left: 3px solid #08851b;
+
+            background-color: var(--jet);
+        }
+
+        .card.mail:hover {
+            background-color: #0a0000;
+        }
+
         .ig {
             background: #833ab4;
             background: linear-gradient(
@@ -580,6 +598,19 @@ footer div:last-child {
             box-shadow: -6px 7px 5px #0000008f;
         }
 
+        .card.mail {
+            border-top: 3px solid #c71610;
+            border-right: 3px solid #f2a60c;
+            border-bottom: 3px solid #3b60c4;
+            border-left: 3px solid #08851b;
+
+            background-color: var(--jet);
+        }
+
+        .card.mail:hover {
+            background-color: #0a0000;
+        }
+
         .ig {
             background: #833ab4;
             background: linear-gradient(
diff --git a/src/template.html b/src/template.html
index 7fb1062..27cefc2 100644
--- a/src/template.html
+++ b/src/template.html
@@ -67,9 +67,9 @@ <h2>Unisciti all'armonia</h2>
            </a>
 
            <a class="fadein" href="mailto:controcoro.spintime@gmail.com">
-               <div class="card">
-                <svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="#e8eaed"><path d="M160-160q-33 0-56.5-23.5T80-240v-480q0-33 23.5-56.5T160-800h640q33 0 56.5 23.5T880-720v480q0 33-23.5 56.5T800-160H160Zm320-280L160-640v400h640v-400L480-440Zm0-80 320-200H160l320 200ZM160-640v-80 480-400Z"/></svg>
-                <div class="details mail">
+               <div class="card mail">
+                <svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" id="gmail"><path d="M160-160q-33 0-56.5-23.5T80-240v-480q0-33 23.5-56.5T160-800h640q33 0 56.5 23.5T880-720v480q0 33-23.5 56.5T800-160H160Zm320-280L160-640v400h640v-400L480-440Zm0-80 320-200H160l320 200ZM160-640v-80 480-400Z"/></svg>
+                <div class="details">
                     <p>controcoro.spintime@gmail.com</p>
                 </div>
                </div>