{% include 'header.html' %}
                <!-- Begin Page Content -->
                <div class="container-fluid">

                    <!-- Page Heading -->
                    <div class="d-sm-flex align-items-center justify-content-between mb-4">
                        <h1 class="h3 mb-0 text-gray-800">Visualisasi Data</h1>
                    </div>

                    <!-- Content Row -->
                    <div class="row">

                        <!-- First Column -->
                        <div class="col-lg-6">
                            <!-- Bar Diagram -->
                            <div class="card shadow mb-4">
                                <div class="card-header py-3">
                                    <h6 class="m-0 font-weight-bold text-primary">Bar Diagram</h6>
                                </div>
                                <div class="card-body">
                                    <img src="{{ url_for('static', filename='files/bar-diagram.png') }}" class="img-fluid" alt="Responsive image">
                                </div>
                            </div>

                            <div class="card shadow mb-4">
                                <div class="card-header py-3">
                                    <h6 class="m-0 font-weight-bold text-primary">Word Cloud</h6>
                                </div>
                                <div class="card-body">
                                    <img src="{{ url_for('static', filename='files/wordcloud.png') }}" class="img-fluid" alt="Responsive image">
                                </div>
                            </div>
                        
                        </div>

                        <!-- Second Column -->
                        <div class="col-lg-6">
                            <div class="card shadow mb-4">
                                <div class="card-header py-3">
                                    <h6 class="m-0 font-weight-bold text-primary">Pie Diagram
                                    </h6>
                                </div>
                                <div class="card-body">
                                    <img src="{{ url_for('static', filename='files/pie-diagram.png') }}" class="img-fluid" alt="Responsive image">
                                </div>
                            </div>  
                            
                        </div>

                    </div>

                </div>
                <!-- /.container-fluid -->
{% include 'footer.html' %}