Tronic247 Material
Components

Cards

Usage

<div class="card" style="width:300px;">
  <a class="ripple-e" href="#!">
    <img src="https://via.placeholder.com/800x400">
    <div class="body">
      <h3 class="card-title">Title</h3>
      <p>Lorem ipsum dolor, sit amt?</p>
    </div>
  </a>
  <div class="footer">
    <button class="btn unelevated">Button</button>
    <button class="btn unelevated">Button</button>
  </div>
</div>

Interactive examples

John Doe

Is a man who is popular

<div class="card" style="width:300px;">
  <div class="row">
    <div class="col">
      <img src="https://via.placeholder.com/140x155">
    </div>
    <div class="col pb-2">
      <h3 class="display-h5">John Doe</h3>
      <p>Is a man who is popular</p>
      <button class="btn small unelevated">
       Got it
      </button>
    </div>
  </div>
</div>