MIF_E31222680/application/views/admin/sejarah.php

<?= $this->session->flashdata('pesan'); ?>
<div class="card">
    <div class="card-header d-flex justify-content-between align-items-center w-100">
        <h3 class="card-title mb-1" style="margin-top: 5px;">Halaman Sejarah Pondok Pesantren</h3>
    </div>
    <!-- /.card-header -->
    <div class="card-body">
        <table id="tb_santri" class="table table-bordered table-striped">
            <thead>
                <tr class="text-center">
                    <th>Sejarah Singkat</th>
                    <th>Aksi</th>
                </tr>
            </thead>
            <tbody>
                <?php
                foreach ($sejarah as $sjr) : ?>
                    <tr>
                        <td><?php
                            $paragraf = explode("\n", $sjr->sejarah);
                            foreach ($paragraf as $p) {
                                if (trim($p) != '') {
                                    echo '<p style="text-align: justify; text-indent: 40px;">' . $p . '</p>';
                                }
                            }
                            ?></td>
                        <td style="width: 100px;" class="text-center">
                            <button data-toggle="modal" data-target="#edit<?= $sjr->id_sejarah ?>" class="btn btn-warning btn-sm">
                                <i class="fas fa-edit"></i>
                            </button>
                            <!-- <a href="<?= base_url('Sejarah/delete/' . $sjr->id_sejarah) ?>" class="btn btn-danger btn-sm" onclick="return confirm('Apakah anda yakin menghapus data ini?')">
                                <i class="fas fa-trash"></i>
                            </a> -->
                        </td>

                    </tr>
                <?php endforeach ?>
            </tbody>
        </table>
    </div>
</div>

<!-- Modal Edit -->
<?php foreach ($sejarah as $sjr) { ?>
    <div class="modal fade" id="edit<?= $sjr->id_sejarah ?>" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="exampleModalLabel">Edit Sejarah</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body">
                    <form id="editSejarahForm<?= $sjr->id_sejarah ?>" action="<?= base_url('Sejarah/edit/' . $sjr->id_sejarah) ?>" method="POST">
                        <input type="hidden" name="id_kegiatan" value="<?= $sjr->id_sejarah ?>" data-default="<?= $sjr->id_sejarah ?>">
                        <div class="form-group">
                            <label>Sejarah Singkat</label>
                            <textarea name="sejarah" class="form-control"><?= $sjr->sejarah ?></textarea>
                            <?= form_error('sejarah', '<div class="text-small text-danger">', '</div>'); ?>
                        </div>
                        <div class="modal-footer">
                            <button type="submit" class="btn btn-primary btn-sm"><i class="fas fa-save"></i> Simpan </button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
<?php } ?>

<style>
    /* CSS untuk mengubah background dan border <th> dan <td> */
    /* Ubah warna border tabel menjadi hijau */
    table.table-bordered {
        border: 2px solid green;
        /* Border luar tabel */
    }

    /* Ubah warna background dan border header tabel */
    table.table-bordered th {
        background-color: #e0f7e0;
        /* Hijau muda untuk header */
        border: 1px solid green;
        /* Warna border hijau */
        color: #333;
        /* Warna teks */
    }

    /* Ubah warna background dan border sel tabel */
    table.table-bordered td {
        background-color: #f0fff0;
        /* Hijau sangat muda untuk sel */
        border: 1px solid green;
        /* Warna border hijau */
        color: #333;
        /* Warna teks */
    }

    .form-control:not([size]):not([multiple]) {
        background-image: none !important;
        /* Menghilangkan panah bawaan Bootstrap */
    }

    .custom-button {
        font-family: inherit;
        /* Mengikuti font dari parent */
        font-size: 0.9rem;
        /* Sesuaikan dengan font pada h3 */
        font-weight: bold;
        /* Jika judul pakai bold, tombol juga dibuat bold */
        text-transform: capitalize;
        /* Mengikuti format teks di judul */
        padding: 6px 13px;
        /* Sesuaikan padding agar proporsional */
    }

    .custom-btn {
        font-family: inherit;
        /* Mengikuti font dari parent */
        font-size: 0.9rem;
        /* Sesuaikan dengan font pada h3 */
        font-weight: bold;
        /* Jika judul pakai bold, tombol juga dibuat bold */
        text-transform: capitalize;
        /* Mengikuti format teks di judul */
        padding: 4px 10px;
        /* Sesuaikan padding agar proporsional */
    }

    /* Override panah sorting ganda */
    /* Hapus panah sorting bawaan template atau Bootstrap */
    table.dataTable thead .sorting:after,
    table.dataTable thead .sorting_asc:after,
    table.dataTable thead .sorting_desc:after {
        display: none !important;
    }
</style>

<!-- <script>
    $(document).ready(function() {
        $('#tb_santri').DataTable({
            "paging": true, // Enable pagination
            "lengthChange": true, // Allow user to change number of rows shown
            "searching": true, // Enable search
            "ordering": true, // Enable column sorting
            "info": true, // Show table info
            "autoWidth": false, // Disable auto column width adjustment
        });
    });
</script> -->