From d4f23a52aff087c319564e882638c5aa4cbfdfc2 Mon Sep 17 00:00:00 2001
From: Gregory Salaun <legreg002@hotmail.com>
Date: Tue, 11 Aug 2026 21:35:41 +0200
Subject: [PATCH] fix(details): QSL via gets the width, QSL message gives it up
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Width should follow use, and these two are nowhere near equal: a manager's
callsign is typed constantly, a QSL message almost never. The message held 7
columns of 12 for text most operators never write, while the field beside it —
often a long "via" instruction — was the one running out of room.

Swapped, so QSL via takes 7 and the message 5. Also puts them in the order they
are reached for.
---
 frontend/src/components/DetailsPanel.tsx | 12 ++++++++----
 1 file changed, 8 insertions(+), 4 deletions(-)

diff --git a/frontend/src/components/DetailsPanel.tsx b/frontend/src/components/DetailsPanel.tsx
index d4ffb2f..5af56a7 100644
--- a/frontend/src/components/DetailsPanel.tsx
+++ b/frontend/src/components/DetailsPanel.tsx
@@ -373,12 +373,16 @@ export function DetailsPanel({ callsign, prefix, operatorGrid, remoteGrid, qth,
               <Input value={details.address} onChange={(e) => onChange({ address: e.target.value })} />
             </Field>
           </div>
-          <Field label={t('detp.qslMessage')} span={7}>
-            <Input value={details.qsl_msg} onChange={(e) => onChange({ qsl_msg: e.target.value })} />
-          </Field>
-          <Field label={t('detp.qslVia')} span={5}>
+          {/* QSL via gets the room, not the message. Width should follow use, and
+              these two are nowhere near equal: a manager's callsign is filled in
+              constantly and a QSL message almost never. The message had 7 columns
+              of 12 for text most operators never type. */}
+          <Field label={t('detp.qslVia')} span={7}>
             <Input value={details.qsl_via} onChange={(e) => onChange({ qsl_via: e.target.value })} />
           </Field>
+          <Field label={t('detp.qslMessage')} span={5}>
+            <Input value={details.qsl_msg} onChange={(e) => onChange({ qsl_msg: e.target.value })} />
+          </Field>
         </div>
       )}