Fix: Modify the personal center style #10703 (#11347)

### What problem does this PR solve?

Fix: Modify the personal center style

### Type of change

- [x] Bug Fix (non-breaking change which fixes an issue)

web/src/components/dynamic-form.tsx

@@ -496,7 +496,7 @@ const DynamicForm = {
                     <Textarea
                       {...finalFieldProps}
                       placeholder={field.placeholder}
-                      className="resize-none"
+                      // className="resize-none"
                     />
                   );
                 }}
@@ -544,7 +544,7 @@ const DynamicForm = {
                 render={({ field: formField }) => (
                   <FormItem
                     className={cn('flex items-center w-full', {
-                      'flex-row items-start space-x-3 space-y-0':
+                      'flex-row items-center space-x-3 space-y-0':
                         !field.horizontal,
                     })}
                   >

web/src/components/originui/password-input.tsx

@@ -2,7 +2,6 @@
 
 'use client';
 
-import { EyeIcon, EyeOffIcon } from 'lucide-react';
 import React, { useId, useState } from 'react';
 import { Input, InputProps } from '../ui/input';
 
@@ -33,11 +32,11 @@ export default React.forwardRef<HTMLInputElement, InputProps>(
             aria-pressed={isVisible}
             aria-controls="password"
           >
-            {isVisible ? (
+            {/* {isVisible ? (
               <EyeOffIcon size={16} aria-hidden="true" />
             ) : (
               <EyeIcon size={16} aria-hidden="true" />
-            )}
+            )} */}
           </button>
         </div>
       </div>

web/src/components/originui/select-with-search.tsx

@@ -140,7 +140,7 @@ export const SelectWithSearch = forwardRef<
             ref={ref}
             disabled={disabled}
             className={cn(
-              '!bg-bg-input hover:bg-background border-input w-full  justify-between px-3 font-normal outline-offset-0 outline-none focus-visible:outline-[3px] [&_svg]:pointer-events-auto',
+              '!bg-bg-input hover:bg-background border-border-button w-full  justify-between px-3 font-normal outline-offset-0 outline-none focus-visible:outline-[3px] [&_svg]:pointer-events-auto',
               triggerClassName,
             )}
           >
@@ -166,7 +166,7 @@ export const SelectWithSearch = forwardRef<
               )}
               <ChevronDownIcon
                 size={16}
-                className="text-muted-foreground/80 shrink-0 ml-2"
+                className="text-text-disabled shrink-0 ml-2"
                 aria-hidden="true"
               />
             </div>

web/src/components/ui/input.tsx

@@ -41,7 +41,7 @@ const Input = React.forwardRef<HTMLInputElement, InputProps>(
         type={isPasswordInput && showPassword ? 'text' : type}
         className={cn(
           'peer/input',
-          'flex h-8 w-full rounded-md border-0.5 border-input bg-bg-input px-3 py-2 outline-none text-sm text-text-primary',
+          'flex h-8 w-full rounded-md border-0.5 border-border-button bg-bg-input px-3 py-2 outline-none text-sm text-text-primary',
           'file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-text-disabled',
           'focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-accent-primary',
           'disabled:cursor-not-allowed disabled:opacity-50 transition-colors',

web/src/components/ui/textarea.tsx

@@ -54,7 +54,7 @@ const Textarea = forwardRef<HTMLTextAreaElement, TextareaProps>(
     return (
       <textarea
         className={cn(
-          'flex min-h-[80px] w-full bg-bg-input rounded-md border border-input px-3 py-2 text-base ring-offset-background placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 md:text-sm overflow-hidden',
+          'flex min-h-[80px] w-full bg-bg-input rounded-md border border-input px-3 py-2 text-base ring-offset-background placeholder:text-text-disabled focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-accent-primary focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 md:text-sm overflow-hidden',
           className,
         )}
         rows={autoSize?.minRows ?? props.rows ?? undefined}

web/src/components/ui/tooltip.tsx

@@ -4,7 +4,7 @@ import * as TooltipPrimitive from '@radix-ui/react-tooltip';
 import * as React from 'react';
 
 import { cn } from '@/lib/utils';
-import { Info } from 'lucide-react';
+import { CircleQuestionMark } from 'lucide-react';
 
 const TooltipProvider = TooltipPrimitive.Provider;
 
@@ -39,7 +39,7 @@ export const FormTooltip = ({ tooltip }: { tooltip: React.ReactNode }) => {
           e.preventDefault(); // Prevent clicking the tooltip from triggering form save
         }}
       >
-        <Info className="size-3 ml-2" />
+        <CircleQuestionMark className="size-3 ml-2" />
       </TooltipTrigger>
       <TooltipContent>{tooltip}</TooltipContent>
     </Tooltip>