.main-container {
margin: $spacing-3; @include on-desktop { margin: $spacing-4 $content-gutters-width; }
}
.page-header {
margin: $spacing-3 0pt; align-items: center; @include with-theme { color: color-for(primary); }
}
.page-actions {
flex: 0 1 auto;
}
.page-title {
margin: 0pt; font-size: $mega-font-size; @include with-theme { color: color-for(primary); }
}
.page-subtitle {
margin: 0pt; font-size: $medium-font-size; font-weight: normal; @include with-theme { color: color-for(secondary); }
}
.index-grid {
display: grid; grid-template-rows: auto; grid-template-columns: 1fr; gap: $spacing-3; @include on-tablet { grid-template-rows: auto; grid-template-columns: repeat(2, 1fr); } @include on-desktop { grid-template-rows: auto; grid-template-columns: repeat(3, 1fr); }
}
.snip {
display: grid; grid-template-rows: auto 1fr auto; grid-template-columns: auto;
}
.snip-container {
margin: $spacing-1;
}
.snip-header {
display: flex; flex-direction: column;
}
.snip-title, .snip-subtitle {
margin: 0pt;
} .snip-subtitle {
font-weight: normal;
}