@@ -21,19 +21,19 @@ export function BundleCard({
2121 const isIosLatestBundle = iosLatestBundle ?. bundleId === bundle . bundleId ;
2222
2323 return (
24- < div className = "bg-white rounded-xl shadow-md p-6 border border-gray-200 hover:shadow-lg transition" >
25- < div className = "flex justify-between items-start mb-4" >
26- < div >
27- < h3 className = "font-semibold text-gray-800 flex items-center gap-4 " >
24+ < div className = "bg-white rounded-xl shadow-md p-4 sm:p- 6 border border-gray-200 hover:shadow-lg transition w-full max-w-full " >
25+ < div className = "flex flex-col sm:flex-row sm: justify-between sm: items-start gap-4 mb-4" >
26+ < div className = "flex-1" >
27+ < h3 className = "font-semibold text-gray-800 flex flex-wrap items-center gap-2 text-base sm:text-lg " >
2828 < span className = "text-blue-600" > #{ index + 1 } </ span > Bundle ID
29- < div className = "flex gap-2 " >
29+ < div className = "flex flex-wrap gap-1 " >
3030 { isAndroidLatestBundle && (
31- < span className = "px-2 py-1 text-xs font-medium text-white bg-green-500 rounded" >
31+ < span className = "px-2 py-0.5 text-xs font-medium text-white bg-green-500 rounded" >
3232 Android Latest
3333 </ span >
3434 ) }
3535 { isIosLatestBundle && (
36- < span className = "px-2 py-1 text-xs font-medium text-white bg-green-500 rounded" >
36+ < span className = "px-2 py-0.5 text-xs font-medium text-white bg-green-500 rounded" >
3737 iOS Latest
3838 </ span >
3939 ) }
@@ -44,15 +44,15 @@ export function BundleCard({
4444 </ p >
4545 </ div >
4646
47- < div className = "space-y -2" >
47+ < div className = "flex flex-wrap gap -2" >
4848 { (
4949 [ "FORCE_UPDATE" , "NORMAL_UPDATE" , "ROLLBACK" ] as UpdatePolicy [ ]
5050 ) . map ( ( policy ) => (
5151 < button
5252 type = "button"
5353 key = { policy }
5454 onClick = { ( ) => onUpdatePolicyChange ( bundle , policy ) }
55- className = { `px-4 py-1 rounded-md text-xs font-medium transition ${
55+ className = { `px-3 py-1 rounded-md text-xs font-medium transition ${
5656 bundle . updatePolicy === policy
5757 ? "bg-blue-600 text-white"
5858 : "bg-gray-200 text-gray-700 hover:bg-gray-300"
@@ -90,14 +90,13 @@ export function BundleCard({
9090 rel = "noreferrer"
9191 >
9292 < strong > Commit:</ strong > { " " }
93- < span className = "underline" > { bundle . gitHash } </ span >
93+ < span className = "underline break-all " > { bundle . gitHash } </ span >
9494 </ a >
95- { /* ✅ 수정된 부분: <p> 태그 밖에 <ul> 위치 */ }
9695 < div >
9796 < p className = "mb-1" >
9897 < strong > Policy Target:</ strong >
9998 </ p >
100- < ul className = "ml-4 list-disc text-xs" >
99+ < ul className = "ml-4 list-disc text-xs sm:text-sm " >
101100 { bundle . updatePolicy === "ROLLBACK" ? (
102101 < >
103102 { bundle . supportAndroid && (
0 commit comments