mantenimento-app 2.4.5 → 2.4.7

package/app.js

@@ -289,7 +289,7 @@ const defaultExpenseItems = [
         firstHomeAssignedToHint: "Seleziona il coniuge a cui e ceduta la prima casa.",
         firstHomeAssignedToNone: "Nessuna cessione",
         firstHomeAssignedToSpouse: "Casa ceduta a {spouse}",
-        firstHomeSplitLabel: "Quota mutuo a carico {spouse} (%)",
+        firstHomeSplitLabel: "Quota mutuo a carico",
         firstHomeSplitHint: "Percentuale della rata mutuo pagata da {spouse}. La quota dell'altro coniuge e complementare a 100%.",
         firstHomeSplitInfo: "Ripartizione mutuo: {spouse1} {p1}% · {spouse2} {p2}%",
         calcCompBenefitsLabel: "Benefici compensativi gia allocati",
@@ -651,7 +651,7 @@ const defaultExpenseItems = [
         firstHomeAssignedToHint: "Select which spouse receives assignment of the primary home.",
         firstHomeAssignedToNone: "No assignment",
         firstHomeAssignedToSpouse: "Home assigned to {spouse}",
-        firstHomeSplitLabel: "Mortgage share paid by {spouse} (%)",
+        firstHomeSplitLabel: "Mortgage share allocation",
         firstHomeSplitHint: "Percentage of the monthly mortgage payment paid by {spouse}. The other spouse share is the complement to 100%.",
         firstHomeSplitInfo: "Mortgage split: {spouse1} {p1}% · {spouse2} {p2}%",
         calcCompBenefitsLabel: "Compensative benefits already allocated",
@@ -1290,7 +1290,7 @@ const defaultExpenseItems = [
       if (hintPrimaCasaMutuoImporto) hintPrimaCasaMutuoImporto.title = tr("firstHomeMortgageAmountHint");
       if (lblPrimaCasaAssegnataA) lblPrimaCasaAssegnataA.textContent = tr("firstHomeAssignedToLabel");
       if (hintPrimaCasaAssegnataA) hintPrimaCasaAssegnataA.title = tr("firstHomeAssignedToHint");
-      if (lblPrimaCasaMutuoPerc1) lblPrimaCasaMutuoPerc1.textContent = msg("firstHomeSplitLabel", { spouse: c1n() });
+      if (lblPrimaCasaMutuoPerc1) lblPrimaCasaMutuoPerc1.textContent = tr("firstHomeSplitLabel");
       if (hintPrimaCasaMutuoPerc1) hintPrimaCasaMutuoPerc1.title = msg("firstHomeSplitHint", { spouse: c1n() });
       if (lblStraordAnn1) lblStraordAnn1.textContent = msg("extraAnnLabel1", { spouse: c1n(), currency: currentCurrency });
       if (lblStraordAnn2) lblStraordAnn2.textContent = msg("extraAnnLabel2", { spouse: c2n(), currency: currentCurrency });
@@ -3931,7 +3931,7 @@ const defaultExpenseItems = [
       const amount = Math.max(0, num("primaCasaMutuoImporto"));
       const quota1 = amount * (normalizedShare1 / 100);
       const quota2 = amount - quota1;
-      if (splitLabelEl) splitLabelEl.textContent = msg("firstHomeSplitLabel", { spouse: c1n() });
+      if (splitLabelEl) splitLabelEl.textContent = tr("firstHomeSplitLabel");
       if (splitHintEl) splitHintEl.title = msg("firstHomeSplitHint", { spouse: c1n() });
       if (splitInfoEl) {
         splitInfoEl.textContent = msg("firstHomeSplitInfo", {
@@ -6469,6 +6469,19 @@ ${scenarioLab.length ? `
       }
     });
 
+    const firstHomeShiftLeftBtn = document.getElementById("primaCasaMutuoShiftLeft");
+    const firstHomeShiftRightBtn = document.getElementById("primaCasaMutuoShiftRight");
+    const firstHomeShareInput = document.getElementById("primaCasaMutuoPerc1");
+    const shiftFirstHomeShare = (delta) => {
+      if (!firstHomeShareInput || firstHomeShareInput.disabled) return;
+      const next = Math.min(100, Math.max(0, Number(firstHomeShareInput.value || 0) + delta));
+      firstHomeShareInput.value = String(next);
+      updateFirstHomeMortgageUi();
+      renderAll();
+    };
+    if (firstHomeShiftLeftBtn) firstHomeShiftLeftBtn.addEventListener("click", () => shiftFirstHomeShare(-1));
+    if (firstHomeShiftRightBtn) firstHomeShiftRightBtn.addEventListener("click", () => shiftFirstHomeShare(1));
+
     document.getElementById("langSelect").addEventListener("change", (e) => {
       const next = String(e.target.value || "it").toLowerCase();
       currentLang = SUPPORTED_LANGS.includes(next) ? next : "it";

package/frontend/public/app.js

@@ -289,7 +289,7 @@ const defaultExpenseItems = [
         firstHomeAssignedToHint: "Seleziona il coniuge a cui e ceduta la prima casa.",
         firstHomeAssignedToNone: "Nessuna cessione",
         firstHomeAssignedToSpouse: "Casa ceduta a {spouse}",
-        firstHomeSplitLabel: "Quota mutuo a carico {spouse} (%)",
+        firstHomeSplitLabel: "Quota mutuo a carico",
         firstHomeSplitHint: "Percentuale della rata mutuo pagata da {spouse}. La quota dell'altro coniuge e complementare a 100%.",
         firstHomeSplitInfo: "Ripartizione mutuo: {spouse1} {p1}% · {spouse2} {p2}%",
         calcCompBenefitsLabel: "Benefici compensativi gia allocati",
@@ -651,7 +651,7 @@ const defaultExpenseItems = [
         firstHomeAssignedToHint: "Select which spouse receives assignment of the primary home.",
         firstHomeAssignedToNone: "No assignment",
         firstHomeAssignedToSpouse: "Home assigned to {spouse}",
-        firstHomeSplitLabel: "Mortgage share paid by {spouse} (%)",
+        firstHomeSplitLabel: "Mortgage share allocation",
         firstHomeSplitHint: "Percentage of the monthly mortgage payment paid by {spouse}. The other spouse share is the complement to 100%.",
         firstHomeSplitInfo: "Mortgage split: {spouse1} {p1}% · {spouse2} {p2}%",
         calcCompBenefitsLabel: "Compensative benefits already allocated",
@@ -1290,7 +1290,7 @@ const defaultExpenseItems = [
       if (hintPrimaCasaMutuoImporto) hintPrimaCasaMutuoImporto.title = tr("firstHomeMortgageAmountHint");
       if (lblPrimaCasaAssegnataA) lblPrimaCasaAssegnataA.textContent = tr("firstHomeAssignedToLabel");
       if (hintPrimaCasaAssegnataA) hintPrimaCasaAssegnataA.title = tr("firstHomeAssignedToHint");
-      if (lblPrimaCasaMutuoPerc1) lblPrimaCasaMutuoPerc1.textContent = msg("firstHomeSplitLabel", { spouse: c1n() });
+      if (lblPrimaCasaMutuoPerc1) lblPrimaCasaMutuoPerc1.textContent = tr("firstHomeSplitLabel");
       if (hintPrimaCasaMutuoPerc1) hintPrimaCasaMutuoPerc1.title = msg("firstHomeSplitHint", { spouse: c1n() });
       if (lblStraordAnn1) lblStraordAnn1.textContent = msg("extraAnnLabel1", { spouse: c1n(), currency: currentCurrency });
       if (lblStraordAnn2) lblStraordAnn2.textContent = msg("extraAnnLabel2", { spouse: c2n(), currency: currentCurrency });
@@ -3931,7 +3931,7 @@ const defaultExpenseItems = [
       const amount = Math.max(0, num("primaCasaMutuoImporto"));
       const quota1 = amount * (normalizedShare1 / 100);
       const quota2 = amount - quota1;
-      if (splitLabelEl) splitLabelEl.textContent = msg("firstHomeSplitLabel", { spouse: c1n() });
+      if (splitLabelEl) splitLabelEl.textContent = tr("firstHomeSplitLabel");
       if (splitHintEl) splitHintEl.title = msg("firstHomeSplitHint", { spouse: c1n() });
       if (splitInfoEl) {
         splitInfoEl.textContent = msg("firstHomeSplitInfo", {
@@ -6469,6 +6469,19 @@ ${scenarioLab.length ? `
       }
     });
 
+    const firstHomeShiftLeftBtn = document.getElementById("primaCasaMutuoShiftLeft");
+    const firstHomeShiftRightBtn = document.getElementById("primaCasaMutuoShiftRight");
+    const firstHomeShareInput = document.getElementById("primaCasaMutuoPerc1");
+    const shiftFirstHomeShare = (delta) => {
+      if (!firstHomeShareInput || firstHomeShareInput.disabled) return;
+      const next = Math.min(100, Math.max(0, Number(firstHomeShareInput.value || 0) + delta));
+      firstHomeShareInput.value = String(next);
+      updateFirstHomeMortgageUi();
+      renderAll();
+    };
+    if (firstHomeShiftLeftBtn) firstHomeShiftLeftBtn.addEventListener("click", () => shiftFirstHomeShare(-1));
+    if (firstHomeShiftRightBtn) firstHomeShiftRightBtn.addEventListener("click", () => shiftFirstHomeShare(1));
+
     document.getElementById("langSelect").addEventListener("change", (e) => {
       const next = String(e.target.value || "it").toLowerCase();
       currentLang = SUPPORTED_LANGS.includes(next) ? next : "it";

package/frontend/public/index.html

@@ -88,7 +88,7 @@
     ]
   }
   </script>
-    <link rel="stylesheet" href="styles.css?v=2.4.5" />
+    <link rel="stylesheet" href="styles.css?v=2.4.7" />
 </head>
 <body>
   <div class="wrap">
@@ -380,8 +380,8 @@
                 </label>
                 <input id="primaCasaMutuoImporto" type="number" min="0" step="50" value="0" />
               </div>
-              <div class="field">
-                <label for="primaCasaMutuoPerc1" class="label-row"><span id="lblPrimaCasaMutuoPerc1">Quota mutuo a carico Coniuge 1 (%)</span>
+              <div class="field first-home-split-field">
+                <label for="primaCasaMutuoPerc1" class="label-row"><span id="lblPrimaCasaMutuoPerc1">Quota mutuo a carico</span>
                   <span class="hint" id="hintPrimaCasaMutuoPerc1" title="Percentuale della rata mutuo pagata da Coniuge 1. La quota dell'altro coniuge e complementare a 100%.">i</span>
                 </label>
                 <div class="mortgage-split-slider" id="primaCasaMutuoSliderWrap">
@@ -390,7 +390,11 @@
                     <div class="mortgage-split-amount" id="primaCasaSplitLeftAmount">0 EUR</div>
                   </div>
                   <div class="mortgage-split-range-wrap">
-                    <input id="primaCasaMutuoPerc1" type="range" min="0" max="100" step="1" value="50" aria-label="Ripartizione quota mutuo" />
+                    <div class="mortgage-split-range-controls">
+                      <button id="primaCasaMutuoShiftLeft" class="mortgage-split-nudge" type="button" aria-label="Sposta quota verso sinistra" title="Sposta quota verso sinistra">&#9664;</button>
+                      <input id="primaCasaMutuoPerc1" type="range" min="0" max="100" step="1" value="50" aria-label="Ripartizione quota mutuo" />
+                      <button id="primaCasaMutuoShiftRight" class="mortgage-split-nudge" type="button" aria-label="Sposta quota verso destra" title="Sposta quota verso destra">&#9654;</button>
+                    </div>
                     <div class="mortgage-split-center" id="primaCasaSplitCenter">50% / 50%</div>
                   </div>
                   <div class="mortgage-split-side mortgage-split-side-right" id="primaCasaSplitRight">
@@ -626,7 +630,7 @@
   <script src="supabase.min.js"></script>
   <script src="fabric.min.js"></script>
   <script src="html2pdf.bundle.min.js"></script>
-    <script src="app.js?v=2.4.5"></script>
+    <script src="app.js?v=2.4.7"></script>
 </body>
 </html>
 

package/frontend/public/styles.css

@@ -945,6 +945,10 @@
       gap: 8px 10px;
     }
 
+    .extra-box-first-home .first-home-split-field {
+      grid-column: 1 / -1;
+    }
+
     .extra-box-first-home .field {
       border-radius: 12px;
       padding: 8px 9px 7px;
@@ -1032,7 +1036,7 @@
       border-radius: 14px;
       padding: 12px;
       background: linear-gradient(135deg, #ffffff 0%, #f5fbf9 100%);
-      min-height: 62px;
+      min-height: 74px;
       display: grid;
       align-content: center;
       gap: 4px;
@@ -1087,16 +1091,16 @@
     }
 
     .mortgage-split-name {
-      font-size: 0.73rem;
+      font-size: 0.92rem;
       font-weight: 800;
       color: #1a3a36;
       overflow-wrap: anywhere;
-      letter-spacing: 0.3px;
+      letter-spacing: 0.2px;
       text-shadow: 0 1px 2px rgba(255, 255, 255, 0.5);
     }
 
     .mortgage-split-amount {
-      font-size: 0.95rem;
+      font-size: 1.28rem;
       font-weight: 900;
       color: #0b4440;
       letter-spacing: 0.3px;
@@ -1120,6 +1124,48 @@
       --split-left: 50%;
     }
 
+    .mortgage-split-range-controls {
+      display: grid;
+      grid-template-columns: 42px minmax(0, 1fr) 42px;
+      gap: 8px;
+      align-items: center;
+    }
+
+    .mortgage-split-nudge {
+      height: 38px;
+      width: 38px;
+      padding: 0;
+      display: inline-flex;
+      align-items: center;
+      justify-content: center;
+      border-radius: 50%;
+      border: 1.5px solid rgba(27, 141, 127, 0.3);
+      background: radial-gradient(circle at 30% 30%, #ffffff 0%, #ecfaf6 44%, #dff4ef 100%);
+      color: #0f6056;
+      font-size: 17px;
+      font-weight: 900;
+      line-height: 1;
+      cursor: pointer;
+      box-shadow: 0 4px 10px rgba(17, 93, 84, 0.2), inset 0 1px 0 rgba(255, 255, 255, 0.9);
+      transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
+    }
+
+    .mortgage-split-nudge:hover {
+      transform: translateY(-1px) scale(1.06);
+      border-color: rgba(27, 141, 127, 0.44);
+      box-shadow: 0 7px 16px rgba(17, 93, 84, 0.24), inset 0 1px 0 rgba(255, 255, 255, 0.92);
+    }
+
+    .mortgage-split-nudge:active {
+      transform: translateY(0) scale(0.98);
+    }
+
+    .mortgage-split-slider.is-disabled .mortgage-split-nudge {
+      opacity: 0.6;
+      cursor: not-allowed;
+      transform: none;
+    }
+
     .mortgage-split-range-wrap input[type="range"] {
       -webkit-appearance: none;
       appearance: none;
@@ -1188,13 +1234,13 @@
       top: 2px;
       left: var(--split-left);
       transform: translateX(-50%);
-      font-size: 0.73rem;
+      font-size: 0.92rem;
       font-weight: 900;
       color: #0f544d;
       background: linear-gradient(135deg, #ffffff, #f5fbf9);
       border: 1.5px solid rgba(27, 141, 127, 0.2);
       border-radius: 999px;
-      padding: 2px 9px;
+      padding: 4px 11px;
       white-space: nowrap;
       box-shadow: 0 2px 6px rgba(27, 141, 127, 0.15), inset 0 1px 2px rgba(255, 255, 255, 0.6);
       transition: all 0.2s ease;
@@ -1214,17 +1260,23 @@
 
     #primaCasaMutuoSplitInfo {
       margin-top: 7px;
-      font-size: 0.79rem;
+      font-size: 0.95rem;
       font-weight: 700;
       color: #174e47;
       background: linear-gradient(90deg, rgba(22, 163, 150, 0.12), rgba(216, 154, 53, 0.12));
       border: 1px solid rgba(22, 163, 150, 0.14);
       border-radius: 999px;
-      padding: 4px 10px;
+      padding: 7px 12px;
       display: inline-flex;
       align-items: center;
       gap: 4px;
     }
+
+    .first-home-split-field > .label-row {
+      font-size: 1.1rem;
+      font-weight: 800;
+      color: #114b44;
+    }
     
     .label-row {
       display: inline-flex;
@@ -2701,7 +2753,7 @@
       padding: 7px;
     }
 
-    .kpi-item strong { font-size: 1.05rem; font-weight: 700; white-space: nowrap; }
+    .kpi-item:not(.kpi-item--longtext) strong { font-size: 1.05rem; font-weight: 700; white-space: nowrap; }
 
     .result-pill {
       border-radius: 14px;
@@ -3495,6 +3547,16 @@
       .mortgage-split-range-wrap {
         order: -1;
       }
+
+      .mortgage-split-range-controls {
+        grid-template-columns: 34px minmax(0, 1fr) 34px;
+      }
+
+      .mortgage-split-nudge {
+        height: 32px;
+        width: 32px;
+        font-size: 14px;
+      }
       .spieg-grid {
         grid-template-columns: 1fr;
       }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "mantenimento-app",
-  "version": "2.4.5",
+  "version": "2.4.7",
   "description": "Frontend + backend architecture for the mantenimento calculator",
   "type": "commonjs",
   "main": "backend/calculate-model.js",