fix: wrong classname icon (#3474)

* fix: fix wrong classname icon

* fix: button flashing on chat input

web/containers/ModelDropdown/index.tsx

@@ -299,7 +299,10 @@ const ModelDropdown = ({
           <Badge
             theme="secondary"
             variant={open ? 'solid' : 'outline'}
-            className="cursor-pointer"
+            className={twMerge(
+              'cursor-pointer',
+              open && 'border border-transparent'
+            )}
             onClick={() => setOpen(!open)}
           >
             <span className="line-clamp-1 ">{selectedModel?.name}</span>

web/screens/Thread/ThreadCenterPanel/ChatInput/index.tsx

@@ -388,7 +388,11 @@ const ChatInput = () => {
               <ModelDropdown chatInputMode />
               <Badge
                 theme="secondary"
-                className="flex cursor-pointer items-center gap-x-1"
+                className={twMerge(
+                  'flex cursor-pointer items-center gap-x-1',
+                  activeTabThreadRightPanel === 'model' &&
+                    'border border-transparent'
+                )}
                 variant={
                   activeTabThreadRightPanel === 'model' ? 'solid' : 'outline'
                 }

web/screens/Thread/ThreadLeftPanel/index.tsx

@@ -164,9 +164,9 @@ const ThreadLeftPanel = () => {
                   >
                     <PencilIcon
                       size={16}
-                      className="text-[hsla(var(--secondary))]"
+                      className="text-[hsla(var(--text-secondary))]"
                     />
-                    <span className="text-bold text-[hsla(var(--secondary))]">
+                    <span className="text-bold text-[hsla(var(--app-text-primary))]">
                       Edit title
                     </span>
                   </div>