chore: adjust tag editor style (#11757)

close AF-2006
![CleanShot 2025-04-17 at 12 43 26@2x](https://github.com/user-attachments/assets/e7498ace-7294-410d-a2d3-83b92dbde036)
![CleanShot 2025-04-17 at 12 43 17@2x](https://github.com/user-attachments/assets/8617cea0-3200-4020-ad5b-b76a70680844)

packages/frontend/core/src/components/tags/inline-tag-list.css.ts

@@ -5,4 +5,5 @@ export const inlineTagsContainer = style({
   gap: '6px',
   flexWrap: 'wrap',
   width: '100%',
+  alignItems: 'center',
 });

packages/frontend/core/src/components/tags/styles.css.ts

@@ -17,7 +17,7 @@ export const tagsEditorRoot = style({
   display: 'flex',
   flexDirection: 'column',
   width: '100%',
-  gap: '12px',
+  gap: '4px',
 });
 
 export const tagsEditorRootMobile = style([
@@ -27,13 +27,6 @@ export const tagsEditorRootMobile = style([
   },
 ]);
 
-export const inlineTagsContainer = style({
-  display: 'flex',
-  gap: '6px',
-  flexWrap: 'wrap',
-  width: '100%',
-});
-
 export const tagsMenu = style({
   padding: 0,
   position: 'relative',
@@ -45,23 +38,25 @@ export const tagsMenu = style({
 
 export const tagsEditorSelectedTags = style({
   display: 'flex',
-  gap: '4px',
   flexWrap: 'wrap',
-  padding: '10px 12px',
+  padding: '10px 12px 0px',
-  backgroundColor: cssVarV2('input/background'),
   minHeight: 42,
   selectors: {
     [`${tagsEditorRootMobile} &`]: {
       borderRadius: 12,
+      paddingBottom: '10px',
       backgroundColor: cssVarV2('layer/background/primary'),
     },
   },
 });
 
+export const tagDivider = style({
+  borderBottomColor: cssVarV2('tab/divider/divider'),
+});
+
 export const searchInput = style({
   flexGrow: 1,
-  padding: '10px 0',
+  height: '30px',
-  margin: '-10px 0',
   border: 'none',
   outline: 'none',
   fontSize: '14px',

packages/frontend/core/src/components/tags/tags-editor.tsx

@@ -1,4 +1,10 @@
-import { IconButton, Menu, RowInput, Scrollable } from '@affine/component';
+import {
+  Divider,
+  IconButton,
+  Menu,
+  RowInput,
+  Scrollable,
+} from '@affine/component';
 import { useI18n } from '@affine/i18n';
 import { MoreHorizontalIcon } from '@blocksuite/icons/rc';
 import clsx from 'clsx';
@@ -249,6 +255,9 @@ export const TagsEditor = ({
             placeholder="Type here ..."
           />
         </InlineTagList>
+        {BUILD_CONFIG.isMobileEdition ? null : (
+          <Divider size="thinner" className={styles.tagDivider} />
+        )}
       </div>
       <div className={styles.tagsEditorTagsSelector}>
         <div className={styles.tagsEditorTagsSelectorHeader}>