<?= $this->extend('Panel/Layouts/App') ?>
<?= $this->section('css') ?>
<link rel="stylesheet" href="<?= base_url() ?>/vendors/tom-select@2.0.0-rc.4/dist/css/tom-select.bootstrap5.min.css">
<style>
    .blink_me {
        animation: blinker 1s linear infinite;
    }

    @keyframes blinker {
        50% {
            opacity: 0;
        }
    }
</style>
<?= $this->endSection() ?>
<?= $this->section('content') ?>
<div class="m-2">
    <div class="card p-1 my-1">
        <materi-pelajaran tinymcekey="<?= options('tinymcekey') ?>"></materi-pelajaran>
    </div>
</div>

<?= $this->endSection() ?>
<?= $this->section('js') ?>
<script src="<?= base_url() ?>/vendors/tom-select@2.0.0-rc.4/dist/js/tom-select.complete.js?v=<?= versioningjs() ?>"></script>
<script src="<?= base_url() ?>/vendors/gridjs/gridjs.production.min.js?v=<?= versioningjs() ?>"></script>
<script src="<?= base_url() ?>/panel/assets/js/components/VueGrid/VueGrid.js?v=<?= versioningjs() ?>"></script>
<script src="https://mozilla.github.io/pdf.js/build/pdf.js?v=<?= versioningjs() ?>"></script>
<script src="<?= base_url() ?>/panel/assets/js/components/VueTomSelect/VueTomSelect.js?v=<?= versioningjs() ?>"></script>
<script src="<?= base_url() ?>/panel/assets/js/pages/elearning/jadwal-mengajar/materi/index.js?v=<?= versioningjs() ?>"></script>
<script src="<?= base_url() ?>/panel/assets/js/pages/elearning/jadwal-mengajar/materi/viewed-materi.js?v=<?= versioningjs() ?>"></script>
<script src="<?= base_url() ?>/panel/assets/js/pages/elearning/jadwal-mengajar/materi/salin-materi.js?v=<?= versioningjs() ?>"></script>
<script>
    VAPP.component(VPMateriPelajaran.name, VPMateriPelajaran);
    VAPP.component(VueTomSelect.name, VueTomSelect);
    VAPP.component(VueGrid.name, VueGrid);
    VAPP.component(VPViewedMateri.name, VPViewedMateri);
    VAPP.component(VPSalinMateri.name, VPSalinMateri);
</script>

<?= $this->endSection() ?>