diff --git a/ui/console-src/modules/contents/comments/components/CommentListItem.vue b/ui/console-src/modules/contents/comments/components/CommentListItem.vue
index 87b1b94db..0faa19a69 100644
--- a/ui/console-src/modules/contents/comments/components/CommentListItem.vue
+++ b/ui/console-src/modules/contents/comments/components/CommentListItem.vue
@@ -421,13 +421,11 @@ const { operationItems } = useOperationItemExtensionPoint<ListedComment>(
     <template #end>
       <VEntityField v-if="!comment?.comment.spec.approved">
         <template #description>
-          <VStatusDot state="success">
-            <template #text>
-              <span class="text-xs text-gray-500">
-                {{ $t("core.comment.list.fields.pending_review") }}
-              </span>
-            </template>
-          </VStatusDot>
+          <VStatusDot
+            state="warning"
+            animate
+            :text="$t('core.comment.list.fields.pending_review')"
+          />
         </template>
       </VEntityField>
       <VEntityField v-if="comment?.comment?.metadata.deletionTimestamp">
diff --git a/ui/console-src/modules/contents/comments/components/ReplyListItem.vue b/ui/console-src/modules/contents/comments/components/ReplyListItem.vue
index 4aa0e1d71..b8c38787e 100644
--- a/ui/console-src/modules/contents/comments/components/ReplyListItem.vue
+++ b/ui/console-src/modules/contents/comments/components/ReplyListItem.vue
@@ -216,13 +216,11 @@ const { operationItems } = useOperationItemExtensionPoint<ListedReply>(
     <template #end>
       <VEntityField v-if="!reply?.reply.spec.approved">
         <template #description>
-          <VStatusDot state="success">
-            <template #text>
-              <span class="text-xs text-gray-500">
-                {{ $t("core.comment.list.fields.pending_review") }}
-              </span>
-            </template>
-          </VStatusDot>
+          <VStatusDot
+            state="warning"
+            animate
+            :text="$t('core.comment.list.fields.pending_review')"
+          />
         </template>
       </VEntityField>
       <VEntityField v-if="reply?.reply.metadata.deletionTimestamp">
diff --git a/ui/packages/components/src/components/status/StatusDot.vue b/ui/packages/components/src/components/status/StatusDot.vue
index ddb79994b..af686be7f 100644
--- a/ui/packages/components/src/components/status/StatusDot.vue
+++ b/ui/packages/components/src/components/status/StatusDot.vue
@@ -40,7 +40,7 @@ const classes = computed(() => {
   }
 
   .status-dot-text {
-    @apply text-gray-500 text-xs;
+    @apply text-gray-500 text-xs whitespace-nowrap;
   }
 
   &.status-dot-animate {