From 25fc518c5d62e23c788c3ef43da10fddbb116433 Mon Sep 17 00:00:00 2001
From: JzoNg <jzongcode@gmail.com>
Date: Wed, 29 Apr 2026 20:28:41 +0800
Subject: [PATCH] fix(web): style of config

---
 .../components/pipeline/pipeline-metric-item.tsx         | 9 +++++----
 1 file changed, 5 insertions(+), 4 deletions(-)

diff --git a/web/app/components/evaluation/components/pipeline/pipeline-metric-item.tsx b/web/app/components/evaluation/components/pipeline/pipeline-metric-item.tsx
index 4496f71edb..e357709c72 100644
--- a/web/app/components/evaluation/components/pipeline/pipeline-metric-item.tsx
+++ b/web/app/components/evaluation/components/pipeline/pipeline-metric-item.tsx
@@ -30,7 +30,7 @@ const PipelineMetricItem = ({
   const metricDescription = getTranslatedMetricDescription(t, metric.id, metric.description)
 
   return (
-    <div className="flex items-center justify-between gap-3 px-1 py-1">
+    <div className="flex h-8 items-center justify-between gap-3 px-1 py-1">
       <button
         type="button"
         className="flex min-w-0 items-center gap-2 text-left"
@@ -56,7 +56,7 @@ const PipelineMetricItem = ({
         ? (
             <div className="flex items-center gap-2">
               <span className="system-xs-medium text-text-accent">{t('pipeline.passIf')}</span>
-              <div className="w-[52px]">
+              <div className="w-[64px]">
                 <Input
                   value={String(threshold)}
                   type="number"
@@ -77,11 +77,12 @@ const PipelineMetricItem = ({
               type="button"
               disabled={disabledCondition}
               className={cn(
-                'system-xs-medium text-text-tertiary',
+                'flex items-center gap-0.5 system-xs-medium text-text-tertiary',
                 disabledCondition && 'cursor-not-allowed text-components-button-secondary-accent-text-disabled',
               )}
             >
-              + Condition
+              <span aria-hidden="true" className="i-ri-add-line h-3.5 w-3.5" />
+              {t('conditions.addCondition')}
             </button>
           )}
     </div>