How to add a total amount in the header section

When the item has been added to the cart. It helps the users to see the item’s total amount when the user login in it will be displayed in  the header section and before login, the total amount will not able see

In entry file

_.extend(HeaderMiniCartView.prototype, {
				getContext: _.wrap(HeaderMiniCartView.prototype.getContext, function (fn) {
					var original = fn.apply(this, _.toArray(arguments).slice(1));
					var summary = this.model.get('summary');
					if (summary) {
						original.cartTotal = summary.total;
					}else{
						original.cartTotal = '0';
					}
					return original;
				})
			});

In the corresponding template added the cart total

<span class="header-mini-cart-menu-cart-legend">
		{{#if isLoading}}
		<span class="header-mini-cart-summary-cart-ellipsis"></span>
		{{else}}
				<!-- {{translate '$(0)' itemsInCart}} -->
				{{translate '$'}} {{cartTotal}}
		{{/if}}
	</span>

In the scss file according to the required add the changes example given below

.header-mini-cart-menu-cart-link>
span.header-mini-cart-menu-cart-legend {
	background-color: #d1cbcb;
	border-radius: 35px;
	width: 60px;
	margin-left: 15px;
}
@media (min-width: $screen-md-min){
  .header-mini-cart-menu-cart-legend{
    display: inline;
  }
}

example of the image