Search code examples
csssasspopupantdcss-modules

Can I apply different styles to antd pop overs when they are in different components?

I want to apply different styles to antd pop overs when they are in different components, especially the positions where they appear. For example if I have a button and b button, I want to make a pop over appear 50px right of a button and the other appear 100px left of b button. I have no clue to do this because it seems I can not add a className in antd pop over component such as antd-popover-title, antd-popover-content, and so on. Please let me know if you have any ideas..

Solution

  • The Popover class has the same API as Tooltip. https://ant.design/components/tooltip/#API In there you may find multiple ways to style the popover how you want. With either overlayClassName, overlayStyle, overlayInnerStyle. https://codesandbox.io/s/exciting-fermat-izfv8?file=/index.js