/** * Copyright (c) HashiCorp, Inc. * SPDX-License-Identifier: MPL-2.0 */ .replication-dashboard { box-shadow: none; .selectable-card { line-height: normal; &:hover { box-shadow: 0 0 0 1px rgba($grey-dark, 0.3); } .toolbar-link { color: $blue-500; } } .helper-text { font-weight: $font-weight-normal; } .title.is-6 { margin-bottom: $spacing-xs; } .reindexing-alert, .syncing-alert { margin-top: $spacing-xl; } .selectable-card-container { margin-top: $spacing-xl; display: grid; &.primary, .summary { margin: 2rem 0 2rem 0; grid-template-columns: 1fr 2fr; @include until($mobile) { grid-template-columns: 1fr; } } &.secondary { grid-template-columns: repeat(auto-fit, minmax(400px, 1fr)); grid-gap: $spacing-xl; } .card-container { display: grid; grid-gap: $spacing-s; grid-template-columns: 1fr 1fr; grid-template-rows: 0.2fr 0.2fr 0.2fr; padding: $spacing-l; line-height: 1.5; &.summary { grid-template-rows: 0.2fr 1fr 0.2fr 1fr; } &.has-error-border:hover { box-shadow: none; } @include until(1320px) { // prevent an issue with the card descriptions wrapping and expanding height min-height: 250px; } .grid-item-top-left { grid-column: 1 / span 1; display: flex; } .grid-item-top-right { grid-column: 2 / span 1; justify-self: right; } .grid-item-left { grid-column: 1/1; grid-row: 2/2; } .grid-item-right { grid-column: 2/2; grid-row: 2/2; } .grid-item-bottom-left { grid-column: 1/1; grid-row: 3/3; display: flex; align-items: center; } .grid-item-bottom-right { grid-column: 2/2; grid-row: 3/3; } .grid-item-second-row { grid-column: 1 / span 2; grid-row: 2/2; } .grid-item-third-row { grid-column: 1 / span 2; grid-row: 3/4; .empty-state { padding: 0px 12px; box-shadow: none; } } .grid-item-bottom-row { grid-column: 1 / span 2; grid-row: 4/4; } } &.summary { margin-bottom: $spacing-xl; } } .summary-state { padding-bottom: $spacing-xl; border-bottom: 1px solid rgba($grey-dark, 0.3); } // prevent double lines at the bottom of the dashboard &.box { padding-bottom: 0; padding-top: 1px; // at least 1px so border still shows } }