fix: 调整dropdown,tag的间距

frontend/src/components/ui/dropdown-menu.tsx

@@ -44,7 +44,7 @@ function DropdownMenuContent({
         data-slot="dropdown-menu-content"
         sideOffset={sideOffset}
         className={cn(
-          "bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 max-h-(--radix-dropdown-menu-content-available-height) min-w-[8rem] origin-(--radix-dropdown-menu-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-[20px] border p-[20px] shadow-md",
+          "bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 max-h-(--radix-dropdown-menu-content-available-height) min-w-[8rem] origin-(--radix-dropdown-menu-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-[20px] border p-[20px] shadow-[0_0_20px_0_rgba(0,0,0,0.20)]",
           className,
         )}
         {...props}

frontend/src/components/ui/tag.tsx

@@ -7,7 +7,7 @@ function Tag({ className, ...props }: React.ComponentProps<"span">) {
     <span
       data-slot="tag"
       className={cn(
-        "inline-flex items-center gap-1 rounded-full border border-transparent bg-[#EAE2F5] px-[15px] py-[4px] text-xs font-medium text-[#8E47F0]",
+        "inline-flex items-center gap-1 rounded-full border border-transparent bg-[#EAE2F5] px-[15px] py-[5px] text-xs font-medium text-[#8E47F0]",
         className,
       )}
       {...props}

frontend/src/components/workspace/input-box.tsx

@@ -679,7 +679,7 @@ export function InputBox({
               <button
                 ref={mentionTriggerRef}
                 type="button"
-                className="pointer-events-none absolute right-2 bottom-2 h-0 w-0 opacity-0"
+                className="pointer-events-none absolute right-2 bottom-0 h-0 w-0 opacity-0"
                 aria-hidden="true"
                 tabIndex={-1}
               />
@@ -688,7 +688,7 @@ export function InputBox({
               align="start"
               side="top"
               sideOffset={8}
-              className="w-[min(32rem,var(--radix-dropdown-menu-trigger-width)+28rem)] max-h-[578px] overflow-y-visible p-[20px]"
+              className="w-[min(32rem,var(--radix-dropdown-menu-trigger-width)+28rem)] max-h-[400px] overflow-y-visible p-[20px]"
               data-testid="mention-candidate-panel"
               onCloseAutoFocus={(event) => {
                 event.preventDefault();
@@ -1077,15 +1077,15 @@ function SuggestionList({
               </DropdownMenuTrigger>
               <DropdownMenuContent
                 align="start"
-                className="min-w-[240px] rounded-[20px] p-5"
+                className="min-w-[240px] rounded-[20px] p-[20px]"
                 onMouseEnter={() => setOpenDropdownKey(dropdownKey)}
                 onMouseLeave={() => setOpenDropdownKey(null)}
               >
-                <DropdownMenuLabel className="px-2 text-xs text-[#8A8694]">
+                <DropdownMenuLabel className="p-0 text-[14px] text-[#333333]">
                   {suggestion.suggestion}
-                </DropdownMenuLabel>
+                </DropdownMenuLabel >
-                <DropdownMenuSeparator />
+                <DropdownMenuSeparator className="mx-0 mt-[20px] mb-0" />
-                <DropdownMenuGroup>
+                <DropdownMenuGroup className=" pt-[20px] px-0">
                   {childSkills.map((item) => (
                     <Tooltip
                       key={`${dropdownKey}-${item.id}`}
@@ -1246,11 +1246,11 @@ function IframeSkillDialogButton({
               key={`${skill.skill_id}-${skill.title}-${index}`}
               className="shrink-0"
             >
-              {skill.title}
+              <span className="text-[12px]/[12px]">{skill.title}</span>
               {/* TODO: 因为后端接口不支持取消选择skill，所以暂时禁用取消选择按钮 */}
               <button
                 onClick={() => clearSkill(skill.skill_id)}
-                className="hover:bg-muted-foreground/20 ml-1 rounded-full"
+                className="hover:bg-muted-foreground/20 ml-1 inline-flex size-4 items-center justify-center rounded-full align-middle"
                 type="button"
               >
                 <XIcon className="size-3" />