chore: polish UIs

src/common/component/Avatar.tsx

@@ -44,7 +44,6 @@ const Avatar: FC<Props> = ({
     <div
       className={`rounded-full flex-center ${rest.className || ""}`}
       style={{
-
         width,
         height,
         fontSize: getFontSize(width),

src/common/component/styled/Input.tsx

@@ -58,7 +58,7 @@ const Input: FC<Props> = ({ type = "text", prefix = "", className = "", ...rest
     </div>
   ) : prefix ? (
     <div className={`w-full relative flex overflow-hidden rounded border border-solid border-gray-300 dark:border-gray-400 shadow-sm ${className}`}>
-      <span className="px-4 py-2 text-sm text-gray-500 dark:text-gray-300 bg-gray-100 dark:bg-gray-800 shadow-[rgb(0_0_0_/_10%)_-1px_0px_0px_inset]">{prefix}</span>
+      {typeof prefix === "string" ? <span className="px-4 py-2 text-sm text-gray-500 dark:text-gray-300 bg-gray-100 dark:bg-gray-800 shadow-[rgb(0_0_0_/_10%)_-1px_0px_0px_inset]">{prefix}</span> : <span className="flex-center p-2 bg-gray-100 dark:bg-gray-800 ">{prefix}</span>}
       <input className={`${inputClass} ${className}`} type={inputType} {...rest} />
     </div>
   ) : (

src/routes/chat/SessionList/Session.tsx

@@ -118,14 +118,14 @@ const Session: FC<IProps> = ({
           to={navPath}
           onContextMenu={handleContextMenuEvent}
         >
-          <div className="flex shrink-0 relative">
+          <div className="flex shrink-0 relative w-10 h-10">
             {type == "dm" ? (
               <User avatarSize={40} compact interactive={false} uid={id} />
             ) : (
               <Avatar
                 width={40}
                 height={40}
-                className="icon rounded-full"
+                className="icon rounded-full object-cover"
                 type="channel"
                 name={name}
                 src={icon}