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

React components library focused on usability, accessibility and developer experience

{"version":3,"file":"Card.module.cjs","names":[],"sources":["../../../src/components/Card/Card.module.css"],"sourcesContent":[".root {\n  --card-padding: var(--mantine-spacing-md);\n\n  position: relative;\n  overflow: hidden;\n  display: flex;\n  padding: var(--card-padding);\n  color: var(--mantine-color-text);\n\n  &:where([data-orientation='horizontal']) {\n    flex-direction: row;\n  }\n\n  &:where([data-orientation='vertical']) {\n    flex-direction: column;\n  }\n\n  @mixin where-light {\n    background-color: var(--mantine-color-white);\n  }\n\n  @mixin where-dark {\n    background-color: var(--mantine-color-dark-6);\n  }\n}\n\n.section {\n  display: block;\n  margin-inline: calc(var(--card-padding) * -1);\n\n  @mixin where-light {\n    --border-color: var(--mantine-color-gray-3);\n  }\n\n  @mixin where-dark {\n    --border-color: var(--mantine-color-dark-4);\n  }\n\n  &:where([data-orientation='vertical']) {\n    &:first-child {\n      margin-top: calc(var(--card-padding) * -1);\n      border-top: none !important;\n    }\n\n    &:last-child {\n      margin-bottom: calc(var(--card-padding) * -1);\n      border-bottom: none !important;\n    }\n\n    &[data-inherit-padding] {\n      padding-inline: var(--card-padding);\n    }\n\n    &[data-with-border] {\n      border-top: 1px solid var(--border-color);\n      border-bottom: 1px solid var(--border-color);\n    }\n\n    & + & {\n      border-top: none !important;\n    }\n  }\n\n  &:where([data-orientation='horizontal']) {\n    margin-block: calc(var(--card-padding) * -1);\n    margin-inline: 0;\n\n    &:first-child {\n      margin-inline-start: calc(var(--card-padding) * -1);\n      border-inline-start: none !important;\n    }\n\n    &:last-child {\n      margin-inline-end: calc(var(--card-padding) * -1);\n      border-inline-end: none !important;\n    }\n\n    &[data-inherit-padding] {\n      padding-block: var(--card-padding);\n    }\n\n    &[data-with-border] {\n      border-inline-start: 1px solid var(--border-color);\n      border-inline-end: 1px solid var(--border-color);\n    }\n\n    & + & {\n      border-inline-start: none !important;\n    }\n  }\n}\n"],"mappings":""}