Renewal Column

A typical container layout and styles for any object that has a forthcoming bill with various meta, typically around renewal datas and types.

HTML

<div class="t-content" style="width: 800px; height: 300px;">
    <div class="c-renewalColumn u-flexItemNoShrink u-size3of12">
        <div class="c-renewalColumn-label" >Renewal Amount</div>
        <div class="c-renewalColumn-amount" auto-fit-text=""  style="font-size: 50px;">$15.00</div>
        <div>
            <span  class="ng-binding">Renews</span>
            <span  class="ng-binding">Live Linear Monthly Subscription Charge</span>
        </div>
        <div class="c-renewalColumn-date ng-scope"  style="">
            <span ng-bind="$ctrl.getSubscriptionRenewalText()" class="ng-binding">Automatically On</span>
            <span  class="ng-binding">2/28/17</span>
        </div>
    </div>
</div>