From 94cd2ce9c1bdf9c67dc61037795301a43612259e Mon Sep 17 00:00:00 2001
From: Laurent <laurent@staxriver.com>
Date: Tue, 20 Aug 2024 15:38:45 +0200
Subject: [PATCH] improve responsiveness

---
 .../static/tournaments/css/blue_style.css       | 17 +++++++++++++++--
 tournaments/templates/tournaments/download.html |  6 +++---
 2 files changed, 18 insertions(+), 5 deletions(-)

diff --git a/tournaments/static/tournaments/css/blue_style.css b/tournaments/static/tournaments/css/blue_style.css
index 3b014ae..634f252 100644
--- a/tournaments/static/tournaments/css/blue_style.css
+++ b/tournaments/static/tournaments/css/blue_style.css
@@ -17,7 +17,7 @@ html,
 body {
     background: #1b223a;
     color: white;
-    font-size: 1em;
+    font-size: clamp(16px, 1vw, 32px);
     font-weight: 600;
     margin: 0px;
 }
@@ -65,10 +65,23 @@ nav a {
     background-color: #f39200;
     border-radius: 15px;
     text-decoration: none;
-    font-size: 0.9em;
+    font-size: clamp(16px, 0.5vw, 32px);
     font-weight: 600;
 }
 
+.header {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+}
+
+.flex1 {
+    flex: 1;
+}
+.flex2 {
+    flex: 2;
+}
+
 nav a:hover {
     color: #1b223a;
 }
diff --git a/tournaments/templates/tournaments/download.html b/tournaments/templates/tournaments/download.html
index 159583e..f2e03b2 100644
--- a/tournaments/templates/tournaments/download.html
+++ b/tournaments/templates/tournaments/download.html
@@ -44,9 +44,9 @@
         <div class="wrapper">
         <header>
             <div class="grid-x">
-                <div class="cell topblock my-block flex">
+                <div class="cell topblock my-block header">
 
-                    <div class="flex-left">
+                    <div class="flex2">
                         <a href="{% url 'index' %}">
                         <img
                             src="{% static 'tournaments/images/PadelClub_logo_fondfonce_transparent.png' %}"
@@ -61,7 +61,7 @@
 
                     </div>
 
-                    <div class="flex-right simple">
+                    <div class="simple flex1 right">
                         <a href="mailto:support@padelclub.app" class="">Écrivez-nous !</a>
                     </div>