<a href="javascript:void(0)" class="card">
    <img src="{{ site.baseurl }}/src/assets/icons/back_black.png">
    <p>Friend request accepted</p>
</a>

<div class="card preview">
  <div class="head">
    <img src="{{ site.baseurl }}/src/assets/images/profile_picture.jpg" />
    <p>Maria Baum</p>
  </div>
  <div class="message">
    <p>“Hey I’m new here and looking for some friends :)“</p>
    <a href="javascript:void(0)" class="button">Send friends request</a>
  </div>
</div>

<div class="list">
    <div class="list_item">
        <img src="{{ site.baseurl }}/src/assets/images/profile_picture.jpg">
        <p>Anna Newman</p>
        <img class="bin" src="{{ site.baseurl }}/src/assets/icons/delete_bin_purple.png">
    </div>

    <div class="list_item">
        <img src="{{ site.baseurl }}/src/assets/images/profile_dominic.png">
        <p>Dominic Reindl</p>
        <img class="bin" src="{{ site.baseurl }}/src/assets/icons/delete_bin_purple.png">
    </div>
</div>

<div class="list">
    <div class="list_item">
        <img src="{{ site.baseurl }}/src/assets/images/profile_picture.jpg">
        <p>Anna Newman</p>
        <img class="check" src="{{ site.baseurl }}/src/assets/icons/check_purple.png">
        <img class="delete" src="{{ site.baseurl }}/src/assets/icons/close_grey.svg">
    </div>

    <div class="list_item">
        <img src="{{ site.baseurl }}/src/assets/images/profile_dominic.png">
        <p>Dominic Reindl</p>
        <img class="check" src="{{ site.baseurl }}/src/assets/icons/check_purple.png">
        <img class="delete" src="{{ site.baseurl }}/src/assets/icons/close_grey.svg">
    </div>
</div>

<div class="card preview reask">
    <p>Do you really want to delete Lisa Rader from your friends list?</p>
    <div class="button_in_line">
          <a href="javascript:void(0)" class="button button_small">Delete</a>
    <a href="javascript:void(0)" class="button button_cancel button_small">Cancel</a>  
    </div>

</div>
</div>