Fix square sizing for desktop

This commit is contained in:
mDuo13
2020-09-14 14:22:33 -07:00
parent 8e6173b2e4
commit 80aaafca20
4 changed files with 31 additions and 29 deletions

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@@ -114,29 +114,6 @@ td:nth-child(1) {
.card {
background-color: transparent;
}
.square {
position: relative;
flex-basis: calc(50% - 30px); // Mobile
margin: 15px;
box-sizing: border-box;
justify-content: center;
align-items: center;
border-radius: 8px;
&::before {
content: '';
display: block;
padding-top: 100%;
}
&-50 {
flex-basis: calc(50% - 30px);
@include media-breakpoint-up(lg) {
flex-basis: calc(50% - 30px);
}
}
}
.card-wrapper {
width: 100%;

View File

@@ -20,6 +20,35 @@ section {
}
}
// Square blocks ---------------------------------------------------------------
.square {
position: relative;
flex-basis: calc(50% - 30px); // Mobile
margin: 15px;
box-sizing: border-box;
justify-content: center;
align-items: center;
border-radius: 8px;
&::before {
content: '';
display: block;
padding-top: 100%;
}
@include media-breakpoint-up(lg) {
flex-basis: calc(25% - 30px);
}
&-50 {
flex-basis: calc(50% - 30px);
@include media-breakpoint-up(lg) {
flex-basis: calc(50% - 30px);
}
}
}
// Card Grid styles ------------------------------------------------------------
@@ -156,10 +185,6 @@ section {
min-height: 700px;
}
// .row {
// margin: 0 -1px;
// }
.doc-index {
padding: 48px 0;