From f429e3fc016403108c2f20fb9064d71b3924cd6b Mon Sep 17 00:00:00 2001
From: icarus <eurfelux@gmail.com>
Date: Sat, 27 Sep 2025 13:55:01 +0800
Subject: [PATCH] style(ui): move lucide icon color rule and add warning icon
 to caution text

Move the lucide icon color rule into the media query block for consistency.
Add AlertTriangleIcon to caution text in AgentModal for better visual warning.
---
 src/renderer/src/assets/styles/index.css                | 8 ++++----
 src/renderer/src/components/Popups/agent/AgentModal.tsx | 4 +++-
 2 files changed, 7 insertions(+), 5 deletions(-)

diff --git a/src/renderer/src/assets/styles/index.css b/src/renderer/src/assets/styles/index.css
index 960d28061d..79a2959363 100644
--- a/src/renderer/src/assets/styles/index.css
+++ b/src/renderer/src/assets/styles/index.css
@@ -19,6 +19,10 @@
     /* margin: 0; */
     font-weight: normal;
   }
+
+  .lucide:not(.lucide-custom) {
+  color: var(--color-icon);
+}
 }
 
 *:focus {
@@ -171,10 +175,6 @@ ul {
   display: flow-root;
 }
 
-.lucide:not(.lucide-custom) {
-  color: var(--color-icon);
-}
-
 ::highlight(search-matches) {
   background-color: var(--color-background-highlight);
   color: var(--color-highlight);
diff --git a/src/renderer/src/components/Popups/agent/AgentModal.tsx b/src/renderer/src/components/Popups/agent/AgentModal.tsx
index 9358167778..96d6cda087 100644
--- a/src/renderer/src/components/Popups/agent/AgentModal.tsx
+++ b/src/renderer/src/components/Popups/agent/AgentModal.tsx
@@ -33,6 +33,7 @@ import {
   Tool,
   UpdateAgentForm
 } from '@renderer/types'
+import { AlertTriangleIcon } from 'lucide-react'
 import { ChangeEvent, FormEvent, ReactNode, useCallback, useEffect, useMemo, useRef, useState } from 'react'
 import { useTranslation } from 'react-i18next'
 
@@ -432,7 +433,8 @@ export const AgentModal: React.FC<Props> = ({ agent, trigger, isOpen: _isOpen, o
                             {t(item.behaviorKey, item.behaviorFallback)}
                           </span>
                           {item.caution ? (
-                            <span className="text-danger-500 text-xs">
+                            <span className="flex items-center gap-1 text-danger-500 text-xs">
+                              <AlertTriangleIcon size={12} className="text-danger" />
                               {t(
                                 'agent.settings.tooling.permissionMode.bypassPermissions.warning',
                                 'Use with caution — all tools will run without asking for approval.'