From c5ff9cf5a407328a147073cba7de7b32c867f7be Mon Sep 17 00:00:00 2001
From: pluja <codeberg@r3d.red>
Date: Mon, 20 Sep 2021 21:56:42 +0200
Subject: [PATCH] Improve modal closing

---
 templates/about.html | 17 +++++------------
 1 file changed, 5 insertions(+), 12 deletions(-)

diff --git a/templates/about.html b/templates/about.html
index b4cb6b6..f93f68b 100644
--- a/templates/about.html
+++ b/templates/about.html
@@ -238,7 +238,7 @@
         <a class="butn" href="#open-modal-xmr"><i class="fas fa-qrcode"></i> Donate Monero </a>
         <div id="open-modal-xmr" class="modal-window">
           <div>
-            <a href="#support" title="Close" class="modal-close"><i class="fa fa-times"></i></a>
+            <a href="#support" title="Close" class="modal-close"></a>
             <h1>Monero</h1>
             <img width="256" src="/static/img/qrcodes/xmr.png"></img>
             <pre>{{support['xmr']}}</pre> 
@@ -251,7 +251,7 @@
         <a class="butn" href="#open-modal-btc"><i class="fas fa-qrcode"></i> Donate Bitcoin </a>
         <div id="open-modal-btc" class="modal-window">
           <div>
-            <a href="#support" title="Close" class="modal-close"><i class="fa fa-times"></i></a>
+            <a href="#support" title="Close" class="modal-close"></a>
             <h1>Bitcoin</h1>
             <img width="256" src="/static/img/qrcodes/btc.png"></img>
             <pre>{{support['btc']}}</pre> 
@@ -264,7 +264,7 @@
         <a class="butn" href="#open-modal-nano"><i class="fas fa-qrcode"></i> Donate Nano </a>
         <div id="open-modal-nano" class="modal-window">
           <div>
-            <a href="#support" title="Close" class="modal-close"><i class="fa fa-times"></i></a>
+            <a href="#support" title="Close" class="modal-close"></a>
             <h1>Nano</h1>
             <img width="256" src="/static/img/qrcodes/nano.png"></img>
             <pre>{{support['nano']}}</pre> 
@@ -312,6 +312,7 @@
 	 pointer-events: auto;
 }
  .modal-window > div {
+   text-align: center;
 	 width: 300px;
 	 position: absolute;
 	 top: 50%;
@@ -319,9 +320,6 @@
 	 transform: translate(-50%, -50%);
 	 padding: 1em;
 	 background: rgb(26, 26, 26);
-}
- .modal-window header {
-	 font-weight: bold;
 }
  .modal-window h1 {
 	 font-size: 150%;
@@ -330,6 +328,7 @@
  .modal-close {
 	 color: #aaa;
 	 line-height: 50px;
+   padding: 20px;
 	 font-size: 80%;
 	 position: absolute;
 	 right: 0;
@@ -337,9 +336,6 @@
 	 top: 0;
 	 width: 70px;
 	 text-decoration: none;
-}
- .modal-close:hover {
-	 color: black;
 }
  .modal-window > div {
 	 border-radius: 1rem;
@@ -353,9 +349,6 @@
 	 border-radius: .1rem;
 	 text-decoration: none;
 }
- .butn i {
-	 padding-right: 0.3em;
-}
 
 small{
   font-size: 9px;