I have a React project with reactstrap. I want to modify the padding of list-group-item
of certain Card
s and not others. Is it possible to do this with Sass?
Here is my attempt
app:
<>
<Card className={'mt-2'}>
<CardBody>
<ListGroup flush>
<ListGroupItem className={'list-group-item-custom'}>
//I want the padding modified here
</ListGroupItem>
</ListGroup>
</CardBody>
</Card>
</>
<>
<Card className={'mt-2'}>
<CardBody>
<ListGroup flush>
<ListGroupItem>
//Leave default padding
</ListGroupItem>
</ListGroup>
</CardBody>
</Card>
</>
scss:
// Bootstrap Functions
@import "../../../node_modules/bootstrap/scss/functions";
// Bootstrap Core
@import "../../../node_modules/bootstrap/scss/bootstrap";
.list-group-item-custom {
padding: 0;
}