diff options
38 files changed, 439 insertions, 235 deletions
diff --git a/about/school.html b/about/school.html index 8ec8c2e..88ba903 100644 --- a/about/school.html +++ b/about/school.html @@ -88,89 +88,88 @@ <h1 id="guru">Guru (OUTDATED)</h1> <div class="card-container"> <div class="card"> - <img src="https://smpia25.al-azhar.sch.id/wp-content/uploads/2022/10/B6-300x343.png" alt="" class="card-person"> + <img src="/assets/images/guru/nasikhun.png" alt="" class="card-person"> <h3>Drs. Nasikhun, M.A. (Kepala Sekolah)</h3> </div> <div class="card"> - <img src="https://smpia25.al-azhar.sch.id/wp-content/uploads/2020/10/Bu-Fitri-Website-300x343.png" alt="" class="card-person"> + <img src="/assets/images/guru/fitriah.png" alt="" class="card-person"> <h3>Fitriah, S.Pd. (Wakil Kepala Sekolah)</h3> </div> <div class="card"> - <img src="https://smpia25.al-azhar.sch.id/wp-content/uploads/2020/10/Ir.Hj_.-Wiwit-Parminta-IPA-1-300x343.jpg" alt="" class="card-person"> + <img src="/assets/images/guru/wiwit.jpg" alt="" class="card-person"> <h3>Ir. Hj. Wiwit Parminta</h3> </div> <div class="card"> - <img src="https://smpia25.al-azhar.sch.id/wp-content/uploads/2020/10/Pak-Ihsan-Website-300x343.png" alt="" class="card-person"> - <h3>H.M. Ihsan, M.M.</h3> + <img src="/assets/images/scenery_blur.png" alt="" class="card-person"> + <h3>Wiilda Septiana S.Pd</h3> </div> <div class="card"> - <img src="https://smpia25.al-azhar.sch.id/wp-content/uploads/2022/10/Bu-Iin-Website-300x343.png" alt="" class="card-person"> + <img src="/assets/images/guru/iin.png" alt="" class="card-person"> <h3>Dra. Kusnun Indrawati</h3> </div> <div class="card"> - <img src="https://smpia25.al-azhar.sch.id/wp-content/uploads/2022/10/Pak-Iskandar-Website-300x343.png" alt="" class="card-person"> + <img src="/assets/images/guru/iskandar.png" alt="" class="card-person"> <h3>M. Iskandar Zulkarnain, S.Pd.</h3> </div> <div class="card"> - <img src="https://smpia25.al-azhar.sch.id/wp-content/uploads/2022/10/Bu-Atin-300x343.png" alt="" class="card-person"> + <img src="/assets/images/guru/atin.png" alt="" class="card-person"> <h3>Suwartini, S.Pd.</h3> </div> <div class="card"> - <img src="https://smpia25.al-azhar.sch.id/wp-content/uploads/2022/10/Pak-Amar-Website-300x343.png" alt="" class="card-person"> + <img src="/assets/images/guru/amar.png" alt="" class="card-person"> <h3>Mohammad Amar, Lc.</h3> </div> <div class="card"> - <img src="https://smpia25.al-azhar.sch.id/wp-content/uploads/2022/10/Bu-Eni-Website-300x343.png" alt="" class="card-person"> + <img src="/assets/images/guru/eni.png" alt="" class="card-person"> <h3>Unaeni Jahroh, S.Pd.</h3> </div> <div class="card"> - <img src="https://smpia25.al-azhar.sch.id/wp-content/uploads/2022/10/WhatsApp-Image-2022-10-03-at-8.42.51-AM-1-300x343.png" alt="" class="card-person"> + <img src="/assets/images/guru/fuji.png" alt="" class="card-person"> <h3>Fuji Syukrani Sakura, S.Pd.</h3> </div> <div class="card"> - <img src="https://smpia25.al-azhar.sch.id/wp-content/uploads/2022/10/Pak-Reza-Website-300x343.png" alt="" class="card-person"> - <h3>Reza Firdaus, S.Pd. - </h3> + <img src="/assets/images/guru/reza.png" alt="" class="card-person"> + <h3>Reza Firdaus, S.Pd.</h3> </div> <div class="card"> - <img src="https://smpia25.al-azhar.sch.id/wp-content/uploads/2022/10/Bu-Andin-Website-300x343.png" alt="" class="card-person"> + <img src="/assets/images/guru/andin.png" alt="" class="card-person"> <h3>Andini Nurlaily Hikmah, S.Pd.</h3> </div> <div class="card"> - <img src="https://smpia25.al-azhar.sch.id/wp-content/uploads/2022/10/Pak-Faris-Wesite-300x343.png" alt="" class="card-person"> - <h3>Achmad Al Farisi, S.Pd.I.</h3> + <img src="/assets/images/scenery_blur.png" alt="" class="card-person"> + <h3>Muhammad Fathan S.Ag</h3> </div> <div class="card"> - <img src="https://smpia25.al-azhar.sch.id/wp-content/uploads/2022/10/Pak-Supatri-Website-300x343.png" alt="" class="card-person"> + <img src="/assets/images/guru/supatri.png" alt="" class="card-person"> <h3>Supatri, S.Pd.</h3> </div> <div class="card"> - <img src="https://smpia25.al-azhar.sch.id/wp-content/uploads/2022/10/Bu-Sofi-Website-300x343.png" alt="" class="card-person"> + <img src="/assets/images/guru/sofi.png" alt="" class="card-person"> <h3>Sofia Nurbaiti, S.Pd.</h3> </div> <div class="card"> - <img src="https://smpia25.al-azhar.sch.id/wp-content/uploads/2022/10/Pak-Hidayat-Website-300x343.png" alt="" class="card-person"> + <img src="/assets/images/guru/hidayat.png" alt="" class="card-person"> <h3>Hidayatullah, S.Pd.</h3> </div> <div class="card"> - <img src="https://smpia25.al-azhar.sch.id/wp-content/uploads/2022/10/Pak-Akrom-Website-300x343.png" alt="" class="card-person"> + <img src="/assets/images/guru/akrom.png" alt="" class="card-person"> <h3>Akrom, S.Ag.</h3> </div> <div class="card"> - <img src="https://smpia25.al-azhar.sch.id/wp-content/uploads/2020/10/Pak-Miftah-Website-300x343.png" alt="" class="card-person"> + <img src="/assets/images/guru/miftah.png" alt="" class="card-person"> <h3>Miftah Izharul Haq, S.Pd.</h3> </div> <div class="card"> - <img src="https://smpia25.al-azhar.sch.id/wp-content/uploads/2020/10/Bu-Beti-Website-300x343.png" alt="" class="card-person"> + <img src="/assets/images/guru/betti.png" alt="" class="card-person"> <h3>Nurbaeti, SE. M. Ak. </h3> </div> <div class="card"> - <img src="https://smpia25.al-azhar.sch.id/wp-content/uploads/2020/10/None-300x343.png" alt="" class="card-person"> + <img src="/assets/images/scenery_blur.png" alt="" class="card-person"> <h3>Maman Sulaiman, S.Pd.</h3> </div> <div class="card"> - <img src="https://smpia25.al-azhar.sch.id/wp-content/uploads/2020/10/Bu-Ayu-1-300x343.png" alt="" class="card-person"> + <img src="/assets/images/guru/ayu.png" alt="" class="card-person"> <h3>Ayu Rezky Yulita, M.Pd.</h3> </div> </div> diff --git a/assets/images/guru/akrom.png b/assets/images/guru/akrom.png Binary files differnew file mode 100644 index 0000000..881df19 --- /dev/null +++ b/assets/images/guru/akrom.png diff --git a/assets/images/guru/amar.png b/assets/images/guru/amar.png Binary files differnew file mode 100644 index 0000000..c3bc630 --- /dev/null +++ b/assets/images/guru/amar.png diff --git a/assets/images/guru/andin.png b/assets/images/guru/andin.png Binary files differnew file mode 100644 index 0000000..c1a9793 --- /dev/null +++ b/assets/images/guru/andin.png diff --git a/assets/images/guru/atin.png b/assets/images/guru/atin.png Binary files differnew file mode 100644 index 0000000..19b8dd9 --- /dev/null +++ b/assets/images/guru/atin.png diff --git a/assets/images/guru/ayu.png b/assets/images/guru/ayu.png Binary files differnew file mode 100644 index 0000000..dab6679 --- /dev/null +++ b/assets/images/guru/ayu.png diff --git a/assets/images/guru/betti.png b/assets/images/guru/betti.png Binary files differnew file mode 100644 index 0000000..bfb23b2 --- /dev/null +++ b/assets/images/guru/betti.png diff --git a/assets/images/guru/eni.png b/assets/images/guru/eni.png Binary files differnew file mode 100644 index 0000000..4c9522e --- /dev/null +++ b/assets/images/guru/eni.png diff --git a/assets/images/guru/fuji.png b/assets/images/guru/fuji.png Binary files differnew file mode 100644 index 0000000..074284f --- /dev/null +++ b/assets/images/guru/fuji.png diff --git a/assets/images/guru/hidayat.png b/assets/images/guru/hidayat.png Binary files differnew file mode 100644 index 0000000..0c85675 --- /dev/null +++ b/assets/images/guru/hidayat.png diff --git a/assets/images/guru/iin.png b/assets/images/guru/iin.png Binary files differnew file mode 100644 index 0000000..e454bad --- /dev/null +++ b/assets/images/guru/iin.png diff --git a/assets/images/guru/iskandar.png b/assets/images/guru/iskandar.png Binary files differnew file mode 100644 index 0000000..1678a1b --- /dev/null +++ b/assets/images/guru/iskandar.png diff --git a/assets/images/guru/miftah.png b/assets/images/guru/miftah.png Binary files differnew file mode 100644 index 0000000..f104b12 --- /dev/null +++ b/assets/images/guru/miftah.png diff --git a/assets/images/guru/reza.png b/assets/images/guru/reza.png Binary files differnew file mode 100644 index 0000000..df97168 --- /dev/null +++ b/assets/images/guru/reza.png diff --git a/assets/images/guru/sofi.png b/assets/images/guru/sofi.png Binary files differnew file mode 100644 index 0000000..56ccd8c --- /dev/null +++ b/assets/images/guru/sofi.png diff --git a/assets/images/guru/supatri.png b/assets/images/guru/supatri.png Binary files differnew file mode 100644 index 0000000..5678180 --- /dev/null +++ b/assets/images/guru/supatri.png diff --git a/assets/images/hero/altaz.jpg b/assets/images/hero/altaz.jpg Binary files differnew file mode 100644 index 0000000..e330acd --- /dev/null +++ b/assets/images/hero/altaz.jpg diff --git a/assets/images/hero/arabic.png b/assets/images/hero/arabic.png Binary files differnew file mode 100644 index 0000000..6e906f0 --- /dev/null +++ b/assets/images/hero/arabic.png diff --git a/assets/images/hero/biology.jpg b/assets/images/hero/biology.jpg Binary files differnew file mode 100644 index 0000000..838f58e --- /dev/null +++ b/assets/images/hero/biology.jpg diff --git a/assets/images/hero/ips.jpg b/assets/images/hero/ips.jpg Binary files differnew file mode 100644 index 0000000..76d613c --- /dev/null +++ b/assets/images/hero/ips.jpg diff --git a/assets/images/hero/laptop.jpg b/assets/images/hero/laptop.jpg Binary files differnew file mode 100644 index 0000000..ade8041 --- /dev/null +++ b/assets/images/hero/laptop.jpg diff --git a/assets/images/hero/math.jpg b/assets/images/hero/math.jpg Binary files differnew file mode 100644 index 0000000..b86b7e4 --- /dev/null +++ b/assets/images/hero/math.jpg diff --git a/assets/images/hero/music.jpg b/assets/images/hero/music.jpg Binary files differnew file mode 100644 index 0000000..aa91696 --- /dev/null +++ b/assets/images/hero/music.jpg diff --git a/assets/images/hero/paint.jpg b/assets/images/hero/paint.jpg Binary files differnew file mode 100644 index 0000000..bd95dae --- /dev/null +++ b/assets/images/hero/paint.jpg diff --git a/assets/images/hero/physics.jpg b/assets/images/hero/physics.jpg Binary files differnew file mode 100644 index 0000000..66b4b1a --- /dev/null +++ b/assets/images/hero/physics.jpg diff --git a/assets/images/hero/ppkn.jpg b/assets/images/hero/ppkn.jpg Binary files differnew file mode 100644 index 0000000..3c26811 --- /dev/null +++ b/assets/images/hero/ppkn.jpg diff --git a/assets/images/hero/quran.jpg b/assets/images/hero/quran.jpg Binary files differnew file mode 100644 index 0000000..dade517 --- /dev/null +++ b/assets/images/hero/quran.jpg diff --git a/assets/images/hero/sports.jpg b/assets/images/hero/sports.jpg Binary files differnew file mode 100644 index 0000000..a89e16f --- /dev/null +++ b/assets/images/hero/sports.jpg diff --git a/assets/images/scenery_blur.png b/assets/images/scenery_blur.png Binary files differnew file mode 100644 index 0000000..5c88836 --- /dev/null +++ b/assets/images/scenery_blur.png @@ -48,7 +48,7 @@ <div class="gradient-bg"></div> <div class="banner-text-container"> <h1 class="banner-text" id="banner-txt">Al Azhar 9th Grade Lesson Notes</h1> - <h3 class="banner-text" id="banner-txt">A website by Altaf</h3> + <h3 class="banner-text" id="banner-txt">A studying website</h3> </div> </div> @@ -71,7 +71,7 @@ <div class="card-container"> <div class="card"> <a href="/lessons/matematika/" class="link-card"></a> - <img src="/assets/images/hero/books.jpg" alt="" class="card-img"> + <img src="/assets/images/hero/math.jpg" alt="" class="card-img"> <a href="/lessons/1/"> <h2>Matematika</h2> </a> @@ -79,7 +79,7 @@ </div> <div class="card"> <a href="/lessons/fisika/" class="link-card"></a> - <img src="/assets/images/hero/books.jpg" alt="" class="card-img"> + <img src="/assets/images/hero/physics.jpg" alt="" class="card-img"> <a href="/lessons/2/"> <h2>Fisika</h2> </a> @@ -87,7 +87,7 @@ </div> <div class="card"> <a href="/lessons/biologi/" class="link-card"></a> - <img src="/assets/images/hero/books.jpg" alt="" class="card-img"> + <img src="/assets/images/hero/biology.jpg" alt="" class="card-img"> <a href="/lessons/3/"> <h2>Biologi</h2> </a> @@ -95,7 +95,7 @@ </div> <div class="card"> <a href="/lessons/ips/" class="link-card"></a> - <img src="/assets/images/hero/books.jpg" alt="" class="card-img"> + <img src="/assets/images/hero/ips.jpg" alt="" class="card-img"> <a href="/lessons/3/"> <h2>IPS</h2> </a> @@ -103,7 +103,7 @@ </div> <div class="card"> <a href="/lessons/agama/" class="link-card"></a> - <img src="/assets/images/hero/books.jpg" alt="" class="card-img"> + <img src="/assets/images/hero/alazhar.jpg" alt="" class="card-img"> <a href="/lessons/3/"> <h2>Agama</h2> </a> @@ -111,7 +111,7 @@ </div> <div class="card"> <a href="/lessons/quran/" class="link-card"></a> - <img src="/assets/images/hero/books.jpg" alt="" class="card-img"> + <img src="/assets/images/hero/quran.jpg" alt="" class="card-img"> <a href="/lessons/3/"> <h2>Al-Qur'an</h2> </a> @@ -119,7 +119,7 @@ </div> <div class="card"> <a href="/lessons/arab/" class="link-card"></a> - <img src="/assets/images/hero/books.jpg" alt="" class="card-img"> + <img src="/assets/images/hero/arabic.png" alt="" class="card-img"> <a href="/lessons/3/"> <h2>Bahasa Arab</h2> </a> @@ -127,7 +127,7 @@ </div> <div class="card"> <a href="/lessons/ppkn/" class="link-card"></a> - <img src="/assets/images/hero/books.jpg" alt="" class="card-img"> + <img src="/assets/images/hero/ppkn.jpg" alt="" class="card-img"> <a href="/lessons/3/"> <h2>PPKn</h2> </a> @@ -135,7 +135,7 @@ </div> <div class="card"> <a href="/lessons/informatika/" class="link-card"></a> - <img src="/assets/images/hero/books.jpg" alt="" class="card-img"> + <img src="/assets/images/hero/laptop.jpg" alt="" class="card-img"> <a href="/lessons/3/"> <h2>Informatika</h2> </a> @@ -143,7 +143,7 @@ </div> <div class="card"> <a href="/lessons/english/" class="link-card"></a> - <img src="/assets/images/hero/books.jpg" alt="" class="card-img"> + <img src="https://img-cdn.inc.com/image/upload/w_1920,h_1080,c_fill/images/panoramic/GettyImages-577674005_492115_zfpgiw.jpg" alt="" class="card-img"> <a href="/lessons/3/"> <h2>English</h2> </a> @@ -159,7 +159,7 @@ </div> <div class="card"> <a href="/lessons/musik/" class="link-card"></a> - <img src="/assets/images/hero/books.jpg" alt="" class="card-img"> + <img src="/assets/images/hero/music.jpg" alt="" class="card-img"> <a href="/lessons/3/"> <h2>Seni Musik</h2> </a> @@ -167,7 +167,7 @@ </div> <div class="card"> <a href="/lessons/lukis/" class="link-card"></a> - <img src="/assets/images/hero/books.jpg" alt="" class="card-img"> + <img src="/assets/images/hero/paint.jpg" alt="" class="card-img"> <a href="/lessons/3/"> <h2>Seni Rupa</h2> </a> @@ -175,7 +175,7 @@ </div> <div class="card"> <a href="/lessons/pjok/" class="link-card"></a> - <img src="/assets/images/hero/books.jpg" alt="" class="card-img"> + <img src="/assets/images/hero/sports.jpg" alt="" class="card-img"> <a href="/lessons/3/"> <h2>Penjasorkes</h2> </a> diff --git a/lessons/fisika/static-electricity/coulomb.html b/lessons/fisika/static-electricity/coulomb.html index 65864b8..8292073 100644 --- a/lessons/fisika/static-electricity/coulomb.html +++ b/lessons/fisika/static-electricity/coulomb.html @@ -76,9 +76,9 @@ <h1 id="units">Unit Conversions (for Coulomb)</h1> <ol> <li>n <b>mC</b> (<strong>milli</strong>Coulomb) = n * 10<sup>-3</sup> C</li> - <li>n <b>MC</b> (<strong>Micro</strong>Coulomb) = n * 10<sup>-6</sup> C</li> + <li>n <b>MC</b> (<strong>Micro</strong>Coulomb) = n * 10<sup>-6</sup> C <i>(Alternative form: μC)</i></li> <li>n <b>nC</b> (<strong>nano</strong>Coulomb) = n * 10<sup>-9</sup> C</li> - <li>n <b>Å</b> (<strong>Ångström</strong>) = n * 10<sup>10</sup> C</li> + <li>n <b>Å</b> (<strong>Ångström</strong>) = n * 10<sup>-10</sup> C</li> </ol> <h1 id="example">Example</h1> <img src="/assets/images/atoms/coulomb1.svg" alt=""><br> diff --git a/lessons/index.html b/lessons/index.html index 76d0727..a2f6dd4 100644 --- a/lessons/index.html +++ b/lessons/index.html @@ -54,131 +54,117 @@ <section> <div class="card-container"> <div class="card"> - <a href="/lessons/matematika/" class="link-card"></a> - <img src="/assets/images/hero/books.jpg" - alt="" class="card-img"> - <a href="/lessons/1/"> - <h2>Matematika</h2> - </a> - <p>Hidayatullah, S.Pd.</p> - </div> - <div class="card"> - <a href="/lessons/fisika/" class="link-card"></a> - <img src="/assets/images/hero/books.jpg" - alt="" class="card-img"> - <a href="/lessons/2/"> - <h2>Fisika</h2> - </a> - <p>Ayu Rezky Yulita, M.Pd.</p> - </div> - <div class="card"> - <a href="/lessons/biologi/" class="link-card"></a> - <img src="/assets/images/hero/books.jpg" - alt="" class="card-img"> - <a href="/lessons/3/"> - <h2>Biologi</h2> - </a> - <p>Ir. Hj. Wiwit Parminta</p> - </div> - <div class="card"> - <a href="/lessons/ips/" class="link-card"></a> - <img src="/assets/images/hero/books.jpg" - alt="" class="card-img"> - <a href="/lessons/3/"> - <h2>IPS</h2> - </a> - <p>Unaeni Jahroh S.Pd.</p> - </div> - <div class="card"> - <a href="/lessons/agama/" class="link-card"></a> - <img src="/assets/images/hero/books.jpg" - alt="" class="card-img"> - <a href="/lessons/3/"> - <h2>Agama</h2> - </a> - <p>Akrom Hasani, S.Ag.</p> - </div> - <div class="card"> - <a href="/lessons/quran/" class="link-card"></a> - <img src="/assets/images/hero/books.jpg" - alt="" class="card-img"> - <a href="/lessons/3/"> - <h2>Al-Qur'an</h2> - </a> - <p>Muhammad Fathan S.Ag</p> - </div> - <div class="card"> - <a href="/lessons/arab/" class="link-card"></a> - <img src="/assets/images/hero/books.jpg" - alt="" class="card-img"> - <a href="/lessons/3/"> - <h2>Bahasa Arab</h2> - </a> - <p>Mohammad Amar, Lc.</p> - </div> - <div class="card"> - <a href="/lessons/ppkn/" class="link-card"></a> - <img src="/assets/images/hero/books.jpg" - alt="" class="card-img"> - <a href="/lessons/3/"> - <h2>PPKn</h2> - </a> - <p>Andini Nurlaily Hikmah, S.Pd.</p> - </div> - <div class="card"> - <a href="/lessons/informatika/" class="link-card"></a> - <img src="/assets/images/hero/books.jpg" - alt="" class="card-img"> - <a href="/lessons/3/"> - <h2>Informatika</h2> - </a> - <p>Nurbaeti, SE., M.Ak</p> - </div> - <div class="card"> - <a href="/lessons/english/" class="link-card"></a> - <img src="/assets/images/hero/books.jpg" - alt="" class="card-img"> - <a href="/lessons/3/"> - <h2>English</h2> - </a> - <p>Sofia Nurbaiti, S.Pd.</p> - </div> - <div class="card"> - <a href="/lessons/indonesia/" class="link-card"></a> - <img src="/assets/images/hero/books.jpg" - alt="" class="card-img"> - <a href="/lessons/3/"> - <h2>Bahasa Indonesia</h2> - </a> - <p>Maman Sulaeman, S.Pd.</p> - </div> - <div class="card"> - <a href="/lessons/musik/" class="link-card"></a> - <img src="/assets/images/hero/books.jpg" - alt="" class="card-img"> - <a href="/lessons/3/"> - <h2>Seni Musik</h2> - </a> - <p>Dra. Kusnun Indrawati</p> - </div> - <div class="card"> - <a href="/lessons/lukis/" class="link-card"></a> - <img src="/assets/images/hero/books.jpg" - alt="" class="card-img"> - <a href="/lessons/3/"> - <h2>Seni Rupa</h2> - </a> - <p>Miftah Izharul Haq, S.Pd</p> - </div> - <div class="card"> - <a href="/lessons/pjok/" class="link-card"></a> - <img src="/assets/images/hero/books.jpg" - alt="" class="card-img"> - <a href="/lessons/3/"> - <h2>Penjasorkes</h2> - </a> - <p>Supatri, S.Pd</p> - </div> + <a href="/lessons/matematika/" class="link-card"></a> + <img src="/assets/images/hero/math.jpg" alt="" class="card-img"> + <a href="/lessons/1/"> + <h2>Matematika</h2> + </a> + <p>Hidayatullah, S.Pd.</p> + </div> + <div class="card"> + <a href="/lessons/fisika/" class="link-card"></a> + <img src="/assets/images/hero/physics.jpg" alt="" class="card-img"> + <a href="/lessons/2/"> + <h2>Fisika</h2> + </a> + <p>Ayu Rezky Yulita, M.Pd.</p> + </div> + <div class="card"> + <a href="/lessons/biologi/" class="link-card"></a> + <img src="/assets/images/hero/biology.jpg" alt="" class="card-img"> + <a href="/lessons/3/"> + <h2>Biologi</h2> + </a> + <p>Ir. Hj. Wiwit Parminta</p> + </div> + <div class="card"> + <a href="/lessons/ips/" class="link-card"></a> + <img src="/assets/images/hero/ips.jpg" alt="" class="card-img"> + <a href="/lessons/3/"> + <h2>IPS</h2> + </a> + <p>Unaeni Jahroh S.Pd.</p> + </div> + <div class="card"> + <a href="/lessons/agama/" class="link-card"></a> + <img src="/assets/images/hero/alazhar.jpg" alt="" class="card-img"> + <a href="/lessons/3/"> + <h2>Agama</h2> + </a> + <p>Akrom Hasani, S.Ag.</p> + </div> + <div class="card"> + <a href="/lessons/quran/" class="link-card"></a> + <img src="/assets/images/hero/quran.jpg" alt="" class="card-img"> + <a href="/lessons/3/"> + <h2>Al-Qur'an</h2> + </a> + <p>Muhammad Fathan S.Ag</p> + </div> + <div class="card"> + <a href="/lessons/arab/" class="link-card"></a> + <img src="/assets/images/hero/arabic.png" alt="" class="card-img"> + <a href="/lessons/3/"> + <h2>Bahasa Arab</h2> + </a> + <p>Mohammad Amar, Lc.</p> + </div> + <div class="card"> + <a href="/lessons/ppkn/" class="link-card"></a> + <img src="/assets/images/hero/ppkn.jpg" alt="" class="card-img"> + <a href="/lessons/3/"> + <h2>PPKn</h2> + </a> + <p>Andini Nurlaily Hikmah, S.Pd.</p> + </div> + <div class="card"> + <a href="/lessons/informatika/" class="link-card"></a> + <img src="/assets/images/hero/laptop.jpg" alt="" class="card-img"> + <a href="/lessons/3/"> + <h2>Informatika</h2> + </a> + <p>Nurbaeti, SE., M.Ak</p> + </div> + <div class="card"> + <a href="/lessons/english/" class="link-card"></a> + <img src="https://img-cdn.inc.com/image/upload/w_1920,h_1080,c_fill/images/panoramic/GettyImages-577674005_492115_zfpgiw.jpg" alt="" class="card-img"> + <a href="/lessons/3/"> + <h2>English</h2> + </a> + <p>Sofia Nurbaiti, S.Pd.</p> + </div> + <div class="card"> + <a href="/lessons/indonesia/" class="link-card"></a> + <img src="/assets/images/hero/books.jpg" alt="" class="card-img"> + <a href="/lessons/3/"> + <h2>Bahasa Indonesia</h2> + </a> + <p>Maman Sulaeman, S.Pd.</p> + </div> + <div class="card"> + <a href="/lessons/musik/" class="link-card"></a> + <img src="/assets/images/hero/music.jpg" alt="" class="card-img"> + <a href="/lessons/3/"> + <h2>Seni Musik</h2> + </a> + <p>Dra. Kusnun Indrawati</p> + </div> + <div class="card"> + <a href="/lessons/lukis/" class="link-card"></a> + <img src="/assets/images/hero/paint.jpg" alt="" class="card-img"> + <a href="/lessons/3/"> + <h2>Seni Rupa</h2> + </a> + <p>Miftah Izharul Haq, S.Pd</p> + </div> + <div class="card"> + <a href="/lessons/pjok/" class="link-card"></a> + <img src="/assets/images/hero/sports.jpg" alt="" class="card-img"> + <a href="/lessons/3/"> + <h2>Penjasorkes</h2> + </a> + <p>Supatri, S.Pd</p> + </div> </div> </section> </div> diff --git a/lessons/matematika/index.html b/lessons/matematika/index.html index 34889b2..64c2cc2 100644 --- a/lessons/matematika/index.html +++ b/lessons/matematika/index.html @@ -53,10 +53,12 @@ <div id="main"> <section> <h1 id="bab1">Chapter 1 - Bentuk Pangkat dan Akar</h1> - <p><a href="pangkat-akar/pangkat.html" class="link">Lesson 1: Exponent</a></p> - <p><a href="pangkat-akar/akar.html" class="link">Lesson 2: Root</a></p> - <p><a href="pangkat-akar/latihan.html" class="link">Exercise 1</a></p> - <p><a href="pangkat-akar/scientific.html" class="link">Lesson 3: Exponents Extended - Scientific Form of Decimals</a></p> + <p><a href="pangkat-akar/pangkat.html/" class="link">Lesson 1: Exponent</a></p> + <p><a href="pangkat-akar/akar.html/" class="link">Lesson 2: Root</a></p> + <p><a href="pangkat-akar/latihan.html/" class="link">Exercise 1</a></p> + <p><a href="pangkat-akar/scientific.html/" class="link">Lesson 3: Exponents Extended - Scientific Form of Decimals</a></p> + <h1 id="bab2">Chapter 2 - Quadratic Equation</h1> + <p><a href="quadratic-equation/" class="link">Main Lesson: Quadratic Equation - The Introduction</a></p> </section> </div> diff --git a/lessons/matematika/pangkat-akar/akar.html b/lessons/matematika/pangkat-akar/akar.html index 35ed018..4665ae0 100644 --- a/lessons/matematika/pangkat-akar/akar.html +++ b/lessons/matematika/pangkat-akar/akar.html @@ -61,57 +61,57 @@ <h1 id="definition">Definition</h1> Root is the inverse of exponent. For example;<br> <ul> - <li>4<sup>2</sup> = 16, <b>so <span class="root">16</span> = 4</b></li> - <li>5<sup>2</sup> = 25, <b>so <span class="root">25</span> = 5</b></li> - <li>10<sup>2</sup> = 100, <b>so <span class="root">100</span> = 10</b></li> + <li>4<sup>2</sup> = 16, <b>so <span class="sroot">16</span> = 4</b></li> + <li>5<sup>2</sup> = 25, <b>so <span class="sroot">25</span> = 5</b></li> + <li>10<sup>2</sup> = 100, <b>so <span class="sroot">100</span> = 10</b></li> </ul> <h1 id="simplification">Simplifying Square Roots</h1> You can simplify a root by factoring the root number another number that is rational. Or in other words, divide the root number by the perfect squares. For example; <ul> <li> - <strong>Simplify <span class="root">60</span></strong><br> - <span class="root">60</span> = <span class="root">4 × 15</span> = 2<span class="root">15</span><br> + <strong>Simplify <span class="sroot">60</span></strong><br> + <span class="sroot">60</span> = <span class="sroot">4 × 15</span> = 2<span class="sroot">15</span><br> </li> <li> - <strong>Simplify <span class="root">48</span></strong><br> - <span class="root">48</span> = <span class="root">16 × 3</span> = 4<span class="root">3</span><br> + <strong>Simplify <span class="sroot">48</span></strong><br> + <span class="sroot">48</span> = <span class="sroot">16 × 3</span> = 4<span class="sroot">3</span><br> </li> <li> - <strong>Simplify <span class="root">125</span></strong><br> - <span class="root">125</span> = <span class="root">25 × 5</span> = 5<span class="root">5</span><br> + <strong>Simplify <span class="sroot">125</span></strong><br> + <span class="sroot">125</span> = <span class="sroot">25 × 5</span> = 5<span class="sroot">5</span><br> </li> </ul> <h1 id="root-operations">Root Operations</h1> <h2 id="root-operations--addition">Addition</h2> Roots with coefficient can be added with another coefficient that have the same roots. <br> - <strong>a<span class="root">c</span> + b<span class="root">c</span> = (a + b)<span class="root">c</span></strong> + <strong>a<span class="sroot">c</span> + b<span class="sroot">c</span> = (a + b)<span class="sroot">c</span></strong> <ul> - <li>3<span class="root">2</span> + 4<span class="root">2</span> = (3 + 4)<span class="root">2</span> = <strong>7<span class="root">2</span></strong></li> - <li><span class="root">5</span> + 3<span class="root">5</span> = (1 + 3)<span class="root">5</span> = <strong>4<span class="root">5</span></strong></li> + <li>3<span class="sroot">2</span> + 4<span class="sroot">2</span> = (3 + 4)<span class="sroot">2</span> = <strong>7<span class="sroot">2</span></strong></li> + <li><span class="sroot">5</span> + 3<span class="sroot">5</span> = (1 + 3)<span class="sroot">5</span> = <strong>4<span class="sroot">5</span></strong></li> </ul> <h2 id="root-operations--subtraction">Subtraction</h2> Roots with coefficient can be subtracted with another coefficient that have the same roots. <br> - <strong>a<span class="root">c</span> - b<span class="root">c</span> = (a - b)<span class="root">c</span></strong> + <strong>a<span class="sroot">c</span> - b<span class="sroot">c</span> = (a - b)<span class="sroot">c</span></strong> <ul> - <li>7<span class="root">3</span> - 4<span class="root">3</span> = (7 - 4)<span class="root">3</span> = <strong>3<span class="root">2</span></strong></li> - <li>10<span class="root">6</span> - 5<span class="root">6</span> = (10 - 5)<span class="root">6</span> = <strong>5<span class="root">6</span></strong></li> + <li>7<span class="sroot">3</span> - 4<span class="sroot">3</span> = (7 - 4)<span class="sroot">3</span> = <strong>3<span class="sroot">2</span></strong></li> + <li>10<span class="sroot">6</span> - 5<span class="sroot">6</span> = (10 - 5)<span class="sroot">6</span> = <strong>5<span class="sroot">6</span></strong></li> </ul> <h2 id="root-operations--multiplication">Multiplication</h2> Roots can be multiplied with any other roots. If the root is the same as the other multiplied root, the root can be deleted (if you want to be faster). <br> - <strong>a<span class="root">c</span> × b<span class="root">d</span> = (a × b)<span class="root">c × d</span></strong> + <strong>a<span class="sroot">c</span> × b<span class="sroot">d</span> = (a × b)<span class="sroot">c × d</span></strong> <ul> - <li><span class="root">2</span> × <span class="root">5</span> = <strong><span class="root">10</span></strong></li> - <li>3<span class="root">2</span> × 4<span class="root">3</span> = (3 × 4)<span class="root">2 × 3</span> = <strong>12<span class="root">6</span></strong></li> - <li>2<span class="root">5</span> × 3<span class="root">5</span> = (2 × 3)(5) = 6(5) = <strong>30</strong></li> + <li><span class="sroot">2</span> × <span class="sroot">5</span> = <strong><span class="sroot">10</span></strong></li> + <li>3<span class="sroot">2</span> × 4<span class="sroot">3</span> = (3 × 4)<span class="sroot">2 × 3</span> = <strong>12<span class="sroot">6</span></strong></li> + <li>2<span class="sroot">5</span> × 3<span class="sroot">5</span> = (2 × 3)(5) = 6(5) = <strong>30</strong></li> </ul> <h2 id="root-operations--division">Division</h2> Roots can be divided with any other roots. <br> - <strong>a<span class="root">c</span> ÷ b<span class="root">d</span> = (a ÷ b)<span class="root">c ÷ d</span></strong> + <strong>a<span class="sroot">c</span> ÷ b<span class="sroot">d</span> = (a ÷ b)<span class="sroot">c ÷ d</span></strong> <ul> <li> - 8<span class="root">6</span> ÷ 4<span class="root">3</span> = (8 ÷ 4)<span class="root">6 ÷ 3</span> = <strong>2<span class="root">2</span></strong> + 8<span class="sroot">6</span> ÷ 4<span class="sroot">3</span> = (8 ÷ 4)<span class="sroot">6 ÷ 3</span> = <strong>2<span class="sroot">2</span></strong> </li> </ul> </section> diff --git a/lessons/matematika/pangkat-akar/latihan.html b/lessons/matematika/pangkat-akar/latihan.html index a019254..701a456 100644 --- a/lessons/matematika/pangkat-akar/latihan.html +++ b/lessons/matematika/pangkat-akar/latihan.html @@ -63,13 +63,13 @@ <h2 id="questions--pangkat">Pangkat</h1> <li style="margin-top: 10px;">8p<sup>2</sup>q × 2pq<sup>3</sup></li> <li style="margin-top: 10px;">64<sup><span class="frac"><sup>1</sup><span>⁄</span><sub>2</sub></span></sup> + 81<sup><span class="frac"><sup>1</sup><span>⁄</span><sub>3</sub></span></sup></li> - <li style="margin-top: 10px;">2<span class="root">5</span> + 3<span class="root">20</span> - 4<span class="root">5</span></li> + <li style="margin-top: 10px;">2<span class="sroot">5</span> + 3<span class="sroot">20</span> - 4<span class="sroot">5</span></li> <h2 id="questions--rasional">Merasionalkan Akar</h2> - <li style="margin-top: 10px;"><span class="frac"><sup>4</sup><span>⁄</span><sub><span class="root">5</span></sub></span></li> - <li style="margin-top: 10px;"><span class="frac"><sup>3<span class="root">5</span></sup><span>⁄</span><sub>2<span class="root">3</span></sup></sub></span></li> - <li style="margin-top: 10px;"><span class="frac"><sup>5</sup><span>⁄</span><sub><span class="root">3</span> - <span class="root">2</span></sub></span></li> - <li style="margin-top: 10px;"><span class="frac"><sup><span class="root">5</span> - <span class="root">7</span></sup><span>⁄</span><sub><span class="root">5</span> - <span class="root">2</span></sub></span></li> + <li style="margin-top: 10px;"><span class="frac"><sup>4</sup><span>⁄</span><sub><span class="sroot">5</span></sub></span></li> + <li style="margin-top: 10px;"><span class="frac"><sup>3<span class="sroot">5</span></sup><span>⁄</span><sub>2<span class="sroot">3</span></sup></sub></span></li> + <li style="margin-top: 10px;"><span class="frac"><sup>5</sup><span>⁄</span><sub><span class="sroot">3</span> - <span class="sroot">2</span></sub></span></li> + <li style="margin-top: 10px;"><span class="frac"><sup><span class="sroot">5</span> - <span class="sroot">7</span></sup><span>⁄</span><sub><span class="sroot">5</span> - <span class="sroot">2</span></sub></span></li> <h2 id="question--operasi-pangkat">Operasi Pangkat</h2> <li style="margin-top: 10px;">(8p<sup>2</sup>3)<sup>3</sup> ÷ 2pq</li> @@ -84,40 +84,40 @@ <li style="margin-top: 10px;">16p<sup>3</sup>q<sup>4</sup></li> <li style="margin-top: 10px;"> 64<sup><span class="frac"><sup>1</sup><span>⁄</span><sub>2</sub></span></sup> + 81<sup><span class="frac"><sup>1</sup><span>⁄</span><sub>3</sub></span></sup><br> - = <span class="root">64</span> + <sup>3</sup><span class="root">81</span><br> - = 8 + <sup>3</sup><span class="root">81</span> + = <span class="sroot">64</span> + <sup>3</sup><span class="sroot">81</span><br> + = 8 + <sup>3</sup><span class="sroot">81</span> </li> <li style="margin-top: 10px;"> - 2<span class="root">5</span> + 3<span class="root">20</span> - 4<span class="root">5</span><br> - = 6<span class="root">5</span> + 3<span class="root">20</span><br> - = 6<span class="root">5</span> + 3<span class="root">4 × 5</span><br> - = 6<span class="root">5</span> + 3<span class="root">2<sup>2</sup> × 5</span><br> - = 6<span class="root">5</span> + 3 × 2<span class="root">5</span><br> - = 6<span class="root">5</span> + 6<span class="root">5</span><br> - = <strong>12<span class="root">5</span></strong><br> + 2<span class="sroot">5</span> + 3<span class="sroot">20</span> - 4<span class="sroot">5</span><br> + = 6<span class="sroot">5</span> + 3<span class="sroot">20</span><br> + = 6<span class="sroot">5</span> + 3<span class="sroot">4 × 5</span><br> + = 6<span class="sroot">5</span> + 3<span class="sroot">2<sup>2</sup> × 5</span><br> + = 6<span class="sroot">5</span> + 3 × 2<span class="sroot">5</span><br> + = 6<span class="sroot">5</span> + 6<span class="sroot">5</span><br> + = <strong>12<span class="sroot">5</span></strong><br> </li> <li style="margin-top: 10px;"> - <span class="frac"><sup>4</sup><span>⁄</span><sub><span class="root">5</span></sub></span><br> - = <span class="frac"><sup>4</sup><span>⁄</span><sub><span class="root">5</span></sub></span> × <span class="frac"><sup><span class="root">5</span></sup><span>⁄</span><sub><span class="root">5</span></sub></span> = <strong><span class="frac"><sup>4<span class="root">5</span></sup><span>⁄</span><sub>5</sub></span></strong> + <span class="frac"><sup>4</sup><span>⁄</span><sub><span class="sroot">5</span></sub></span><br> + = <span class="frac"><sup>4</sup><span>⁄</span><sub><span class="sroot">5</span></sub></span> × <span class="frac"><sup><span class="sroot">5</span></sup><span>⁄</span><sub><span class="sroot">5</span></sub></span> = <strong><span class="frac"><sup>4<span class="sroot">5</span></sup><span>⁄</span><sub>5</sub></span></strong> </li> <li style="margin-top: 10px;"> - <span class="frac"><sup>3<span class="root">5</span></sup><span>⁄</span><sub>2<span class="root">3</span></sup></sub></span><br> - = <span class="frac"><sup>3<span class="root">5</span></sup><span>⁄</span><sub>2<span class="root">3</span></sup></sub></span> × <span class="frac"><sup><span class="root">3</span></sup><span>⁄</span><sub><span class="root">3</span></sup></sub></span><br> - = <span class="frac"><sup><span style="text-decoration: line-through;">3</span><span class="root">15</span></sup><span>⁄</span><sub>2 × <span style="text-decoration: line-through;">3</span></sup></sub></span><br> - = <strong><span class="frac"><sup><span class="root">15</span></sup><span>⁄</span><sub>2</sup></sub></span></strong> + <span class="frac"><sup>3<span class="sroot">5</span></sup><span>⁄</span><sub>2<span class="sroot">3</span></sup></sub></span><br> + = <span class="frac"><sup>3<span class="sroot">5</span></sup><span>⁄</span><sub>2<span class="sroot">3</span></sup></sub></span> × <span class="frac"><sup><span class="sroot">3</span></sup><span>⁄</span><sub><span class="sroot">3</span></sup></sub></span><br> + = <span class="frac"><sup><span style="text-decoration: line-through;">3</span><span class="sroot">15</span></sup><span>⁄</span><sub>2 × <span style="text-decoration: line-through;">3</span></sup></sub></span><br> + = <strong><span class="frac"><sup><span class="sroot">15</span></sup><span>⁄</span><sub>2</sup></sub></span></strong> </li> <li style="margin-top: 10px;"> - <span class="frac"><sup>5</sup><span>⁄</span><sub><span class="root">3</span> - <span class="root">2</span></sub></span><br> - = <span class="frac"><sup>5</sup><span>⁄</span><sub><span class="root">3</span> - <span class="root">2</span></sub></span> × <span class="frac"><sup><span class="root">3</span> + <span class="root">2</span></sup><span>⁄</span><sub><span class="root">3</span> + <span class="root">2</span></sub></span><br> - = <span class="frac"><sup>5(<span class="root">3</span> + <span class="root">2</span>)</sup><span>⁄</span><sub>(<span class="root">3</span>)<sup>2</sup> - (<span class="root">2</span>)<sup>2</sup></sub></span><br> - = <span class="frac"><sup>5(<span class="root">3</span> + <span class="root">2</span>)</sup><span>⁄</span><sub>3 - 2</sub></span> = <span class="frac"><sup>5(<span class="root">3</span> + <span class="root">2</span>)</sup><span>⁄</span><sub>1</sub></span><br> - = <strong>5(<span class="root">3</span> + <span class="root">2</span>)</strong> + <span class="frac"><sup>5</sup><span>⁄</span><sub><span class="sroot">3</span> - <span class="sroot">2</span></sub></span><br> + = <span class="frac"><sup>5</sup><span>⁄</span><sub><span class="sroot">3</span> - <span class="sroot">2</span></sub></span> × <span class="frac"><sup><span class="sroot">3</span> + <span class="sroot">2</span></sup><span>⁄</span><sub><span class="sroot">3</span> + <span class="sroot">2</span></sub></span><br> + = <span class="frac"><sup>5(<span class="sroot">3</span> + <span class="sroot">2</span>)</sup><span>⁄</span><sub>(<span class="sroot">3</span>)<sup>2</sup> - (<span class="sroot">2</span>)<sup>2</sup></sub></span><br> + = <span class="frac"><sup>5(<span class="sroot">3</span> + <span class="sroot">2</span>)</sup><span>⁄</span><sub>3 - 2</sub></span> = <span class="frac"><sup>5(<span class="sroot">3</span> + <span class="sroot">2</span>)</sup><span>⁄</span><sub>1</sub></span><br> + = <strong>5(<span class="sroot">3</span> + <span class="sroot">2</span>)</strong> </li> <li style="margin-top: 10px;"> - <span class="frac"><sup><span class="root">5</span> - <span class="root">7</span></sup><span>⁄</span><sub><span class="root">5</span> - <span class="root">2</span></sub></span><br> - = <span class="frac"><sup><span class="root">5</span> - <span class="root">7</span></sup><span>⁄</span><sub><span class="root">5</span> - <span class="root">2</span></sub></span> × <span class="frac"><sup><span class="root">5</span> + <span class="root">2</span></sup><span>⁄</span><sub><span class="root">5</span> + <span class="root">2</span></sub></span><br> - = <span class="frac"><sup>(<span class="root">5</span> - <span class="root">7</span>) × (<span class="root">5</span> + <span class="root">2</span>)</sup><span>⁄</span><sub>(<span class="root">5</span>)<sup>2</sup> - (<span class="root">2</span>)<sup>2</sup></sub></span><br> - = <span class="frac"><sup>5 + <span class="root">10</span> - <span class="root">35</span> - <span class="root">14</span></sup><span>⁄</span><sub>5 - 2</sub></span> = <strong><span class="frac"><sup>5 + <span class="root">10</span> - <span class="root">35</span> - <span class="root">14</span></sup><span>⁄</span><sub>3</sub></span></strong> + <span class="frac"><sup><span class="sroot">5</span> - <span class="sroot">7</span></sup><span>⁄</span><sub><span class="sroot">5</span> - <span class="sroot">2</span></sub></span><br> + = <span class="frac"><sup><span class="sroot">5</span> - <span class="sroot">7</span></sup><span>⁄</span><sub><span class="sroot">5</span> - <span class="sroot">2</span></sub></span> × <span class="frac"><sup><span class="sroot">5</span> + <span class="sroot">2</span></sup><span>⁄</span><sub><span class="sroot">5</span> + <span class="sroot">2</span></sub></span><br> + = <span class="frac"><sup>(<span class="sroot">5</span> - <span class="sroot">7</span>) × (<span class="sroot">5</span> + <span class="sroot">2</span>)</sup><span>⁄</span><sub>(<span class="sroot">5</span>)<sup>2</sup> - (<span class="sroot">2</span>)<sup>2</sup></sub></span><br> + = <span class="frac"><sup>5 + <span class="sroot">10</span> - <span class="sroot">35</span> - <span class="sroot">14</span></sup><span>⁄</span><sub>5 - 2</sub></span> = <strong><span class="frac"><sup>5 + <span class="sroot">10</span> - <span class="sroot">35</span> - <span class="sroot">14</span></sup><span>⁄</span><sub>3</sub></span></strong> </li> <li style="margin-top: 10px;"> (8p<sup>2</sup>3)<sup>3</sup> ÷ 2pq <br> diff --git a/lessons/matematika/pangkat-akar/pangkat.html b/lessons/matematika/pangkat-akar/pangkat.html index 4061c82..7c7ccce 100644 --- a/lessons/matematika/pangkat-akar/pangkat.html +++ b/lessons/matematika/pangkat-akar/pangkat.html @@ -103,15 +103,15 @@ <h1 id="fractional-exponent">Fractional Exponent</h1> <img src="/assets/images/math/fractional_exponent.svg" alt=""> <p>x <sup><span class="frac"><sup>y</sup><span>⁄</span><sub>z</sub></span></sup> = - <sup>z</sup><span><span class="root">x</span><sup style="font-size: small;">y</sup><span></span></span></p> + <sup>z</sup><span><span class="sroot">x</span><sup style="font-size: small;">y</sup><span></span></span></p> <h2 id="fractional-exponent--examples">Examples</h2> <ul> <li>5 <sup><span class="frac"><sup>1</sup><span>⁄</span><sub>2</sub></span></sup> = - <sup>2</sup><span><span class="root">5</span></span></li> + <sup>2</sup><span><span class="sroot">5</span></span></li> <li>7 <sup><span class="frac"><sup>2</sup><span>⁄</span><sub>3</sub></span></sup> = - <sup>3</sup><span><span class="root">7<sup>2</sup></span></span></li> + <sup>3</sup><span><span class="sroot">7<sup>2</sup></span></span></li> </ul> - <p><strong>Small Note:</strong> 2</sup><span class="root">x</span> or <span class="root">x</span> menans square root. The 2 before root should be removed. The 2 is only present for easier purposes.<br>3</sup><span><span class="root">x</span> means cubic root.</p> + <p><strong>Small Note:</strong> 2</sup><span class="sroot">x</span> or <span class="sroot">x</span> menans square root. The 2 before root should be removed. The 2 is only present for easier purposes.<br>3</sup><span><span class="sroot">x</span> means cubic root.</p> <h1 id="exponential-equation">Exponential Equation</h1> <ol> diff --git a/lessons/matematika/quadratic-equation/index.html b/lessons/matematika/quadratic-equation/index.html index bcb3ec8..d3d1c4e 100644 --- a/lessons/matematika/quadratic-equation/index.html +++ b/lessons/matematika/quadratic-equation/index.html @@ -13,11 +13,17 @@ <link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png"> <link rel="manifest" href="/site.webmanifest"> <script src="https://kit.fontawesome.com/d279a1f519.js" crossorigin="anonymous"></script> + <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/katex@0.16.8/dist/katex.css" + integrity="sha384-pRsDYiLLocCzWnUN/YEr9TBTTaZOUi5x8adKfqi6Qt44lDaFkoP++x1j2ohSMtdf" crossorigin="anonymous"> + <script src="https://cdn.jsdelivr.net/npm/katex@0.16.8/dist/katex.js" + integrity="sha384-tMzugJpfLv7v0f+KXzNMqNCC6sVzLMM3sCnZDgzy0lcO/0h3sAkEBg/URFcV0JpE" + crossorigin="anonymous"></script> </head> <body> <div class="fixed-top-btn-container" id="topbtn"> - <a class="fixed-top-btn menu-btn" onclick="toggleNav()" href="javascript:void(0)"><i class="fa-solid fa-bars"></i></a> + <a class="fixed-top-btn menu-btn" onclick="toggleNav()" href="javascript:void(0)"><i + class="fa-solid fa-bars"></i></a> <a href="../" class="fixed-top-btn back-btn"><i class="fa-solid fa-chevron-left"></i></a> </div> <div id="console"></div> @@ -47,18 +53,220 @@ <div class="banner-bg" id="img-supplies"></div> <div class="gradient-bg"></div> <div class="banner-text-container"> - <h1 class="banner-text" id="banner-txt">Root</h1> - <h3 class="banner-text" id="banner-txt">Chapter 1</h3> + <h1 class="banner-text" id="banner-txt">Quadratic Equation: The Introduction</h1> + <h3 class="banner-text" id="banner-txt">Chapter 2</h3> </div> </div> - + <div class="chip-container" id="chip-container"> - <div class="chip"><span>❓ Unchecked by Professionals</span></div> + <div class="chip" title="Beware of mistakes. Please report to me (Altaf) if you caught a mistake here."><span>❓ Unchecked by Professionals</span></div> </div> - + <div id="main"> <section> - + <h1 id="introduction">Introduction</h1> + In algebra, a quadratic equation is any equation that can be rearranged in standard form as where x + represents an unknown value, and a, b, and c represent known numbers, where a ≠ 0.<sup>[<a + href="#reference-1" class="link-compact">1</a>]</sup> + <h2 id="introduction--formula">Formula / Format</h2> + <span class="math-font">ax<sup>2</sup> + bx + c = 0</span> + <p> + <span class="math-font">a, b, c</span> = known numbers, where a ≠ 0 <br> + <span class="math-font">x</span> = the unknown, or the root + </p> + <h2 id="introduction--exercise">Exercises</h2> + <h3>Finding the roots with factorisation.</h3> + <ol> + <li> + <span id="q1.1.1"></span> + <p> + <hr> + <span>To find the answer, we need to find the factors of b and c.</span><br> + <span>The suitable factor for the equation are <b>2 and -3</b>.</span><br> + <span>Then, insert each numbers to this formula: <span id="q1.1.2"></span>, where <span + class="math-font">y</span> is the factor.</span><br><br> + <span id="q1.1.3"></span><br><span id="q1.1.31"></span><br> + <hr> + <strong>So, the answer is <span id="q1.1.4"></span></strong> + </p> + <script defer> + var element1 = document.getElementById("q1.1.1"); + var element2 = document.getElementById("q1.1.2"); + var element3 = document.getElementById("q1.1.3"); + var element31 = document.getElementById("q1.1.31"); + var element4 = document.getElementById("q1.1.4"); + + katex.render(String.raw`x^2 - 1x - 6 = 0`, element1, { + throwOnError: false + }); + katex.render(String.raw`x + y`, element2, { + throwOnError: false + }); + katex.render(String.raw` + \begin{aligned} + x + 2 &= 0\\ + x &= -2\\ + \end{aligned} + `, element3, { + throwOnError: true + }); katex.render(String.raw` + \begin{aligned} + x - 3 &= 0\\ + x &= 3 + \end{aligned} + `, element31, { + throwOnError: true + }); + katex.render(String.raw`x = \{-2, 3\}`, element4, { + throwOnError: false + }); + </script> + </li> + <li> + <p> + <span id="q1.2.1"></span><br> + <span><strong>Factors:</strong> <span class="math-font">2, 4</span></span><br> + <hr> + <span id="q1.2.2"></span><br> + <span id="q1.2.3"></span><br> + <hr> + <span id="q1.2.4"></span><br> + </p> + <script defer> + var element1 = document.getElementById("q1.2.1"); + var element2 = document.getElementById("q1.2.2"); + var element3 = document.getElementById("q1.2.3"); + var element4 = document.getElementById("q1.2.4"); + + katex.render(String.raw`x^2 + 6x + 8 = 0`, element1, { + throwOnError: false + }); + katex.render(String.raw` + \begin{aligned} + x + 2 &= 0\\ + x &= -2\\ + \end{aligned} + `, element2, { + throwOnError: true + }); katex.render(String.raw` + \begin{aligned} + x + 4 &= 0\\ + x &= 4 + \end{aligned} + `, element3, { + throwOnError: true + }); + katex.render(String.raw`x = \{-2, -4\}`, element4, { + throwOnError: false + }); + </script> + </li> + </ol> + <h1 id="relation-algebra">Relation between Quadratic Equation and Algebraic Expressions</h1> + <p>This is an algebraic expression → <span id="m0"></span>. You can turn that into a quadratic equation.</p> + <span id="m1"></span> + <script> + const m0 = document.getElementById("m0"); + const m1 = document.getElementById("m1"); + + katex.render(String.raw`(x + 5)(x + 7)`, m0, { + throwOnError: false + }); + katex.render(String.raw` + \begin{aligned} + (x + 5)(x + 7) &= x^2 + 5x + 7x + 35&\\ + &= x^2 + 12x + 35&\larr\textnormal{quadratic equation 😱😱} + \end{aligned} + `, m1, { + throwOnError: true + }); + </script> + <h1 id="all-about-roots">Quadratic Equation's Root Operations</h1> + <h2 id="finding-qe">Finding Quadratic Equation with Roots</h2> + <p>You can use the formula below to find a Quadratic Equation with 2 roots.</p> + <span id="m2"></span><span>, where <span class=math-font>x<sub>1, 2</sub></span> are the roots.</span><br> + <p> + <strong>Example:</strong><br><br> + <span id="m3"></span> + </p> + <script> + const m2 = document.getElementById("m2"); + const m3 = document.getElementById("m3"); + + katex.render(String.raw`(x - x_1)(x - x_2) = 0`, m2, { + throwOnError: false + }); + katex.render(String.raw` + \begin{aligned} + (x - x_1)(x - x_2) &= 0\\ + (x - (-3))(x - 4) &= 0\\ + (x + 3))(x - 4) &= 0\\ + x^2 - 4x + 3x - 12 &= 0\\ + x^2 - x - 12 &= 0 + \end{aligned} + `, m3, { + throwOnError: true + }); + </script> + <h2 id="operations">Quadratic Root's Mathematical Operations</h2> + <h3 id="operations--formulas">Formulas</h3> + <p id="m4"></p> + <p id="m5"></p> + <h3 id="operations--examples">Examples</h3> + <ol> + <li> + <p>Diketahui persamaan kuadrat <span id="q1"></span>, memiliki akar-akar persamaan kuadrat <span class="math-font">x<sub>1</sub></span> dan <span class="math-font">x<sub>2</sub></span>. Jika <span class="math-font">x<sub>1</sub> < x<sub>2</sub></span>, maka tentukan: + <ol type="a"> + <li><span class="math-font">x<sub>1</sub> + x<sub>2</sub></span></li> + <li><span class="math-font">x<sub>1</sub> × x<sub>2</sub></span></li> + </ol> + </p> + <hr> + <ol type="a"> + <li><span id="a1"></span></li> + <li><span id="a2"></span></li> + </ol> + </li> + </ol> + <script> + const m4 = document.getElementById("m4"); + const m5 = document.getElementById("m5"); + const q1 = document.getElementById("q1"); + const a1 = document.getElementById("a1"); + const a2 = document.getElementById("a2"); + + katex.render(String.raw`x_1 + x_2 = \dfrac{-b}{a}`, m4, { + throwOnError: false + }); + katex.render(String.raw`x_1 \times x_2 = \dfrac{c}{a}`, m5, { + throwOnError: false + }); + katex.render(String.raw`2x^2 + 7x + 3 = 0`, q1, { + throwOnError: false + }); + katex.render(String.raw` + \begin{aligned} + x_1 + x_2 &= \dfrac{-b}{a}\\ + &= \dfrac{-7}{2}\\ + \end{aligned} + `, a1, { + throwOnError: true + }); + katex.render(String.raw` + \begin{aligned} + x_1 \times x_2 &= \dfrac{c}{a}\\ + &= \dfrac{3}{2}\\ + \end{aligned} + `, a2, { + throwOnError: true + }); + </script> + <h1>References</h1> + <ol> + <li id="reference-1" tabindex="-1">Quadratic Equation - The English Wikipedia, <a + href="https://en.wikipedia.org/wiki/Quadratic_equation" + class="link">https://en.wikipedia.org/wiki/Quadratic_equation</a></li> + </li> </section> </div> @@ -103,6 +103,15 @@ table { border-radius: 15px; } +li:focus { + background-color: rgba(103, 164, 255, 0.2); +} + +.math-font { + font-family: KaTeX_Math; + font-size: larger; +} + .link { padding-left: 5px; padding-right: 5px; @@ -230,7 +239,7 @@ img { .divider { margin-top: 25px; margin-bottom: 25px; - border: 1px solid var(--black-color-3); + border: 1px solid var(--white-accent-bg); } .align-center { @@ -507,7 +516,7 @@ sup>sup { font-size: smaller; } -.root::before { +.sroot::before { /* i renamed this because of KaTeX. sroot stands for self-root */ content: "√"; margin-left: calc(-1ch - 5px + 1.5px); font-size: x-large; @@ -515,7 +524,7 @@ sup>sup { display: inline-block; } -.root { +.sroot { display: inline-block; margin-top: 3px; margin-left: 1.15ch; @@ -546,7 +555,7 @@ sup>sup { } #img-school { - background-image: url(https://smpia25.al-azhar.sch.id/wp-content/uploads/2022/09/slide-SMPIA_25-1.jpg); + background-image: url(/assets/images/hero/altaz.jpg); background-position: center; background-repeat: no-repeat; filter: brightness(80%); |
