---
title: "Home"
group: home
---
<div class="row">
  <div class="col">
    <div class="card">
      <div class="d-flex justify-content-between align-items-center card-header">
        <div>
          <span>Sale Analytics</span>
          <small class="d-block text-muted">Percentage change
            <span class="text-danger">▼95.87%</span>
          </small>
        </div>
        <div>
          <div class="button-shadow btn-group-sm btn-group" role="group">
            <button class="btn btn-outline-secondary">24 Hours</button>
            <button class="btn btn-outline-secondary">7 Days</button>
            <button class="btn btn-outline-secondary">1 Month</button>
          </div>
        </div>
      </div>
      <div class="card-body">
        <div class="d-none d-sm-flex justify-content-between pb-4">
          <div class="text-success">
            <h5 class="mb-0">
              <strong>
                34.45B
              </strong>
            </h5>
            <small>Aggregate Income</small>
          </div>
          <div class="d-sm-flex justify-content-around">
            <div class="pr-5">
              <h5 class="mb-0">
                <strong>92.83</strong>
              </h5>
              <small>Average impressions</small>
            </div>
            <div class="pr-5 text-danger">
              <h5 class="mb-0">
                <strong>45.08%</strong>
              </h5>
              <small>Engagement rate</small>
            </div>
            <div>
              <h5 class="mb-0">
                <strong>783</strong>
              </h5>
              <small>Growth Rate</small>
            </div>
          </div>
        </div>
        <canvas height="60" id="mainChart"></canvas>
      </div>
    </div>
  </div>
</div>
<div class="row">
  <div class="col-sm-6 col-md-3">
    {{< stat title="576K" value="Users" type="primary" icon="vendor/animated-icons/heart/heart.json" >}}
  </div>
  <div class="col-sm-6 col-md-3">
    {{< stat title="99.99%" value="Uptime" type="secondary" icon="vendor/animated-icons/online/online.json" >}}
  </div>
  <div class="col-sm-6 col-md-3">
    {{< stat title="465K" value="Visitors" type="warning" icon="vendor/animated-icons/activity/activity.json" >}}
  </div>
  <div class="col-sm-6 col-md-3">
    {{< stat title="7,578" value="Likes" type="danger" icon="vendor/animated-icons/thumb/thumb.json" >}}
  </div>
</div>
<div class="row">
  <div class="col-sm-12 col-md-4">
    <div class="card">
      <div class="d-flex justify-content-between card-header">
        <div>
          <span>Monthly page views</span>
        </div>
      </div>
      <div class="card-body">
        <canvas height="180" id="viewsChart"></canvas>
      </div>
    </div>
  </div>
  <div class="col-sm-12 col-md-4">
    <div class="card">
      <div class="d-flex justify-content-between card-header">
        <div>
          <span>Revenue</span>
        </div>
      </div>
      <div class="card-body">
        <canvas height="180" id="revenueChart"></canvas>
      </div>
    </div>
  </div>
  <div class="col-sm-12 col-md-4">
    <div class="card">
      <div class="d-flex justify-content-between card-header">
        <div>
          <span>Monthly visitors</span>
        </div>
      </div>
      <div class="card-body">
        <canvas height="180" id="visitorsChart"></canvas>
      </div>
    </div>
  </div>
</div>

<div class="row">
  <div class="col-sm-12 col-md-6">
    {{< weather >}}
  </div>
  <div class="col-sm-12 col-md-6">
    {{< post >}}
  </div>
</div>