.finance-summary {
.summary-item {
border: 1px solid #acacac;
border-top: none;
border-bottom: 1px dashed #acacac;
padding: 12px;
&:first-child {
border-top: 1px solid #acacac;
}
&:last-child {
border-bottom: 1px solid #acacac;
}
.title {
display: inline-block;
width: ~"calc(50% - 2px)";
vertical-align: top;
}
.amount, .tags-list, .type {
display: inline-block;
width: ~"calc(50% - 2px)";
text-align: right;
}
}
}
@media screen and (max-width: 550px) {
.finance-summary {
.summary-item {
.title {
font-size: 0.9em;
width: ~"calc(40% - 2px)";
}
.amount, .tags-list, .type {
font-size: 0.8em;
width: ~"calc(60% - 2px)";
}
.heading {
.title {
width: ~"calc(50% - 2px)";
}
.amount {
width: ~"calc(50% - 2px)";
}
}
}
}
}