[BUG] tailwindcss doesn't work in content script UI

[zshnb]

What happened?

I use antd and tailwindcss, this is my content script UI

export const config: PlasmoCSConfig = {
  matches: ["https://www.youtube.com/*"]
}

export const getInlineAnchor: PlasmoGetInlineAnchor = async () =>
  document.querySelector("#player")

const HOST_ID = "engage-csui"

export const getShadowHostId: PlasmoGetShadowHostId = () => HOST_ID
export const getStyle = () => {
  const style = document.createElement("style")
  style.textContent = antdResetCssText
  return style
}

export const mountShadowHost: PlasmoMountShadowHost = ({
  shadowHost,
  anchor,
  mountState
}) => {
  anchor.element.appendChild(shadowHost)
  mountState.observer.disconnect() // OPTIONAL DEMO: stop the observer as needed
}

export default function Toolbar() {
  return (
    <StyleProvider container={document.getElementById(HOST_ID).shadowRoot}>
      {
        showDownloadButton && (
          <Flex gap={'middle'} className={'ml-4'}>
            <Button type={'text'} shape={'circle'} icon={<Video/>} onClick={() => handleDownloadVideo()} loading={videoLoading}/>
            <Button type={'text'} shape={'circle'} icon={<Images size={18}/>} onClick={handleDownloadThumbnail} loading={thumbnailLoading}/>
            <Button type={'text'} shape={'circle'} icon={<Captions/>} onClick={() => handleDownloadSubtitle('text')} loading={subtitleLoading}/>
          </Flex>
        )
      }
    </StyleProvider>
  )
}

I add ml-4 in Flex component, but I didn't see the effect.

Version

Latest

What OS are you seeing the problem on?

No response

What browsers are you seeing the problem on?

No response

Relevant log output

No response

(OPTIONAL) Contribution

• I would like to fix this BUG via a PR

Code of Conduct

• I agree to follow this project's Code of Conduct
• I checked the current issues for duplicate problems.

[karthest]

What is your antdResetCssText ?
Does it contains

@tailwind base;
@tailwind components;
@tailwind utilities;

?

[zshnb]

What is your antdResetCssText ? Does it contains

@tailwind base;
@tailwind components;
@tailwind utilities;

?

yes, but I removed @tailwind base

[karthest]

Did you set prefix in tailwind.css.js ?

What is your antdResetCssText ? Does it contains

@tailwind base;
@tailwind components;
@tailwind utilities;

?

yes, but I removed @tailwind base

Did you set prefix in tailwind.config.js ?

[zshnb]

Did you set prefix in tailwind.css.js ?

What is your antdResetCssText ? Does it contains

@tailwind base;
@tailwind components;
@tailwind utilities;

?

yes, but I removed @tailwind base

Did you set prefix in tailwind.config.js ?

no