tabler/pages/_includes/layout/homepage.html

<div class="row row-deck">
   <div class="col-sm-6 col-lg-3">
      {% include cards/charts/sales.html %}
   </div>
   <div class="col-sm-6 col-lg-3">
      {% include cards/charts/revenue.html %}
   </div>
   <div class="col-sm-6 col-lg-3">
      <div class="card">
         <div class="card-body">
            <div class="d-flex">
               <div>New clients</div>
               <div class="ml-auto">
                  {% include parts/dropdown/days.html %}
               </div>
            </div>
            <div class="d-flex align-items-baseline">
               <div class="h1 mb-3 mr-2">6,782</div>
               <div class="mr-auto text-red">
                  5% {% include ui/icon.html icon="trending-down" class="icon-thin" %}
               </div>
            </div>

            <div class="chart-sm" id="chart-active-users"></div>
            {% include js/charts.html id="chart-active-users" chart-id="new-clients" %}
         </div>
      </div>
   </div>

   <div class="col-sm-6 col-lg-3">
      <div class="card">
         <div class="card-body">
            <div class="d-flex">
               <div>Active users</div>
               <div class="ml-auto">
                  {% include parts/dropdown/days.html %}
               </div>
            </div>
            <div class="d-flex align-items-baseline">
               <div class="h1 mb-3 mr-2">2,986</div>
               <div class="mr-auto text-green">
                  4% {% include ui/icon.html icon="trending-up" class="icon-thin" %}
               </div>
            </div>

            <div class="chart-sm" id="chart-active-users2"></div>
            {% include js/charts.html id="chart-active-users2" chart-id="active-users" %}
         </div>
      </div>
   </div>

   <div class="col-lg-6">
      <div class="row">
         <div class="col-md-6">
            {% include cards/project-summary.html stage-color="red" %}
         </div>
         <div class="col-md-6">
            {% include cards/project-summary.html title="UI Redesign" date="11 Nov 2019" stage="Final review" avatar-limit=3 avatar-offset=9 project-color="green" percentage=80 percentage-color="green" %}
         </div>

         <div class="col-6 col-sm-4">
            {% include cards/small-stats-3.html number=43 title="New Tickets" percentage=6 %}
         </div>
         <div class="col-6 col-sm-4">
            {% include cards/small-stats-3.html number="$95" title="Daily Earnings" percentage=-2 %}
         </div>
         <div class="col-6 col-sm-4">
            {% include cards/small-stats-3.html number=7 title="New Replies" percentage=9 %}
         </div>
      </div>
   </div>
   <div class="col-lg-6">
      {% include cards/map.html title="Top users" %}
   </div>

   <div class="col-md-4">
      {% include cards/charts/card.html name="temperature" title="A" height=12 %}
   </div>
   <div class="col-md-4">
      {% include cards/charts/card.html name="donut" title="B" height=12 %}
   </div>
   <div class="col-md-4">
      {% include cards/charts/card.html name="pie" title="C" height=12 %}
   </div>

   {% comment %}
   <div class="col-lg-6">
      {% comment %}{% include cards/development-activity.html %}{% endcomment %}
   </div>

   <div class="col-md-6">
      <div class="alert alert-primary">Are you in trouble? <a href="{{ site.base }}/docs/index.html" class="alert-link">Read our documentation</a> with code samples.</div>

      <div class="row">
         <div class="col-sm-6">
            {% include cards/chart.html height=12 title="Chart title" id="chart-donut" data="donut" %}
         </div>
         <div class="col-sm-6">
            {% include cards/chart.html height=12 title="Chart title" id="chart-pie" data="pie" %}
         </div>
         <div class="col-sm-6">
            {% include cards/digit.html color="red" title="New feedback" digit="62" width="28%" %}
         </div>
         <div class="col-sm-6">
            {% include cards/digit.html color="green" title="Today profit" digit="$652" width="84%" %}
         </div>
      </div>
   </div>
   {% endcomment %}

   <div class="col-sm-6 col-xl-3">
      {% include cards/small-stats.html color="blue" icon="dollar-sign" count="132" subtitle="Sales" description="12 waiting payments" %}
   </div>
   <div class="col-sm-6 col-xl-3">
      {% include cards/small-stats.html color="green" icon="shopping-cart" count="78" subtitle="Orders" description="32 shipped" %}
   </div>
   <div class="col-sm-6 col-xl-3">
      {% include cards/small-stats.html chart-position="left" chart-type="donut" chart-data="56/100" chart-label="56%" color="red" count="1352" subtitle="Members" description="163 registered today" %}
   </div>
   <div class="col-sm-6 col-xl-3">
      {% include cards/small-stats.html color="yellow" chart-type="pie" chart-data="22/100" color="yellow" count="132" subtitle="Comments" description="16 waiting" %}
   </div>
</div>

{% comment %}
<div class="row row-deck">
   {% for article in site.data.articles limit: 2 %}
   <div class="col-lg-6">
      {% include cards/blog-single.html article=article type="aside" %}
   </div>
   {% endfor %}
</div>
{% endcomment %}

<div class="row row-deck">

   {% comment %}
   <div class="col-12">
      {% include cards/table-users.html %}
   </div>

   <div class="col-sm-6 col-lg-4">
      {% include cards/browsers.html %}
   </div>
   <div class="col-sm-6 col-lg-4">
      {% include cards/projects-list.html %}
   </div>
   <div class="col-md-6 col-lg-4">
      {% include cards/members.html %}
   </div>

   <div class="col-md-6 col-lg-12">
      <div class="row">
         <div class="col-sm-6 col-lg-3">
            {% include cards/chart-bg.html id="chart-bg-users-1" %}
         </div>
         <div class="col-sm-6 col-lg-3">
            {% include cards/chart-bg.html id="chart-bg-users-2" offset=60 aggregate=true color="red" rate="-3%" %}
         </div>
         <div class="col-sm-6 col-lg-3">
            {% include cards/chart-bg.html id="chart-bg-users-3" offset=50 color="green" rate="-3%" %}
         </div>
         <div class="col-sm-6 col-lg-3">
            {% include cards/chart-bg.html id="chart-bg-users-4" offset=40 color="yellow" rate="9%" %}
         </div>
      </div>
   </div>

   {% endcomment %}

   <div class="col-12">
      {% include cards/invoices.html %}
   </div>
</div>