{{#extend "my-account-v2"
  title="Address Book"
  dataBreadcrumbs=address_book.breadcrumbs
  pageClass="page_my-account_new"
  pageMyAcc=true
  myAccV2=true
  isLoggedIn=true
  mainClass="address-book"
}}
{{#content "head" mode="append"}}
<link type="text/css" rel="stylesheet" href="./css/pages/page_address-book.css">
{{/content}}
{{#content "main"}}
<div class="globalMessages">
  <div class="container">
    {{> notifications notification-page.success withCloseBtn="true" text="New delivery address was added."}}
  </div>
</div>
<div class="container">
  <div class="row">
    <div class="col-12">
      {{> my-account/mobile-nav
          mod
          menu=my_account.diy.menu
          active-index=3
          page-name="Address Book"
        }}
    </div>
    <div class="col-12">
      <div class="address-book__header">
        <h1 class="title">Address Book</h1>
        <button class="btn btn_full btn-primary btn--add-address">Add new delivery address</button>
      </div>
      <div class="address-book__items">
        {{#each address_book.addresses}}
          {{> address-card this}}
        {{/each}}
      </div>
    </div>
  </div>
</div>
{{/content}}
{{#content "foot" mode="append"}}
{{> my-account/delete-address-modal
    address_book.deleteAddressModal
    id="delete-address"
    }}
<script defer src="./js/address-book.min.js"></script>
{{/content}}
{{/extend}}