fix: playground message flashing

src/components/status-tag/index.less

@@ -12,7 +12,7 @@
   overflow: hidden;
 
   &.download {
-    border: 1px solid var(--ant-color-border) !important;
+    border: 1px solid #93ecc5 !important;
   }
 
   .download {
@@ -24,12 +24,14 @@
     top: 0;
     bottom: 0;
     height: 100%;
-    background-color: rgba(0, 0, 0, 15%);
+    // background-color: rgba(0, 0, 0, 15%);
+    background-color: #e0f5ec;
   }
 
   .progress {
     position: relative;
     z-index: 10;
-    color: var(--ant-color-text);
+    // color: var(--ant-color-text);
+    color: var(--color-progress-green);
   }
 }

src/components/status-tag/index.tsx

@@ -27,7 +27,11 @@ type StatusTagProps = {
 
 const StatusTag: React.FC<StatusTagProps> = ({ statusValue, download }) => {
   const { text, status } = statusValue;
-  const [statusColor, setStatusColor] = useState<{ text: string; bg: string }>({
+  const [statusColor, setStatusColor] = useState<{
+    text: string;
+    bg: string;
+    border?: string;
+  }>({
     text: '',
     bg: ''
   });
@@ -56,7 +60,7 @@ const StatusTag: React.FC<StatusTagProps> = ({ statusValue, download }) => {
       })}
       style={{
         color: statusColor?.text,
-        border: `1px solid ${statusColor?.text}`
+        border: `1px solid ${statusColor?.border || statusColor?.text}`
       }}
     >
       {statusValue.message ? (