<div class="page-title">
    <div class="title">
        <h3 ng-i18next="dashboard.title"></h3>
    </div>
</div>

<div class="clearfix"></div>

<div class="row">
    <div class="col-xs-12 col-sm-6 col-md-3">
        <div class="panel panel-primary">
            <div class="panel-heading">
                <div class="row">
                    <div class="col-xs-3">
                        <i class="fa fa-users fa-5x"></i>
                    </div>
                    <div class="col-xs-9 text-right">
                        <div class="huge">{{hogoDashboard.users}}</div>
                        <div ng-i18next="dashboard.total_user"></div>
                    </div>
                </div>
            </div>

        </div>
    </div>
    <div class="col-xs-12 col-sm-6 col-md-3">
        <div class="panel panel-green">
            <div class="panel-heading">
                <div class="row">
                    <div class="col-xs-3">
                        <i class="fa fa-tasks fa-5x"></i>
                    </div>
                    <div class="col-xs-9 text-right">
                        <div class="huge">{{hogoDashboard.teams}}</div>
                        <div ng-i18next="dashboard.total_teams"></div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="col-xs-12 col-sm-6 col-md-3">
        <div class="panel panel-yellow">
            <div class="panel-heading">
                <div class="row">
                    <div class="col-xs-3">
                        <i class="fa fa-copy fa-5x"></i>
                    </div>
                    <div class="col-xs-9 text-right">
                        <div class="huge">{{hogoDashboard.files}}</div>
                        <div ng-i18next="dashboard.total_files"></div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="col-xs-12 col-sm-6 col-md-3">
        <div class="panel panel-red">
            <div class="panel-heading">
                <div class="row">
                    <div class="col-xs-3">
                        <i class="fa fa-hdd-o fa-5x"></i>
                    </div>
                    <div class="col-xs-9 text-right">
                        <div class="huge">{{hogoDashboard.storage}}</div>
                        <div ng-i18next="dashboard.storage_usage"></div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<div class="row">
    <div class="col-md-12 col-sm-12 col-xs-12">
        <div class="x_panel list">
            <div class="x_title">
                <h2><i class="fa fa-bar-chart-o fa-fw"></i> <span ng-i18next="dashboard.team_registration"></span></span></h2>
                <ul class="nav navbar-right panel_toolbox">
                    <li><a ng-click="viewPreviousYear()"><i class="fa fa-chevron-left"></i></a></li>
                    <li><a ng-click="viewNextYear()"><i class="fa fa-chevron-right"></i></a></li>
                </ul>
                <div class="clearfix"></div>
            </div>
            <div class="x_content">
                <highchart id="chart1" config="chartConfig1"></highchart>
            </div>
        </div>
    </div>
</div>

<div class="row">
    <div class="col-md-12 col-sm-12 col-xs-12">
        <div class="x_panel list">
            <div class="x_title">
                <h2><i class="fa fa-bar-chart-o fa-fw"></i> <span ng-i18next="dashboard.team_statistic"></span></span></h2>
                <div class="clearfix"></div>
            </div>
            <div class="x_content">
                <highchart id="chart1" config="chartConfig2"></highchart>
            </div>
        </div>
    </div>
</div>