@use '../utils/mixins'; @use '../utils/size_variables'; /** * Copyright (c) HashiCorp, Inc. * SPDX-License-Identifier: BUSL-1.1 */ .selectable-card-container { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); grid-template-rows: 1fr; grid-gap: 2rem; &.one-card { max-width: 33%; min-width: 350px; margin-left: auto; margin-right: auto; } } .selectable-card-container.has-grid { display: grid; grid-template-columns: 2fr 1fr; grid-template-rows: repeat(2, 1fr); grid-gap: 2rem; @include mixins.until(size_variables.$mobile) { grid-template-columns: 2fr; } } .selectable-card-container.has-grid.has-three-col-grid { grid-template-columns: 1fr 1fr 1fr; grid-template-rows: none; }