budget reports layout adjustments for IE only

This commit is contained in:
Andrew Croce 2018-09-27 13:25:34 -04:00
parent fab5b3341d
commit 653d8c8e8b

View File

@ -14,6 +14,10 @@
flex-direction: row; flex-direction: row;
flex-basis: 50%; flex-basis: 50%;
@include ie-only {
max-width: 50%;
}
&:first-child { &:first-child {
padding-left: 0; padding-left: 0;
} }
@ -26,7 +30,10 @@
.panel { .panel {
padding: $gap * 2; padding: $gap * 2;
flex-grow: 1;
@include ie-only {
max-width: 100%;
}
// Spending Summary // Spending Summary
@ -38,20 +45,34 @@
.row { .row {
justify-content: space-between; justify-content: space-between;
@include ie-only {
max-width: 100%;
flex-wrap: wrap;
}
} }
.spend-summary__heading { .spend-summary__heading {
@include h3; @include h3;
margin: 0 $gap 0 0; margin: 0 $gap 0 0;
-ms-flex-negative: 1;
} }
.spend-summary__budget { .spend-summary__budget {
margin: 0 0 0 $gap; margin: 0 0 0 $gap;
@include ie-only {
margin: $gap 0 0 0;
}
> div { > div {
text-align: right; text-align: right;
margin: 0 0 ($gap / 2) 0; margin: 0 0 ($gap / 2) 0;
@include ie-only {
text-align: left;
}
dd, dt { dd, dt {
display: inline; display: inline;
} }