未割り当て圃場の圃場名が切れる問題を修正

w-32 truncate(128px固定)を flex-1 min-w-0 truncate に変更し、
利用可能な幅いっぱいに伸びるようにした。
ホバーで全文確認できるよう title 属性も追加。

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Akira
2026-03-02 09:50:42 +09:00
parent 466eef128c
commit a331f8b30a

View File

@@ -534,8 +534,8 @@ export default function DistributionEditPage({ planId }: Props) {
<div className="space-y-1">
{unassignedFields.map(fi => (
<div key={fi.id} className="flex items-center gap-2 text-sm">
<span className="text-gray-800 font-medium w-32 truncate">{fi.name}</span>
<span className="text-gray-400 text-xs w-16 text-right">{fi.area_tan}</span>
<span className="text-gray-800 font-medium flex-1 min-w-0 truncate" title={fi.name}>{fi.name}</span>
<span className="text-gray-400 text-xs w-16 shrink-0 text-right">{fi.area_tan}</span>
<select
defaultValue=""
onChange={e => {