fix(ui): stabilizza header in formazione e cambio servizio

- Riserva spazio fisso per l’icona del servizio per evitare scatti
- Stabilizza la larghezza del punteggio inline in modalità Formazione
- Migliora la coerenza visiva nelle testate home/guest

src/components/HomePage/HomePage.html

@@ -74,16 +74,22 @@
 <!-- home guest -->
       <div class="hea home">
         <span @click="decPunt('home')" :style="{ 'float': 'left' }">
-          {{ sp.nomi.home }} <img v-if="sp.servHome" src="/serv.png" width="25" />
-          <span v-if="visuForm">{{ sp.punt.home }}</span>
+          {{ sp.nomi.home }}
+          <span class="serv-slot">
+            <img v-show="sp.servHome" src="/serv.png" width="25" />
+          </span>
+          <span v-if="visuForm" class="score-inline">{{ sp.punt.home }}</span>
         </span>
         <span @click="incSet('home')" class="mr3" :style="{ 'float': 'right' }">set {{ sp.set.home }}</span>
       </div>
 
       <div class="hea guest">
         <span @click="decPunt('guest')" :style="{ 'float': 'right' }">
-          <img v-if="!sp.servHome" src="/serv.png" width="25" /> {{ sp.nomi.guest }}
-          <span v-if="visuForm">{{ sp.punt.guest }}</span>
+          <span class="serv-slot">
+            <img v-show="!sp.servHome" src="/serv.png" width="25" />
+          </span>
+          {{ sp.nomi.guest }}
+          <span v-if="visuForm" class="score-inline">{{ sp.punt.guest }}</span>
         </span>
         <span @click="incSet('guest')" class="ml3" :style="{ 'float': 'left' }">set {{ sp.set.guest }}</span>
       </div>
@@ -113,16 +119,22 @@
 
       <div class="hea guest">
         <span @click="decPunt('guest')" :style="{ 'float': 'left' }">
-          {{ sp.nomi.guest }} <img v-if="!sp.servHome" src="/serv.png" width="25" />
-          <span v-if="visuForm">{{ sp.punt.guest }}</span>
+          {{ sp.nomi.guest }}
+          <span class="serv-slot">
+            <img v-show="!sp.servHome" src="/serv.png" width="25" />
+          </span>
+          <span v-if="visuForm" class="score-inline">{{ sp.punt.guest }}</span>
         </span>
         <span @click="incSet('guest')" class="mr3" :style="{ 'float': 'right' }">set {{ sp.set.guest }}</span>
       </div>
 
       <div class="hea home">
         <span @click="decPunt('home')" :style="{ 'float': 'right' }">
-          <img v-if="sp.servHome" src="/serv.png" width="25" /> {{ sp.nomi.home }}
-          <span v-if="visuForm">{{ sp.punt.home }}</span>
+          <span class="serv-slot">
+            <img v-show="sp.servHome" src="/serv.png" width="25" />
+          </span>
+          {{ sp.nomi.home }}
+          <span v-if="visuForm" class="score-inline">{{ sp.punt.home }}</span>
         </span>
         <span @click="incSet('home')" class="ml3" :style="{ 'float': 'left' }">set {{ sp.set.home }}</span>
       </div>
@@ -191,4 +203,4 @@
       </div>
     </div>
 </section>
-  
+  

src/components/HomePage/HomePage.js

@@ -90,9 +90,8 @@ export default {
       }
     },
     incPunt(team) {
-      // Controlla se c'è già una condizione di vittoria
+      // Se il set è già terminato, evita ulteriori incrementi
       if (this.checkVittoria()) {
-        this.$waveui.notify("Il set è terminato!", "warning");
         return;
       }
 
@@ -171,6 +170,7 @@ export default {
 
         // Ripristina il servizio allo stato precedente
         this.sp.servHome = statoServizio.servHome;
+
       }
     },
     // decPunt(team) {
@@ -249,4 +249,4 @@ export default {
       } else { return false }
     }
   }
-}
+}

src/style.css

@@ -58,6 +58,19 @@ button:focus-visible {
   padding-right: 10px;
   border-radius: 5px;
 }
+.score-inline {
+  display: inline-block;
+  min-width: 3ch;
+  text-align: center;
+}
+.serv-slot {
+  display: inline-flex;
+  width: 25px;
+  height: 25px;
+  align-items: center;
+  justify-content: center;
+  vertical-align: middle;
+}
 .tal {
   text-align: left;
 }
@@ -176,4 +189,4 @@ button:focus-visible {
   width: 100%;
   height: 0;
   margin: 0;
-}
+}