<?php defined('ABSPATH') or die('Access denied.'); ?>

<div class="row">

    <div class="wdt-chart-wizard-chart-selecter-block col-sm-2">
        <div class="card" data-type="chartjs_line_chart" data-min_columns="2" data-max_columns="0">
            <div class="card-header">
                <div class="wdt-chart-wizard-overlay"></div>
                <img class="img-responsive" src="<?php echo WDT_ASSETS_PATH ?>img/chart-thumbs/chartjs_line_chart.jpg">
            </div>
            <div class="card-body">
                <h4 class="f-14"><?php esc_html_e('Line chart', 'wpdatatables'); ?></h4>
            </div>
        </div>
    </div>

    <div class="wdt-chart-wizard-chart-selecter-block col-sm-2">
        <div class="card" data-type="chartjs_area_chart" data-min_columns="2" data-max_columns="0">
            <div class="card-header">
                <div class="wdt-chart-wizard-overlay"></div>
                <img class="img-responsive" src="<?php echo WDT_ASSETS_PATH ?>img/chart-thumbs/chartjs_area_chart.jpg">
            </div>
            <div class="card-body">
                <h4 class="f-14"><?php esc_html_e('Area chart', 'wpdatatables'); ?></h4>
            </div>
        </div>
    </div>

    <div class="wdt-chart-wizard-chart-selecter-block col-sm-2">
        <div class="card" data-type="chartjs_stacked_area_chart" data-min_columns="2" data-max_columns="0">
            <div class="card-header">
                <div class="wdt-chart-wizard-overlay"></div>
                <img class="img-responsive"
                     src="<?php echo WDT_ASSETS_PATH ?>img/chart-thumbs/chartjs_stacked_area_chart.jpg">
            </div>
            <div class="card-body">
                <h4 class="f-14"><?php esc_html_e('Stacked area chart', 'wpdatatables'); ?></h4>
            </div>
        </div>
    </div>

    <div class="wdt-chart-wizard-chart-selecter-block col-sm-2">
        <div class="card" data-type="chartjs_column_chart" data-min_columns="2" data-max_columns="0">
            <div class="card-header">
                <div class="wdt-chart-wizard-overlay"></div>
                <img class="img-responsive"
                     src="<?php echo WDT_ASSETS_PATH ?>img/chart-thumbs/chartjs_column_chart.jpg">
            </div>
            <div class="card-body">
                <h4 class="f-14"><?php esc_html_e('Column chart', 'wpdatatables'); ?></h4>
            </div>
        </div>
    </div>

    <div class="wdt-chart-wizard-chart-selecter-block col-sm-2">
        <div class="card" data-type="chartjs_stacked_column_chart" data-min_columns="2" data-max_columns="0">
            <div class="card-header">
                <div class="wdt-chart-wizard-overlay"></div>
                <img class="img-responsive"
                     src="<?php echo WDT_ASSETS_PATH ?>img/chart-thumbs/chartjs_stacked_column_chart.png">
            </div>
            <div class="card-body">
                <h4 class="f-14"><?php esc_html_e('Stacked Column chart', 'wpdatatables'); ?></h4>
            </div>
        </div>
    </div>

    <div class="wdt-chart-wizard-chart-selecter-block col-sm-2">
        <div class="card" data-type="chartjs_bar_chart" data-min_columns="2" data-max_columns="0">
            <div class="card-header">
                <div class="wdt-chart-wizard-overlay"></div>
                <img class="img-responsive"
                     src="<?php echo WDT_ASSETS_PATH ?>img/chart-thumbs/chartjs_bar_chart.png">
            </div>
            <div class="card-body">
                <h4 class="f-14"><?php esc_html_e('Bar chart', 'wpdatatables'); ?></h4>
            </div>
        </div>
    </div>

</div>

<div class="row">

    <div class="wdt-chart-wizard-chart-selecter-block col-sm-2">
        <div class="card" data-type="chartjs_stacked_bar_chart" data-min_columns="2" data-max_columns="0">
            <div class="card-header">
                <div class="wdt-chart-wizard-overlay"></div>
                <img class="img-responsive"
                     src="<?php echo WDT_ASSETS_PATH ?>img/chart-thumbs/chartjs_bar_stacked_chart.png">
            </div>
            <div class="card-body">
                <h4 class="f-14"><?php esc_html_e('Stacked bar chart', 'wpdatatables'); ?></h4>
            </div>
        </div>
    </div>

    <div class="wdt-chart-wizard-chart-selecter-block col-sm-2">
        <div class="card" data-type="chartjs_radar_chart" data-min_columns="2" data-max_columns="0">
            <div class="card-header">
                <div class="wdt-chart-wizard-overlay"></div>
                <img class="img-responsive" src="<?php echo WDT_ASSETS_PATH ?>img/chart-thumbs/chartjs_radar_chart.jpg">
            </div>
            <div class="card-body">
                <h4 class="f-14"><?php esc_html_e('Radar chart', 'wpdatatables'); ?></h4>
            </div>
        </div>
    </div>

    <div class="wdt-chart-wizard-chart-selecter-block col-sm-2">
        <div class="card" data-type="chartjs_polar_area_chart" data-min_columns="2" data-max_columns="2">
            <div class="card-header">
                <div class="wdt-chart-wizard-overlay"></div>
                <img class="img-responsive"
                     src="<?php echo WDT_ASSETS_PATH ?>img/chart-thumbs/chartjs_polar_area_chart.jpg">
            </div>
            <div class="card-body">
                <h4 class="f-14"><?php esc_html_e('Polar area chart', 'wpdatatables'); ?></h4>
            </div>
        </div>
    </div>

    <div class="wdt-chart-wizard-chart-selecter-block col-sm-2">
        <div class="card" data-type="chartjs_pie_chart" data-min_columns="2" data-max_columns="2">
            <div class="card-header">
                <div class="wdt-chart-wizard-overlay"></div>
                <img class="img-responsive" src="<?php echo WDT_ASSETS_PATH ?>img/chart-thumbs/chartjs_pie_chart.jpg">
            </div>
            <div class="card-body">
                <h4 class="f-14"><?php esc_html_e('Pie chart', 'wpdatatables'); ?></h4>
            </div>
        </div>
    </div>

    <div class="wdt-chart-wizard-chart-selecter-block col-sm-2">
        <div class="card" data-type="chartjs_doughnut_chart" data-min_columns="2" data-max_columns="2">
            <div class="card-header">
                <div class="wdt-chart-wizard-overlay"></div>
                <img class="img-responsive"
                     src="<?php echo WDT_ASSETS_PATH ?>img/chart-thumbs/chartjs_doughnut_chart.jpg">
            </div>
            <div class="card-body">
                <h4 class="f-14"><?php esc_html_e('Doughnut chart', 'wpdatatables'); ?></h4>
            </div>
        </div>
    </div>

    <div class="wdt-chart-wizard-chart-selecter-block col-sm-2">
        <div class="card" data-type="chartjs_bubble_chart" data-min_columns="4" data-max_columns="4">
            <div class="card-header">
                <div class="wdt-chart-wizard-overlay"></div>
                <img class="img-responsive"
                     src="<?php echo WDT_ASSETS_PATH ?>img/chart-thumbs/chartjs_bubble_chart.jpg">
            </div>
            <div class="card-body">
                <h4 class="f-14"><?php esc_html_e('Bubble chart', 'wpdatatables'); ?></h4>
            </div>
        </div>
    </div>

</div>