[ez][HUD] Fix metrics page layout after #6956 (#6965)

Metrics page very unaligned after
#6956

Old:
<img width="1719" height="783" alt="image"
src="https://github.com/user-attachments/assets/42423730-38df-42af-a56a-6093a1ab8c1f"
/>


New:
<img width="1720" height="792" alt="image"
src="https://github.com/user-attachments/assets/23079b61-2453-4206-becf-9b1c7c50080a"
/>

Author: clee2000

torchci/pages/metrics.tsx

@@ -752,28 +752,6 @@ export default function Page() {
           </Stack>
         </Grid2>
 
-        <Grid2
-          container
-          size={{ xs: 6, md: 3, lg: 2 }}
-          justifyContent={"stretch"}
-        >
-          <Stack
-            justifyContent={"space-between"}
-            flexGrow={1}
-            flexWrap="wrap"
-            spacing={1}
-          >
-            <ScalarPanel
-              title={"PR landing time (avg)"}
-              queryName={"pr_landing_time_avg"}
-              metricName={"avg_hours"}
-              valueRenderer={(value) => value.toFixed(1) + "h"}
-              queryParams={timeParams}
-              badThreshold={(value) => value > 24} // 24 hours
-            />
-          </Stack>
-        </Grid2>
-
         <Grid2
           container
           size={{ xs: 6, md: 3, lg: 2 }}
@@ -793,6 +771,14 @@ export default function Page() {
               queryParams={timeParams}
               badThreshold={(value) => value > 2.0} // 2.0 average retries
             />
+            <ScalarPanel
+              title={"PR landing time (avg)"}
+              queryName={"pr_landing_time_avg"}
+              metricName={"avg_hours"}
+              valueRenderer={(value) => value.toFixed(1) + "h"}
+              queryParams={timeParams}
+              badThreshold={(value) => value > 24} // 24 hours
+            />
           </Stack>
         </Grid2>