HTML:
<div className='container-order-item'>
<li className='list-single-orderitem'>
<div className='container-ponumber-cargoinfo'>
<span className='poNumber-data'>Call number: {this.props.data.poNumber}</span>
<span className='cargoinfo-data'>{this.props.data.cargoInfo}/span>
</div>
<span className='data-order-list'> {this.props.data.orderStatus}</span>
</li>
</div>
Description:
.container-order-item{
background-color: $background-dark-list-row;
margin: 10px 16px;
padding: 7px;
flex-direction: column;
justify-content: center;
display: flex;
.list-single-orderitem{
display: flex;
justify-content: space-between;
flex-direction: row;
font-size: 14px;
color: #236a72;
.container-ponumber-cargoinfo{
flex-grow: 1;
display: flex;
flex-direction: column;
.poNumber-data{
font-weight: bold;
}
.cargoinfo-data{
}
}
.data-order-list{
padding-right: 6px;
padding-top: 4px;
flex-grow: 0px;
}
}
}
li{
list-style-type: none;
}