How can I make a progress bar animation stretch across an ion-item?


Here’s my item markup. The problem I have is that my progress bar only stretches across the center content. The item-left and item-right put caps on; I’d like it to stretch across the entire ion-item. Anyway of doing this?

            <ion-avatar item-left>
                <img [src]=" ? : ''" />
                <i *ngIf="message.isUrgent" class="fa fa-exclamation" aria-hidden="true"></i>{{ ? + ' ' + : message.source}}
            <p>{{message.note || '&nbsp;'}}</p>
            <small>{{message.length | amDuration:'seconds'}}</small>
            <ion-note item-right>
                <small>{{message.timestamp | amTimeAgo}}</small>
            <progress [value]="position" max="1"></progress>

Similar to this question How to achieve progress-bar animation on ion-item or header(footer)-bar