diff options
author | altaf-creator <athaalaa@gmail.com> | 2023-07-30 20:23:36 +0700 |
---|---|---|
committer | altaf-creator <athaalaa@gmail.com> | 2023-07-30 20:23:36 +0700 |
commit | 81505edfecaea10fab2d68247a7b99645286a54f (patch) | |
tree | e4598fc783db6cedbcc99f2dd09f9cadaa583594 /lessons/biologi | |
parent | 1efbdf493533ad11f4a961f1ec9759e8cfd14a96 (diff) |
Changed homepage, improved css and added roots, new notes (some not finished yet)
Diffstat (limited to 'lessons/biologi')
-rw-r--r-- | lessons/biologi/chapter/note.html | 130 | ||||
-rw-r--r-- | lessons/biologi/index.html | 5 | ||||
-rw-r--r-- | lessons/biologi/reproduction/introduction.html | 95 | ||||
-rw-r--r-- | lessons/biologi/reproduction/video-demonstrasi-proses-reproduksi.html | 17 |
4 files changed, 115 insertions, 132 deletions
diff --git a/lessons/biologi/chapter/note.html b/lessons/biologi/chapter/note.html deleted file mode 100644 index 5a31626..0000000 --- a/lessons/biologi/chapter/note.html +++ /dev/null @@ -1,130 +0,0 @@ -<!DOCTYPE html> -<html lang="en"> -<head> - <meta charset="UTF-8"> - <meta http-equiv="X-UA-Compatible" content="IE=edge"> - <meta name="viewport" content="width=device-width, initial-scale=1.0"> - <link rel="stylesheet" href="/style.css"> - <link rel="icon" href="/assets/images/master.png"> - <title>Al Azhar 9th Grade Lesson Notes</title> - <link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png"> - <link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png"> - <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> -</head> -<body> - <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" id="backbtn"><i class="fa-solid fa-chevron-left"></i></a> - <div id="console"></div> - <div id="sidebar"> - <a href="/index.html"> - <img src="/assets/images/master.png" alt="" class="sidebar-logo"> - </a> - <h3 id="title" class="align-center">Al Azhar 9th Grade Lesson Notes</h3> - <hr class="divider"> - <a href="/about/author.html" class="sidebar-link link">About the Author</a> - <a href="/about/school.html" class="sidebar-link link">About School</a> - <a href="/lessons" class="sidebar-link link">Lessons</a> - - <hr class="divider"> - <div id="toc"> - <h4>Table of Contents</h4> - </div> - </div> - - <div class="banner-container" id="banner"> - <div class="banner-bg" id="img-supplies"></div> - <h1 class="banner-text" id="banner-txt">Lesson 1: Bab 1 - Materi 1</h1> - </div> - - <div id="main"> - <section> - <h1 id="heading1">Heading 1</h1> - <p> - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas eleifend ligula ut mi hendrerit scelerisque. Vivamus ut orci mi. Quisque in mollis lectus, in varius ante. Nunc id aliquet nisl. Donec velit lorem, dignissim vitae aliquet quis, dapibus tincidunt mauris. Nullam quis volutpat est. Aliquam erat volutpat. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Proin sed vehicula mauris. Maecenas vitae elementum lacus. - </p> - <h1 id="heading2">Heading 2</h1> - <h2 id="subheading1">Sub Heading 1</h2> - <p> - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas eleifend ligula ut mi hendrerit scelerisque. Vivamus ut orci mi. Quisque in mollis lectus, in varius ante. Nunc id aliquet nisl. Donec velit lorem, dignissim vitae aliquet quis, dapibus tincidunt mauris. Nullam quis volutpat est. Aliquam erat volutpat. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Proin sed vehicula mauris. Maecenas vitae elementum lacus. - </p> - <h2 id="subheading2">Sub Heading 2</h2> - <p> - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas eleifend ligula ut mi hendrerit scelerisque. Vivamus ut orci mi. Quisque in mollis lectus, in varius ante. Nunc id aliquet nisl. Donec velit lorem, dignissim vitae aliquet quis, dapibus tincidunt mauris. Nullam quis volutpat est. Aliquam erat volutpat. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Proin sed vehicula mauris. Maecenas vitae elementum lacus. - </p> - <h1 id="heading1">Heading 1</h1> - <p> - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas eleifend ligula ut mi hendrerit scelerisque. Vivamus ut orci mi. Quisque in mollis lectus, in varius ante. Nunc id aliquet nisl. Donec velit lorem, dignissim vitae aliquet quis, dapibus tincidunt mauris. Nullam quis volutpat est. Aliquam erat volutpat. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Proin sed vehicula mauris. Maecenas vitae elementum lacus. - </p><h1 id="heading1">Heading 1</h1> - <p> - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas eleifend ligula ut mi hendrerit scelerisque. Vivamus ut orci mi. Quisque in mollis lectus, in varius ante. Nunc id aliquet nisl. Donec velit lorem, dignissim vitae aliquet quis, dapibus tincidunt mauris. Nullam quis volutpat est. Aliquam erat volutpat. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Proin sed vehicula mauris. Maecenas vitae elementum lacus. - </p> - <h1 id="heading2">Heading 2</h1> - <h2 id="subheading1">Sub Heading 1</h2> - <p> - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas eleifend ligula ut mi hendrerit scelerisque. Vivamus ut orci mi. Quisque in mollis lectus, in varius ante. Nunc id aliquet nisl. Donec velit lorem, dignissim vitae aliquet quis, dapibus tincidunt mauris. Nullam quis volutpat est. Aliquam erat volutpat. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Proin sed vehicula mauris. Maecenas vitae elementum lacus. - </p> - <h2 id="subheading2">Sub Heading 2</h2> - <p> - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas eleifend ligula ut mi hendrerit scelerisque. Vivamus ut orci mi. Quisque in mollis lectus, in varius ante. Nunc id aliquet nisl. Donec velit lorem, dignissim vitae aliquet quis, dapibus tincidunt mauris. Nullam quis volutpat est. Aliquam erat volutpat. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Proin sed vehicula mauris. Maecenas vitae elementum lacus. - </p> - <h1 id="heading1">Heading 1</h1> - <p> - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas eleifend ligula ut mi hendrerit scelerisque. Vivamus ut orci mi. Quisque in mollis lectus, in varius ante. Nunc id aliquet nisl. Donec velit lorem, dignissim vitae aliquet quis, dapibus tincidunt mauris. Nullam quis volutpat est. Aliquam erat volutpat. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Proin sed vehicula mauris. Maecenas vitae elementum lacus. - </p><h1 id="heading1">Heading 1</h1> - <p> - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas eleifend ligula ut mi hendrerit scelerisque. Vivamus ut orci mi. Quisque in mollis lectus, in varius ante. Nunc id aliquet nisl. Donec velit lorem, dignissim vitae aliquet quis, dapibus tincidunt mauris. Nullam quis volutpat est. Aliquam erat volutpat. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Proin sed vehicula mauris. Maecenas vitae elementum lacus. - </p> - <h1 id="heading2">Heading 2</h1> - <h2 id="subheading1">Sub Heading 1</h2> - <p> - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas eleifend ligula ut mi hendrerit scelerisque. Vivamus ut orci mi. Quisque in mollis lectus, in varius ante. Nunc id aliquet nisl. Donec velit lorem, dignissim vitae aliquet quis, dapibus tincidunt mauris. Nullam quis volutpat est. Aliquam erat volutpat. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Proin sed vehicula mauris. Maecenas vitae elementum lacus. - </p> - <h2 id="subheading2">Sub Heading 2</h2> - <p> - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas eleifend ligula ut mi hendrerit scelerisque. Vivamus ut orci mi. Quisque in mollis lectus, in varius ante. Nunc id aliquet nisl. Donec velit lorem, dignissim vitae aliquet quis, dapibus tincidunt mauris. Nullam quis volutpat est. Aliquam erat volutpat. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Proin sed vehicula mauris. Maecenas vitae elementum lacus. - </p> - <h1 id="heading1">Heading 1</h1> - <p> - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas eleifend ligula ut mi hendrerit scelerisque. Vivamus ut orci mi. Quisque in mollis lectus, in varius ante. Nunc id aliquet nisl. Donec velit lorem, dignissim vitae aliquet quis, dapibus tincidunt mauris. Nullam quis volutpat est. Aliquam erat volutpat. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Proin sed vehicula mauris. Maecenas vitae elementum lacus. - </p><h1 id="heading1">Heading 1</h1> - <p> - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas eleifend ligula ut mi hendrerit scelerisque. Vivamus ut orci mi. Quisque in mollis lectus, in varius ante. Nunc id aliquet nisl. Donec velit lorem, dignissim vitae aliquet quis, dapibus tincidunt mauris. Nullam quis volutpat est. Aliquam erat volutpat. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Proin sed vehicula mauris. Maecenas vitae elementum lacus. - </p> - <h1 id="heading2">Heading 2</h1> - <h2 id="subheading1">Sub Heading 1</h2> - <p> - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas eleifend ligula ut mi hendrerit scelerisque. Vivamus ut orci mi. Quisque in mollis lectus, in varius ante. Nunc id aliquet nisl. Donec velit lorem, dignissim vitae aliquet quis, dapibus tincidunt mauris. Nullam quis volutpat est. Aliquam erat volutpat. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Proin sed vehicula mauris. Maecenas vitae elementum lacus. - </p> - <h2 id="subheading2">Sub Heading 2</h2> - <p> - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas eleifend ligula ut mi hendrerit scelerisque. Vivamus ut orci mi. Quisque in mollis lectus, in varius ante. Nunc id aliquet nisl. Donec velit lorem, dignissim vitae aliquet quis, dapibus tincidunt mauris. Nullam quis volutpat est. Aliquam erat volutpat. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Proin sed vehicula mauris. Maecenas vitae elementum lacus. - </p> - <h1 id="heading1">Heading 1</h1> - <p> - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas eleifend ligula ut mi hendrerit scelerisque. Vivamus ut orci mi. Quisque in mollis lectus, in varius ante. Nunc id aliquet nisl. Donec velit lorem, dignissim vitae aliquet quis, dapibus tincidunt mauris. Nullam quis volutpat est. Aliquam erat volutpat. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Proin sed vehicula mauris. Maecenas vitae elementum lacus. - </p><h1 id="heading1">Heading 1</h1> - <p> - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas eleifend ligula ut mi hendrerit scelerisque. Vivamus ut orci mi. Quisque in mollis lectus, in varius ante. Nunc id aliquet nisl. Donec velit lorem, dignissim vitae aliquet quis, dapibus tincidunt mauris. Nullam quis volutpat est. Aliquam erat volutpat. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Proin sed vehicula mauris. Maecenas vitae elementum lacus. - </p> - <h1 id="heading2">Heading 2</h1> - <h2 id="subheading1">Sub Heading 1</h2> - <p> - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas eleifend ligula ut mi hendrerit scelerisque. Vivamus ut orci mi. Quisque in mollis lectus, in varius ante. Nunc id aliquet nisl. Donec velit lorem, dignissim vitae aliquet quis, dapibus tincidunt mauris. Nullam quis volutpat est. Aliquam erat volutpat. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Proin sed vehicula mauris. Maecenas vitae elementum lacus. - </p> - <h2 id="subheading2">Sub Heading 2</h2> - <p> - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas eleifend ligula ut mi hendrerit scelerisque. Vivamus ut orci mi. Quisque in mollis lectus, in varius ante. Nunc id aliquet nisl. Donec velit lorem, dignissim vitae aliquet quis, dapibus tincidunt mauris. Nullam quis volutpat est. Aliquam erat volutpat. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Proin sed vehicula mauris. Maecenas vitae elementum lacus. - </p> - <h1 id="heading1">Heading 1</h1> - <p> - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas eleifend ligula ut mi hendrerit scelerisque. Vivamus ut orci mi. Quisque in mollis lectus, in varius ante. Nunc id aliquet nisl. Donec velit lorem, dignissim vitae aliquet quis, dapibus tincidunt mauris. Nullam quis volutpat est. Aliquam erat volutpat. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Proin sed vehicula mauris. Maecenas vitae elementum lacus. - </p> - </section> - </div> - - <script src="/scripts/toc.js"></script> - <script src="/scripts/sidebar.js"></script> -</body> -</html>
\ No newline at end of file diff --git a/lessons/biologi/index.html b/lessons/biologi/index.html index 2c3bf1b..5c6ed07 100644 --- a/lessons/biologi/index.html +++ b/lessons/biologi/index.html @@ -39,8 +39,9 @@ </div> <div id="main"> - <section> - <p style="text-align: center; width: 100%;"><i class="fa-solid fa-file-circle-question"></i> Hm. It seems like there is nothing here yet.</p> + <section> + <h1 id="chapter1">Chapter 1 - Reproduction System</h1> + <p><a href="reproduction/introduction.html" class="link">Reproduction System: Introduction</a></p> </section> </div> diff --git a/lessons/biologi/reproduction/introduction.html b/lessons/biologi/reproduction/introduction.html new file mode 100644 index 0000000..a478e49 --- /dev/null +++ b/lessons/biologi/reproduction/introduction.html @@ -0,0 +1,95 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <meta http-equiv="X-UA-Compatible" content="IE=edge"> + <meta name="viewport" content="width=device-width, initial-scale=1.0"> + <link rel="stylesheet" href="/style.css"> + <link rel="icon" href="/assets/images/master.png"> + <title>Al Azhar 9th Grade Lesson Notes</title> + <link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png"> + <link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png"> + <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> +</head> +<body> + <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" id="backbtn"><i class="fa-solid fa-chevron-left"></i></a> + <div id="console"></div> + <div id="sidebar"> + <a href="/index.html"> + <img src="/assets/images/master.png" alt="" class="sidebar-logo"> + </a> + <h3 id="title" class="align-center">Al Azhar 9th Grade Lesson Notes</h3> + <hr class="divider"> + <a href="/about/author.html" class="sidebar-link link">About the Author</a> + <a href="/about/school.html" class="sidebar-link link">About School</a> + <a href="/lessons" class="sidebar-link link">Lessons</a> + + <hr class="divider"> + <div id="toc"> + <h4>Table of Contents</h4> + </div> + </div> + + <div class="banner-container" id="banner"> + <div class="banner-bg" id="img-supplies"></div> + <h1 class="banner-text" id="banner-txt">Reproduction System: Introduction</h1> + </div> + + <div id="main"> + <section> + <div class="highlight"> + <i class="fa-regular fa-face-meh" style="font-size: x-large;"></i> + <span>Stop.</span> + </div> + <h1 id="definition">Definition</h1> + <p>The Reproduction System is the human's effort to preserve its kind.</p> + <h1 id="male">Male Reproduction System</h1> + <h2 id="male--tracts">Tracts</h2> + <ol> + <li><strong>Epididymis</strong>: for sperm maturing</li> + <li>Vas Deferens</li> + <li>Urethra</li> + <li>Penis</li> + </ol> + <h2 id="male--glands">Glands</h2> + <ol> + <li><strong>Testis</strong>: producing spermatozoa</li> + <li><strong>Seminal Vesicle</strong>: producing food</li> + <li><strong>Bulbourethral / Cowpery</strong>: producing mucus</li> + <li><strong>Prostate</strong>: producing alkali (bases) for neutralizing</li> + </ol> + <h1 id="female">Female Reproduction System</h1> + <h2 id="female--tracts">Tracts</h2> + <ol> + <li><strong>Uterus</strong>: growing embryo</li> + <li><strong>Cervix</strong>: sperm entry</li> + <li><strong>Vagina</strong>: outside</li> + </ol> + <h2 id="female--glands">Glands</h2> + <ol> + <li><strong>Ovary</strong>: producing ovum</li> + <h3>Processes</h3> + <ol> + <li><strong>Ovulation</strong>: the release of ovum</li> + <li><strong>Oviduct</strong>: fertilization of ovum</li> + </ol> + </ol> + <h1 id="hormone">Female Hormones</h1> + <ol> + <li><strong>FSH</strong>: Follicle Stimulating Hormon<br>For controlling menstruation and ovum development</li> + <li><strong>LH</strong>: Luteinezing Hormon<br>For ovulation</li> + <li><strong>Esterogen</strong><br>For thickening uterus wall and menstruation control</li> + <li><strong>Progresteron</strong><br>For maintaining pregnancy</li> + </ol> + <h3>VIDEO DEMONSTRASI SISTEM REPRODUKSI MANUSIA</h1> + <a href="video-demonstrasi-proses-reproduksi.html" class="link">Klik disini untuk membuka!</a> + </section> + </div> + + <script src="/scripts/toc.js"></script> + <script src="/scripts/sidebar.js"></script> +</body> +</html>
\ No newline at end of file diff --git a/lessons/biologi/reproduction/video-demonstrasi-proses-reproduksi.html b/lessons/biologi/reproduction/video-demonstrasi-proses-reproduksi.html new file mode 100644 index 0000000..c11f53b --- /dev/null +++ b/lessons/biologi/reproduction/video-demonstrasi-proses-reproduksi.html @@ -0,0 +1,17 @@ +<h1 id="heading">Demonstrasi Proses Reproduksi (Manusia)</h1> +<p id="text">For education purposes (explicit content warning)</p> +<video id="video" width="1280" height="720" controls> + <source src="/assets/videos/video.mp4" type="video/mp4"> + Your browser does not support the video tag. +</video> + +<script> + const video = document.getElementById("video"); + const text = document.getElementById("text"); + const heading = document.getElementById("heading"); + + video.addEventListener("play", (event) => { + text.innerHTML = "get rickrolled lol<br><a href='introduction.html'>(click here to go back)</a>"; + heading.innerHTML = "Shame on you."; + }); +</script>
\ No newline at end of file |