如何改变mantine.ui菜单中的悬停颜色？

Question

我试图在悬停时改变菜单颜色。但是，不管用。如何改变mantine.ui菜单中的悬停颜色？

Answer 1

如果您熟悉主题的概念，您可以很容易地得到它。

<MantineProvider theme={{
      components: {
        Button: {
          // Subscribe to theme and component params
          styles: (theme, params) => ({
            root: {
              backgroundColor:
                params.variant === 'filled'
                  ? theme.colors[params.color || theme.primaryColor][9]
                  : undefined,
              '&:hover': { backgroundColor: params.variant === 'filled'
                  ?'#ddd':'transparent'
                }
            },
          }),
        },
      },
    }}>
    <Button> I have #ddd color on hover. </Button>
</ManitineProvider>

我不明白你在说哪个菜单，但我给出了一个按钮组件的例子。您可以重写主题中所有按钮的样式。