From ee13c00bbb3e0aaeb9f2388403cb207ffd35cbc7 Mon Sep 17 00:00:00 2001
From: Mariusz Pacek <pacekm90@gmail.com>
Date: Sun, 25 Oct 2026 09:18:44 +0100
Subject: [PATCH] fix(frontend): short hour labels so the buttons do not wrap

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
---
 frontend/src/Settings.test.tsx | 6 +++---
 frontend/src/Settings.tsx      | 2 +-
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/frontend/src/Settings.test.tsx b/frontend/src/Settings.test.tsx
index 6e48ddf..2780f39 100644
--- a/frontend/src/Settings.test.tsx
+++ b/frontend/src/Settings.test.tsx
@@ -241,7 +241,7 @@ describe("Settings", () => {
       const fetch = await open();
 
       expect(screen.getByRole("status").textContent).toBe("45 °C");
-      expect(screen.getByRole("button", { name: "2 godz." })).toHaveAttribute("aria-pressed", "true");
+      expect(screen.getByRole("button", { name: "2 h" })).toHaveAttribute("aria-pressed", "true");
       expect(screen.getByText(paragraph("Ciepła woda do 45 °C przez 2 godz., potem wróci 8 °C."))).toBeInTheDocument();
       await userEvent.click(screen.getByRole("button", { name: "Podgrzej wodę" }));
 
@@ -253,8 +253,8 @@ describe("Settings", () => {
       const fetch = await open();
 
       await userEvent.click(screen.getByLabelText("Mniej: Ciepła woda – oszczędnie"));
-      await userEvent.click(screen.getByRole("button", { name: "4 godz." }));
-      expect(screen.getByRole("button", { name: "2 godz." })).toHaveAttribute("aria-pressed", "false");
+      await userEvent.click(screen.getByRole("button", { name: "4 h" }));
+      expect(screen.getByRole("button", { name: "2 h" })).toHaveAttribute("aria-pressed", "false");
       expect(screen.getByText(paragraph("Ciepła woda do 44 °C przez 4 godz., potem wróci 8 °C."))).toBeInTheDocument();
       await userEvent.click(screen.getByRole("button", { name: "Podgrzej wodę" }));
 
diff --git a/frontend/src/Settings.tsx b/frontend/src/Settings.tsx
index e2b49f5..5f3b2d7 100644
--- a/frontend/src/Settings.tsx
+++ b/frontend/src/Settings.tsx
@@ -197,7 +197,7 @@ function TimedForm({ data, preset, hp, busy, onCancel, onConfirm }: {
       <p className="mt-4 mb-2 font-semibold">Na jak długo</p>
       <div className="mb-4 grid grid-cols-4 gap-2">
         {PRESET_HOURS.map((h) => (
-          <Button key={h} aria-pressed={h === hours} disabled={busy} onClick={() => setHours(h)}>{duration(h)}</Button>
+          <Button key={h} aria-pressed={h === hours} disabled={busy} onClick={() => setHours(h)}>{h} h</Button>
         ))}
       </div>
       <div className="flex gap-3">