diff --git a/public/Akademik/Back.svg b/public/Akademik/Back.svg new file mode 100644 index 0000000..1836edd --- /dev/null +++ b/public/Akademik/Back.svg @@ -0,0 +1,3 @@ + + + diff --git a/public/Akademik/Book.svg b/public/Akademik/Book.svg new file mode 100644 index 0000000..624f80b --- /dev/null +++ b/public/Akademik/Book.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/public/Akademik/Fis.svg b/public/Akademik/Fis.svg new file mode 100644 index 0000000..d5dbcee --- /dev/null +++ b/public/Akademik/Fis.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/public/Akademik/Indo.svg b/public/Akademik/Indo.svg new file mode 100644 index 0000000..d5dbcee --- /dev/null +++ b/public/Akademik/Indo.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/public/Akademik/Ing.svg b/public/Akademik/Ing.svg new file mode 100644 index 0000000..4776c27 --- /dev/null +++ b/public/Akademik/Ing.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/public/Akademik/Kim.svg b/public/Akademik/Kim.svg new file mode 100644 index 0000000..8f86b0a --- /dev/null +++ b/public/Akademik/Kim.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/public/Akademik/Mat.svg b/public/Akademik/Mat.svg new file mode 100644 index 0000000..2a23739 --- /dev/null +++ b/public/Akademik/Mat.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/public/Akademik/Or.svg b/public/Akademik/Or.svg new file mode 100644 index 0000000..2874794 --- /dev/null +++ b/public/Akademik/Or.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/public/Akademik/Pengkom.svg b/public/Akademik/Pengkom.svg new file mode 100644 index 0000000..89e077e --- /dev/null +++ b/public/Akademik/Pengkom.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/public/Akademik/Prd.svg b/public/Akademik/Prd.svg new file mode 100644 index 0000000..03b6abb --- /dev/null +++ b/public/Akademik/Prd.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/public/Akademik/Right.svg b/public/Akademik/Right.svg new file mode 100644 index 0000000..7067ccf --- /dev/null +++ b/public/Akademik/Right.svg @@ -0,0 +1,3 @@ + + + diff --git a/public/Akademik/Search.svg b/public/Akademik/Search.svg new file mode 100644 index 0000000..8cba00c --- /dev/null +++ b/public/Akademik/Search.svg @@ -0,0 +1,3 @@ + + + diff --git a/public/Akademik/left.svg b/public/Akademik/left.svg new file mode 100644 index 0000000..9bf7b30 --- /dev/null +++ b/public/Akademik/left.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/app/akademik/MatematikaIIA/page.tsx b/src/app/akademik/MatematikaIIA/page.tsx new file mode 100644 index 0000000..0a00e55 --- /dev/null +++ b/src/app/akademik/MatematikaIIA/page.tsx @@ -0,0 +1,142 @@ +"use client"; +import React, { useState, useEffect } from "react"; +import Image from "next/image"; +import Navbar from "@/components/Navbar"; +import Footer from "@/components/Footer"; +import Link from "next/link"; +import AkademikCard from "@/components/AkademikCard"; +import AkademikCard2 from "@/components/AkademikCard2"; + +const Home: React.FC = () => { + const [selectedOption, setSelectedOption] = useState(""); + const [searchTerm, setSearchTerm] = useState(""); + const [filteredContent, setFilteredContent] = useState([]); + + useEffect(() => { + setSelectedOption("Materi"); + }, []); + + // Filter content based on search term and selected option + useEffect(() => { + if (selectedOption === "Materi") { + // Example data + const materiContent = [ + "Catatan Bab 7 Persamaan DIfferensial Orde 1", + "Catatan Bab 7 Persamaan DIfferensial Orde 1", + "Catatan Bab 7 Persamaan DIfferensial Orde 1", + "Catatan Bab 7 Persamaan DIfferensial Orde 1", + "Catatan Bab 7 Persamaan DIfferensial Orde 1", + "Catatan Bab 7 Persamaan DIfferensial Orde 1", + ]; + const filtered = materiContent.filter((heading) => + heading.toLowerCase().includes(searchTerm.toLowerCase()) + ); + setFilteredContent(filtered); + } else { + // Handle other options similarly if needed + setFilteredContent([]); + } + }, [searchTerm, selectedOption]); + + return ( + <> + +
+ {/* Section 1 */} +
+
+ +
+ Back +
+ +

+ Matematika IIA +

+
+ {/* Search Bar */} +
+ setSearchTerm(e.target.value)} + placeholder="Search..." + className="border bg-[#EDECEC] px-3 py-2 rounded-[32px] pl-10 w-full" + /> +
+ My SVG +
+
+ {/* Selection */} +
+ + + +
+ {/* Display Text Based on Selection */} + {selectedOption && ( +
+ {selectedOption === "Materi" && ( +
+ {filteredContent.map((heading, index) => ( + <> +
+ +
+ + ))} +
+ )} + {selectedOption === "Bank Soal" &&

HALO2

} + {selectedOption === "Tutorial" &&

HALO3

} +
+ )} +
+
+