@mantine/core/cjs/components/Accordion/AccordionControl/AccordionControl.styles.js

React components library focused on usability, accessibility and developer experience

'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

var createMemoStyles = require('../../../theme/create-memo-styles.js');

var useStyles = createMemoStyles.createMemoStyles({
  label: {
    color: "inherit",
    fontWeight: 500
  },
  item: ({ theme }) => ({
    borderTop: `1px solid ${theme.colorScheme === "dark" ? theme.colors.dark[4] : theme.colors.gray[2]}`,
    "&:last-of-type": {
      borderBottom: `1px solid ${theme.colorScheme === "dark" ? theme.colors.dark[4] : theme.colors.gray[2]}`
    }
  }),
  icon: ({ transitionDuration }) => ({
    transition: `transform ${transitionDuration}ms ease`
  }),
  itemOpened: {
    "& $icon": {
      transform: "rotate(180deg)"
    }
  },
  control: ({ theme }) => ({
    width: "100%",
    display: "flex",
    alignItems: "center",
    justifyContent: "space-between",
    padding: theme.spacing.md,
    textAlign: "left",
    color: "inherit"
  }),
  content: ({ transitionDuration }) => ({
    transition: `height ${transitionDuration}ms ease`,
    overflow: "hidden"
  }),
  contentInner: ({ theme, transitionDuration }) => ({
    paddingTop: 0,
    padding: theme.spacing.md,
    transition: `opacity ${transitionDuration}ms ease`
  })
});

exports.default = useStyles;
//# sourceMappingURL=AccordionControl.styles.js.map