Wappler F7 elements

wapplerf7.html

<div class="block-title">Block Title</div>
<div class="block">
  <div class="block-header">Block Header</div>
  <p>Block content</p>
  <div class="block-footer">Block Footer</div>
</div>

<div class="card card-outline">
  <div class="card-header">Header</div>
  <div class="card-content card-content-padding">
    <!-- Card content -->
  </div>
  <div class="card-footer">Footer</div>
</div>

<div class="card card-expandable">
  <!-- card content -->
  <div class="card-content">
    <!-- put all content here -->
  </div>
</div>

<div class="card demo-facebook-card">
  <div class="card-header">
    <div class="demo-facebook-avatar"><img src="https://cdn.framework7.io/placeholder/people-68x68-1.jpg"
                                           width="34" height="34" /></div>
    <div class="demo-facebook-name">John Doe</div>
    <div class="demo-facebook-date">Monday at 2:15 PM</div>
  </div>
  <div class="card-content card-content-padding">
    <p>What a nice photo i took yesterday!</p><img src="https://cdn.framework7.io/placeholder/nature-1000x700-8.jpg" width="100%" />
    <p class="likes">Likes: 112 &nbsp;&nbsp; Comments: 43</p>
  </div>
  <div class="card-footer"><a href="#" class="link">Like</a><a href="#" class="link">Comment</a><a href="#"
                                                                                                   class="link">Share</a></div>
</div>