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

React components library focused on usability, accessibility and developer experience

{"version":3,"file":"Container.module.cjs","names":[],"sources":["../../../src/components/Container/Container.module.css"],"sourcesContent":[".root {\n  --container-size-xs: 540px;\n  --container-size-sm: 720px;\n  --container-size-md: 960px;\n  --container-size-lg: 1140px;\n  --container-size-xl: 1320px;\n  --container-size: var(--container-size-md);\n\n  &:where([data-strategy='block']) {\n    max-width: var(--container-size);\n    padding-inline: var(--mantine-spacing-md);\n    margin-inline: auto;\n\n    &:where([data-fluid]) {\n      max-width: 100%;\n    }\n  }\n\n  &:where([data-strategy='grid']) {\n    display: grid;\n    grid-template-columns: 1fr min(100%, var(--container-size)) 1fr;\n    margin-inline: auto;\n\n    & > * {\n      grid-column: 2;\n    }\n\n    & > [data-breakout] {\n      grid-column: 1 / -1;\n\n      & > [data-container] {\n        max-width: var(--container-size);\n        margin-inline: auto;\n      }\n    }\n  }\n}\n"],"mappings":""}