@mantine/core/cjs/components/CloseButton/CloseButton.module.cjs.map

React components library focused on usability, accessibility and developer experience

{"version":3,"file":"CloseButton.module.cjs","names":[],"sources":["../../../src/components/CloseButton/CloseButton.module.css"],"sourcesContent":[".root {\n  --cb-size-xs: 18px;\n  --cb-size-sm: 22px;\n  --cb-size-md: 28px;\n  --cb-size-lg: 34px;\n  --cb-size-xl: 44px;\n\n  --cb-size: var(--cb-size-md);\n  --cb-icon-size: 70%;\n  --cb-radius: var(--mantine-radius-default);\n\n  line-height: 1;\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  position: relative;\n  user-select: none;\n\n  width: var(--cb-size);\n  height: var(--cb-size);\n  min-width: var(--cb-size);\n  min-height: var(--cb-size);\n  border-radius: var(--cb-radius);\n\n  @mixin where-light {\n    color: var(--mantine-color-gray-7);\n  }\n\n  @mixin where-dark {\n    color: var(--mantine-color-dark-1);\n  }\n\n  &[data-disabled],\n  &:disabled {\n    cursor: not-allowed;\n    opacity: 0.6;\n  }\n}\n\n.root--subtle:where(:not([data-disabled], :disabled)) {\n  @mixin hover {\n    @mixin where-light {\n      background-color: var(--mantine-color-gray-0);\n    }\n\n    @mixin where-dark {\n      background-color: var(--mantine-color-dark-6);\n    }\n  }\n}\n"],"mappings":""}