From f1c0c91686718b3a6dce562817ea57a9942f8814 Mon Sep 17 00:00:00 2001
From: FinleyHsu <FinleyHsu@users.noreply.github.com>
Date: Thu, 6 Aug 2026 11:12:40 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96=E7=A7=B0=E9=87=8D=E9=A1=B5?=
 =?UTF-8?q?=E9=9D=A2=E4=B8=8E=E6=9C=BA=E5=8F=B0=E9=80=89=E6=8B=A9=E5=B8=83?=
 =?UTF-8?q?=E5=B1=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 app/globals.css | 17 +++++++++++++----
 app/page.tsx    | 19 +++++++------------
 2 files changed, 20 insertions(+), 16 deletions(-)

diff --git a/app/globals.css b/app/globals.css
index bcce9fd..194a45a 100644
--- a/app/globals.css
+++ b/app/globals.css
@@ -145,9 +145,12 @@ h1 em { font-style: normal; color: var(--green); }
 .identity-operation-panel { flex: 1.1 1 0; }
 .identity-person-panel .identity-card { min-height: 88px; padding: 13px; box-shadow: none; }
 .identity-person-panel .identity-card h3 { font-size: 24px; }
-.identity-operation-panel .machine-select-row { min-height: 72px; }
-.identity-operation-panel .machine-select-row b { font-size: 20px; }
+.identity-machine-card { min-height: 88px; padding: 13px; box-shadow: none; }
+.identity-machine-card.selected { border-color: #a9cbbb; background: #fbfefc; }
+.identity-machine-card h3 { font-size: 24px; }
+.machine-select-action { margin-left: auto; border: 0; border-radius: 9px; background: var(--green); color: white; padding: 11px 14px; font-size: 13px; font-weight: 800; }
 .identity-operation-panel .full-primary { margin-top: 14px; padding: 13px 16px; font-size: 15px; }
+.identity-confirm { margin-top: 14px; }
 .identity-back { position: absolute; top: 0; left: 0; z-index: 1; }
 .identity-material-compact { min-height: 42px; justify-content: flex-start; gap: 8px; margin: 0 0 12px; padding: 8px 12px; }
 .identity-material-compact small, .identity-material-compact b, .identity-material-compact em { display: inline; }
@@ -801,8 +804,8 @@ h1 em { font-style: normal; color: var(--green); }
   .identity-person-panel .identity-card { min-height: 88px; padding: 13px; box-shadow: none; }
   .identity-person-panel .identity-card h3 { font-size: 24px; }
   .identity-person-panel .identity-card p { font-size: 16px; }
-  .identity-operation-panel .machine-select-row { min-height: 72px; }
-  .identity-operation-panel .machine-select-row b { font-size: 20px; }
+  .identity-machine-card { min-height: 88px; }
+  .identity-machine-card h3 { font-size: 24px; }
   .identity-operation-panel .full-primary { margin-top: 14px; padding: 13px 16px; font-size: 15px; }
   .identity-material-compact { min-height: 36px; margin: 0 0 10px; padding: 7px 11px; border-radius: 10px; }
   .identity-material-compact b { font-size: 14px; }
@@ -818,4 +821,10 @@ h1 em { font-style: normal; color: var(--green); }
 
 @media (orientation: landscape) {
   .weight-number span { font-size: 128px !important; }
+  footer.production-footer { min-height: 40px; height: 40px; padding: 0 24px; justify-content: center; text-align: center; }
+  .machine-option-list { display: flex; flex-direction: row; flex-wrap: wrap; justify-content: space-between; align-content: flex-start; }
+  .machine-option-list > button { width: 32%; flex: 0 0 32%; margin: 0 0 8px; padding: 9px 8px; }
+  .machine-option-list > button > span { width: 24px; height: 24px; }
+  .machine-option-list > button b { font-size: 12px; }
+  .machine-option-list > button i { display: none; }
 }
diff --git a/app/page.tsx b/app/page.tsx
index 66c1287..6eacd0e 100644
--- a/app/page.tsx
+++ b/app/page.tsx
@@ -891,10 +891,6 @@ export default function Home() {
               <small>WOER · SMART SCALE</small>
             </span>
           </button>
-          <div className="status-pill">
-            <span className="status-dot" />
-            {t("online")}
-          </div>
         </header>
 
         <div className="content">
@@ -956,17 +952,16 @@ export default function Home() {
                 </section>
                 <section className="identity-operation-panel">
                   <div className="identity-panel-heading"><span>{t("machineNo")}</span></div>
-                  <div className={machine ? "machine-select-row selected" : "machine-select-row"}>
-                    <span className="machine-select-icon">▣</span>
-                    <span><small>{machine ? t("selectedMachine") : t("machineNo")}</small><b>{machine || t("noMachine")}</b></span>
-                    <button onClick={() => { setMachineQuery(""); setMachineKeypadOpen(false); setMachineModalOpen(true); }}>{t("selectMachine")}</button>
-                    <button className="machine-refresh" onClick={() => void refreshMachines()} disabled={machineLoading}>↻ {t("refreshMachine")}</button>
+                  <div className={machine ? "identity-card identity-machine-card selected" : "identity-card identity-machine-card"}>
+                    <div className="avatar">▣</div>
+                    <div><small>{machine ? t("selectedMachine") : t("machineNo")}</small><h3>{machine || t("noMachine")}</h3><p>{machine ? t("selectedMachine") : t("selectMachine")}</p></div>
+                    <button className="machine-select-action" onClick={() => { setMachineQuery(""); setMachineKeypadOpen(false); setMachineModalOpen(true); }}>{t("selectMachine")}</button>
                   </div>
-                  <button className="full-primary" disabled={!employee.name || !machine} onClick={beginWeighing}>
-                    {t("confirmWeigh")} <span>→</span>
-                  </button>
                 </section>
               </div>
+              <button className="full-primary identity-confirm" disabled={!employee.name || !machine} onClick={beginWeighing}>
+                {t("confirmWeigh")} <span>→</span>
+              </button>
               {notice && <div className="notice">ⓘ {notice}</div>}
             </div>
           )}