fix(editor): code block ui issues (#12609)

Close BS-3423
Close BS-3505

<!-- This is an auto-generated comment: release notes by coderabbit.ai -->
## Summary by CodeRabbit

- **Style**
  - Updated toolbar button background color and adjusted layout spacing for toolbar and preview buttons to improve visual consistency.
- **Refactor**
  - Reorganized toolbar menu groups for better clarity, separating toggle and clipboard actions within the code block toolbar.
- **Bug Fixes**
  - Improved UI interaction in code block tests to ensure menus behave as expected without closing prematurely.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

packages/frontend/core/src/blocksuite/ai/entries/code-toolbar/setup-code-toolbar.ts

@@ -15,34 +15,37 @@ import { buildAICodeItemGroups } from '../../_common/config';
 import type { AskAIButtonOptions } from '../../components/ask-ai-button';
 
 export function setupCodeToolbarAIEntry(codeToolbar: AffineCodeToolbarWidget) {
-  codeToolbar.addPrimaryItems([
-    {
-      type: 'ask-ai',
-      when: ({ doc }) => !doc.readonly,
-      generate: ({ host, blockComponent }) => {
-        return {
-          action: () => {
-            const { selection } = host;
-            selection.setGroup('note', [
-              selection.create(BlockSelection, {
-                blockId: blockComponent.blockId,
-              }),
-            ]);
-          },
-          render: item =>
-            html`<ask-ai-button
-              class="code-toolbar-button ask-ai"
-              .host=${host}
-              .actionGroups=${AICodeItemGroups}
-              .toggleType=${'click'}
-              .options=${buttonOptions}
-              @click=${(e: MouseEvent) => {
-                e.stopPropagation();
-                item.action();
-              }}
-            ></ask-ai-button>`,
-        };
+  codeToolbar.addPrimaryItems(
+    [
+      {
+        type: 'ask-ai',
+        when: ({ doc }) => !doc.readonly,
+        generate: ({ host, blockComponent }) => {
+          return {
+            action: () => {
+              const { selection } = host;
+              selection.setGroup('note', [
+                selection.create(BlockSelection, {
+                  blockId: blockComponent.blockId,
+                }),
+              ]);
+            },
+            render: item =>
+              html`<ask-ai-button
+                class="code-toolbar-button ask-ai"
+                .host=${host}
+                .actionGroups=${AICodeItemGroups}
+                .toggleType=${'click'}
+                .options=${buttonOptions}
+                @click=${(e: MouseEvent) => {
+                  e.stopPropagation();
+                  item.action();
+                }}
+              ></ask-ai-button>`,
+          };
+        },
       },
-    },
-  ]);
+    ],
+    2
+  );
 }