@lonelyplanet/dotcom-core
Version:
This package is meant to house some of our more common UI and shared libs across dotcom applications.
57 lines (49 loc) • 1.08 kB
CSS
.container {
margin-left: 16px;
margin-right: 16px;
max-width: 1290px;
overflow: hidden;
position: relative;
}
@media (min-width: 768px) {
.container {
margin-left: 28px;
margin-right: 28px;
}
}
@media (min-width: 1024px) {
.container {
margin-left: 32px;
margin-right: 32px;
}
}
@media (min-width: 1354px) {
.container {
margin-left: auto;
margin-right: auto;
}
}
@supports (display: grid) {
.container {
display: grid;
grid-column-gap: var(--grid-column-gap);
grid-row-gap: var(--grid-row-gap);
/* stylelint-disable indentation */
grid-template-columns:
[full-start]
var(--grid-column-gutter)
[container-start]
repeat(var(--grid-columns), [column-start] var(--grid-column-width))
[container-end]
var(--grid-column-gutter)
[full-end];
/* stylelint-enable */
justify-content: center;
/* Reset grid fallback styles */
margin-left: 0;
margin-right: 0;
max-width: 100%;
overflow: initial;
position: initial;
}
}