Skip to content

Commit

Permalink
Major Improvement + Animations Landing Page πŸ€™πŸ»
Browse files Browse the repository at this point in the history
Major Improvement + Animations  Landing Page πŸ€™πŸ»
  • Loading branch information
syauqi authored Aug 27, 2020
2 parents 370b0f7 + fd4260c commit 107610f
Show file tree
Hide file tree
Showing 6 changed files with 204 additions and 34 deletions.
58 changes: 39 additions & 19 deletions application/views/index.php
Original file line number Diff line number Diff line change
Expand Up @@ -5,10 +5,10 @@
</div>
<div class="container">
<div class="banner_content text-center">
<h3>Belajar Dimana Saja & Kapan Saja <br /> Mudah Dengan Learnify</h3>
<p>Dengan Learnify kemudahan kegiatan belajar mengajar dapat terpenuhi. Para guru dan siswa dapat
<h3 data-aos="fade-up" data-aos-duration="1600">Belajar Dimana Saja & Kapan Saja <br /> Mudah Dengan Learnify</h3>
<p data-aos="fade-up" data-aos-duration="1900">Dengan Learnify kemudahan kegiatan belajar mengajar dapat terpenuhi. Para guru dan siswa dapat
belajar meski banyak halangan atau rintangan. Nikmati Pembelajaran terstruktur dan efektif menggunakan Learnify serta kemudahan belajar dengan menggunakan aplikasi kami. </p>
<a class="main_btn" href="<?= base_url('user/registration') ?>#registration">Bergabung Sekarang <span class="lnr lnr-arrow-right"></span></a>
<a data-aos="fade-up" data-aos-duration="2000" class="main_btn" href="<?= base_url('user/registration') ?>#registration">Bergabung Sekarang <span class="lnr lnr-arrow-right"></span></a>
</div>
</div>
</div>
Expand All @@ -21,7 +21,7 @@
<div class="finance_inner row">
<div class="col-lg-3 col-sm-6">
<div class="finance_item">
<div class="media">
<div data-aos="fade-right" data-aos-duration="1600" class="media">
<div class="d-flex">
<i class="lnr lnr-users"></i>
</div>
Expand All @@ -33,7 +33,7 @@
</div>
<div class="col-lg-3 col-sm-6">
<div class="finance_item">
<div class="media">
<div data-aos="fade-right" data-aos-duration="1800" class="media">
<div class="d-flex">
<i class="lnr lnr-file-empty"></i>
</div>
Expand All @@ -43,7 +43,7 @@
</div>
</div>
</div>
<div class="col-lg-3 col-sm-6">
<div data-aos="fade-right" data-aos-duration="2000" class="col-lg-3 col-sm-6">
<div class="finance_item">
<div class="media">
<div class="d-flex">
Expand All @@ -55,7 +55,7 @@
</div>
</div>
</div>
<div class="col-lg-3 col-sm-6">
<div data-aos="fade-right" data-aos-duration="2200" class="col-lg-3 col-sm-6">
<div class="finance_item">
<div class="media">
<div class="d-flex">
Expand All @@ -72,18 +72,38 @@
</section>
<!--================End Finance Area =================-->

<section class="learnify-for-indonesia p_20">
<div class="container">
<div class="row">
<div class="col-md-6 mx-auto">
<img data-aos="fade-up" data-aos-duration="1800" src="<?= base_url('assets/') ?>img/illustrations/index-study.svg" alt="" srcset="">
</div>
</div>
<div class="row">
<div class="col-md-7 mx-auto">
<div class="main_title">
<h2 data-aos="fade-up" data-aos-duration="2000">Learnify Dibuat Untuk Meningkatkan Kualitas Pembelajaran Di Indonesia</h2>
<p data-aos="fade-up" data-aos-duration="2200">Merciful revaluation burying love ultimate value inexpedient ubermensch. Holiest madness victorious morality hope endless christian madness. Love dead fearful transvaluation marvelous. Oneself right ideal abstract endless faith deceptions zarathustra grandeur law ubermensch free.</p>
<a href="https://github.com/syauqi/learnify"><button data-aos="fade-up" data-aos-duration="2400" class="bubbly-button">Download Learnify <span class="lnr lnr-arrow-right"></span></button></a>
</div>
</div>
</div>
</div>
</section>


<!--================Courses Area =================-->
<section class="courses_area p_40">
<div class="container">
<div class="main_title">
<h2>Pelajaran Yang Tersedia di Learnify</h2>
<p>Merciful revaluation burying love ultimate value inexpedient ubermensch. Holiest madness victorious morality hope endless christian madness. Love dead fearful transvaluation marvelous. Oneself right ideal abstract endless faith deceptions zarathustra grandeur law ubermensch free.</p>
<h2 data-aos="fade-up" data-aos-duration="1600">Pelajaran Yang Tersedia di Learnify</h2>
<p data-aos="fade-up" data-aos-duration="1800">Merciful revaluation burying love ultimate value inexpedient ubermensch. Holiest madness victorious morality hope endless christian madness. Love dead fearful transvaluation marvelous. Oneself right ideal abstract endless faith deceptions zarathustra grandeur law ubermensch free.</p>
</div>
<div class="row courses_inner">
<div class="col-lg-9">
<div class="grid_inner">
<div class="grid_item wd55">
<div class="courses_item">
<div class="courses_item" data-aos="fade-right" data-aos-duration="1800">
<img src="<?= base_url('assets/') ?>img/courses/course-1.jpg" alt="">
<div class="hover_text">
<a class="cat" href="#">Gratis</a>
Expand All @@ -100,7 +120,7 @@
</div>
</div>
<div class="grid_item wd44">
<div class="courses_item">
<div class="courses_item" data-aos="fade-down" data-aos-duration="1800">
<img src="<?= base_url('assets/') ?>img/courses/course-2.jpg" alt="">
<div class="hover_text">
<a class="cat" href="#">Gratis</a>
Expand All @@ -116,7 +136,7 @@
</div>
</div>
<div class="grid_item wd44">
<div class="courses_item">
<div class="courses_item" data-aos="fade-right" data-aos-duration="1800">
<img src="<?= base_url('assets/') ?>img/courses/course-4.jpg" alt="">
<div class="hover_text">
<a class="cat" href="#">Gratis</a>
Expand All @@ -132,7 +152,7 @@
</div>
</div>
<div class="grid_item wd55">
<div class="courses_item">
<div class="courses_item" data-aos="fade-up" data-aos-duration="1800">
<img src="<?= base_url('assets/') ?>img/courses/course-5.jpg" alt="">
<div class="hover_text">
<a class="cat" href="#">Gratis</a>
Expand All @@ -151,7 +171,7 @@
</div>
</div>
<div class="col-lg-3">
<div class="course_item">
<div class="course_item" data-aos="fade-left" data-aos-duration="1800">
<img src="<?= base_url('assets/') ?>img/courses/course-3.jpg" alt="">
<div class="hover_text">
<a class="cat" href="#">Gratis</a>
Expand All @@ -175,8 +195,8 @@
<section class="team_area p_20">
<div class="container">
<div class="main_title">
<h2>Testimonial Para Siswa Learnify</h2>
<p>Merciful revaluation burying love ultimate value inexpedient ubermensch. Holiest madness victorious morality hope endless christian madness. Love dead fearful transvaluation marvelous. Oneself right ideal abstract endless faith deceptions zarathustra grandeur law ubermensch free.</p>
<h2 data-aos="fade-up" data-aos-duration="1800">Testimonial Para Siswa Learnify</h2>
<p data-aos="fade-up" data-aos-duration="2000">Merciful revaluation burying love ultimate value inexpedient ubermensch. Holiest madness victorious morality hope endless christian madness. Love dead fearful transvaluation marvelous. Oneself right ideal abstract endless faith deceptions zarathustra grandeur law ubermensch free.</p>
</div>
<section class="testimonials_area p_20">
<div class="container">
Expand Down Expand Up @@ -235,10 +255,10 @@
<section class="impress_area p_120">
<div class="container">
<div class="impress_inner text-center">
<h2>LOGIN SEBAGAI GURU DAN UPLOAD MATERI & VIDEO SEKARANG</h2>
<p>Merciful revaluation burying love ultimate value inexpedient ubermensch. Holiest madness victorious morality hope endless christian madness. Love dead fearful transvaluation marvelous. Oneself right ideal abstract endless faith deceptions zarathustra grandeur law ubermensch free. Abstract chaos snare play truth ultimate good self. God overcome sexuality pious abstract good decieve revaluation aversion good. Virtues chaos overcome society holiest truth.
<h2 data-aos="fade-up" data-aos-duration="1800">LOGIN SEBAGAI GURU DAN UPLOAD MATERI & VIDEO SEKARANG</h2>
<p data-aos="fade-up" data-aos-duration="2000">Merciful revaluation burying love ultimate value inexpedient ubermensch. Holiest madness victorious morality hope endless christian madness. Love dead fearful transvaluation marvelous. Oneself right ideal abstract endless faith deceptions zarathustra grandeur law ubermensch free. Abstract chaos snare play truth ultimate good self. God overcome sexuality pious abstract good decieve revaluation aversion good. Virtues chaos overcome society holiest truth.
</p>
<a class="main_btn2" href="<?= base_url('welcome/guru') ?>">Login Sebagai Guru <span class="lnr lnr-arrow-right text-black"></span></a>
<a data-aos="fade-up" data-aos-duration="2200" class="main_btn" href="<?= base_url('welcome/guru') ?>">Login Sebagai Guru <span class="lnr lnr-arrow-right text-black"></span></a>
</div>
</div>
</section>
Expand Down
21 changes: 21 additions & 0 deletions application/views/template/footer.php
Original file line number Diff line number Diff line change
Expand Up @@ -268,6 +268,27 @@
<script src="<?= base_url('assets/') ?>vendors/counter-up/jquery.counterup.js"></script>
<script src="<?= base_url('assets/') ?>js/mail-script.js"></script>
<script src="<?= base_url('assets/') ?>js/theme.js"></script>
<script>
var animateButton = function(e) {
e.preventDefault;
e.target.classList.remove('animate');
e.target.classList.add('animate');
setTimeout(function() {
e.target.classList.remove('animate');
}, 700);
};

var bubblyButtons = document.getElementsByClassName("bubbly-button");

for (var i = 0; i < bubblyButtons.length; i++) {
bubblyButtons[i].addEventListener('click', animateButton, false);
}
</script>
<script src="https://unpkg.com/[email protected]/dist/aos.js"></script>
<script>
AOS.init();
</script>

</body>

</html>
15 changes: 2 additions & 13 deletions application/views/template/nav.php
Original file line number Diff line number Diff line change
@@ -1,16 +1,3 @@
<!--
@Project: Learnify
@Programmer: Syauqi Zaidan Khairan Khalaf
@Website: https://linktr.ee/syauqi
@Email : [email protected]

@About-Learnify :
Web Edukasi Open Source yang dibuat oleh Syauqi Zaidan Khairan Khalaf.
Learnify adalah Web edukasi yang dilengkapi video, materi dan sistem ujian
yang tersedia secara gratis. Learnify dibuat ditujukan agar para siswa dan
guru dapat terus belajar dan mengajar dimana saja dan kapan saja.
-->

<!doctype html>
<html lang="en">

Expand All @@ -37,6 +24,7 @@
<link href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700;900&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&display=swap" rel="stylesheet">
<!-- Scripts -->
<link href="https://unpkg.com/[email protected]/dist/aos.css" rel="stylesheet">
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/sweetalert2.all.min.js"></script>
<script src="<?= base_url('assets/') ?>js/jquery-3.3.1.min.js"></script>
<script src="<?= base_url('assets/') ?>js/popper.js"></script>
Expand All @@ -46,6 +34,7 @@
$("#nav<?= $this->uri->segment(2); ?>").addClass('active')
})
</script>

</head>

<body>
Expand Down
143 changes: 141 additions & 2 deletions assets/css/style.css

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

Binary file added assets/img/bottom-section.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
1 change: 1 addition & 0 deletions assets/img/illustrations/index-study.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.

0 comments on commit 107610f

Please sign in to comment.