From eae5cbf96444c3891320aa5d27eca3ef5973f835 Mon Sep 17 00:00:00 2001
From: davide3011 <davide.grilli@outlook.com>
Date: Wed, 28 Jan 2026 14:30:17 +0100
Subject: [PATCH] Fissa dimensioni riquadri punteggio per evitare spostamenti

---
 src/components/HomePage/HomePage.html | 12 ++++++++----
 src/style.css                         | 15 +++++++++++++++
 2 files changed, 23 insertions(+), 4 deletions(-)

diff --git a/src/components/HomePage/HomePage.html b/src/components/HomePage/HomePage.html
index a179fb1..b554f54 100644
--- a/src/components/HomePage/HomePage.html
+++ b/src/components/HomePage/HomePage.html
@@ -83,8 +83,10 @@
         </div>
       </span>
       <span v-else>
-        <div class="col punt home" @click="incPunt('home')">{{ sp.punt.home }}</div>
-        <div class="col punt guest" @click="incPunt('guest')">{{ sp.punt.guest }}</div>
+        <w-flex class="punteggio-container">
+          <w-flex justify-center align-center class="col punt home" @click="incPunt('home')">{{ sp.punt.home }}</w-flex>
+          <w-flex justify-center align-center class="col punt guest" @click="incPunt('guest')">{{ sp.punt.guest }}</w-flex>
+        </w-flex>
       </span>
   
       </span>
@@ -120,8 +122,10 @@
         </div>
       </span>
       <span v-else>
-        <div class="col punt guest" @click="incPunt('guest')">{{ sp.punt.guest }}</div>
-        <div class="col punt home" @click="incPunt('home')">{{ sp.punt.home }}</div>        
+        <w-flex class="punteggio-container">
+          <w-flex justify-center align-center class="col punt guest" @click="incPunt('guest')">{{ sp.punt.guest }}</w-flex>
+          <w-flex justify-center align-center class="col punt home" @click="incPunt('home')">{{ sp.punt.home }}</w-flex>
+        </w-flex>
       </span>
 
       </span>
diff --git a/src/style.css b/src/style.css
index 166e800..3e9d912 100644
--- a/src/style.css
+++ b/src/style.css
@@ -80,8 +80,23 @@ button:focus-visible {
   float: left;
   width: 50%;
 }
+.punteggio-container {
+  width: 100%;
+  height: 100%;
+  display: flex;
+}
 .punt {
   font-size: 60vh;
+  flex: 1;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  cursor: pointer;
+  min-height: 50vh;
+  min-width: 50vw;
+  max-width: 50vw;
+  overflow: hidden;
+  box-sizing: border-box;
 }
 .form {
   font-size: 5vh;