Best way to update nested Ionic 2 UI component CSS


#1

My project requires a list component within a card component.
The border doesn’t appear on the list items when inside the card component.

I update the styles in variable.scss to show border on bottom for all but last:

ion-card ion-list[border-bottom] ion-item{
border-bottom:1px solid #999999;
}
ion-card ion-list[border-bottom] ion-item:last-child{
border-bottom:0;
}

This works but I’m not sure that’s the best approach.

Markup


Header




My Header




Name


Text




Amount


Remaining







What are best practices for this?