[Bug]: New `Tab/Tabs` component doesn't look great for content expecting gaps

[JounQin]

Version

System:
    OS: macOS 26.3
    CPU: (10) arm64 Apple M1 Max
    Memory: 1.66 GB / 64.00 GB
    Shell: 5.9 - /bin/zsh
  Browsers:
    Chrome: 145.0.7632.117
    Firefox: 147.0.4
    Safari: 26.3

Details

Reproduce link

https://codesandbox.io/p/devbox/purple-hill-ynr828?workspaceId=ws_8sXJvcoLgrvadE9T3ezGEg&embed=1

Reproduce Steps

Just open the preview page

[SoonIter]

这个 bug 修复我有个顾虑：如果给 TabPanel 加默认 padding，当 tab 内仅有代码块时，会有两层 padding（CodeBlock 本身有 padding）。

可能的解决思路：

1. 用 :has 伪类检测，如果 TabPanel 里只有代码块，就不加 padding
2. 代码块特殊处理，只给非代码块内容加 padding
3. 或者保持现状，在文档里说明可以用 panelClassName 自己控制

[SoonIter]

I have a concern about this fix: if we add default padding to TabPanel, when a tab only contains code blocks, there would be double padding (since CodeBlock already has its own padding).

Possible approaches:

1. Use the :has pseudo-class to detect if TabPanel only contains code blocks, then skip adding padding
2. Special handling for code blocks - only add padding to non-code block content
3. Keep the current behavior and document that users can use panelClassName to control padding themselves

[SoonIter]

Another tab style issue: #3200 (I think it was generated by AI, but this issue does exist.)

[JounQin]

Our temporary current workaround:

1. unconditional x padding, y margin
2. different background for code blocks in tab

https://github.com/alauda/doom/blob/2f7b15e3a52ddbd08cb795c4ba456a7f02067f71/packages/doom/styles/global.scss#L117-L129

https://github.com/alauda/doom/blob/2f7b15e3a52ddbd08cb795c4ba456a7f02067f71/packages/doom/styles/global.scss#L177-L188