1  import { menuAnatomy } from '@chakra-ui/anatomy';
 2  import { createMultiStyleConfigHelpers } from '@chakra-ui/react';
 3  import { glassDivStyles, glassDivHoverStyles } from 'styles/shared';
 4  
 5  const { defineMultiStyleConfig, definePartsStyle } =
 6    createMultiStyleConfigHelpers(menuAnatomy.keys);
 7  
 8  const variants = {
 9    glass: definePartsStyle({
10      button: {
11        ...glassDivStyles,
12        _hover: {
13          ...glassDivHoverStyles,
14        },
15      },
16      list: {
17        ...glassDivStyles,
18        border: 'none',
19        borderRadius: 'xl',
20        py: 2,
21        px: 2,
22      },
23      item: {
24        bg: 'transparent',
25        color: 'glass.white70',
26        borderRadius: 'xl',
27        py: 2,
28        _hover: {
29          ...glassDivHoverStyles,
30        },
31      },
32    }),
33  };
34  
35  export const Menu = defineMultiStyleConfig({ variants });