-
-
-
- Get started by editing
- src/app/page.tsx
-
-
- By{' '}
-
-
-
-
-
-
- ) => {
+ setSearchQuery(evt.target.value);
+ // showResult(searchQuery)
+ };
+
+ return (
+
+ );
+}
diff --git a/src/components/TopBar.module.scss b/src/components/TopBar.module.scss
new file mode 100644
index 0000000..3022a8a
--- /dev/null
+++ b/src/components/TopBar.module.scss
@@ -0,0 +1,63 @@
+.topBar {
+ position: sticky;
+ top: 0px;
+
+ background-color: var(--accent-1);
+
+ .container {
+ display: flex;
+ }
+
+ .spacer {
+ flex-grow: 1;
+ }
+
+ .leftHalf,
+ .rightHalf {
+ display: flex;
+ }
+
+ .searchResults {
+ display: block;
+ }
+
+ .username {
+ color: white;
+ }
+}
+
+.homeLink {
+ margin-right: 8px;
+ color: white;
+}
+
+.topBarDropDown {
+ display: inline-block;
+ margin: 0px;
+ padding: 0px;
+
+ .dropdownContent {
+ display: none;
+ position: absolute;
+ background-color: #395f5f;
+ min-width: 8rem;
+ z-index: 1;
+
+ a {
+ float: none;
+ color: white;
+ padding: 0.01rem 1rem;
+ text-decoration: none;
+ display: block;
+ text-align: left;
+
+ &:hover {
+ background-color: DarkSlateGrey;
+ }
+ }
+ }
+
+ &:hover .dropdownContent {
+ display: block;
+ }
+}
diff --git a/src/components/TopBar.tsx b/src/components/TopBar.tsx
new file mode 100644
index 0000000..5ce8c5e
--- /dev/null
+++ b/src/components/TopBar.tsx
@@ -0,0 +1,75 @@
+"use client";
+
+import SearchBar from "./SearchBar";
+import styles from "./TopBar.module.scss";
+import classNames from "classnames";
+import { GearIcon } from "@radix-ui/react-icons";
+
+export default function TopBar() {
+ return (
+
- Docs -> -
-Find in-depth information about Next.js features and API.
- - - -- Learn -> -
-Learn about Next.js in an interactive course with quizzes!
- - - -- Templates -> -
-Explore the Next.js 13 playground.
- - - -- Deploy -> -
-- Instantly deploy your Next.js site to a shareable URL with Vercel. -
- +
+
- )
+ );
}
diff --git a/src/components/RatingTable.module.scss b/src/components/RatingTable.module.scss
new file mode 100644
index 0000000..e69de29
diff --git a/src/components/RatingTable.tsx b/src/components/RatingTable.tsx
new file mode 100644
index 0000000..e2e82bf
--- /dev/null
+++ b/src/components/RatingTable.tsx
@@ -0,0 +1,68 @@
+import styles from "./RatingTable.module.scss";
+import { PrismaClient } from "@prisma/client";
+
+export async function getData() {
+ const prisma = new PrismaClient();
+
+ const comments = await prisma.comments.findMany({ take: 20 });
+
+ return { comments };
+}
+
+export default async function RatingTable() {
+ return (
+
+
+
+ );
+}
diff --git a/src/components/SearchBar.tsx b/src/components/SearchBar.tsx
new file mode 100644
index 0000000..c3cc806
--- /dev/null
+++ b/src/components/SearchBar.tsx
@@ -0,0 +1,29 @@
+"use client";
+
+import { ChangeEvent, useState } from "react";
+
+export default function SearchBar() {
+ const [searchQuery, setSearchQuery] = useState("");
+
+ const changeSearchQuery = (evt: ChangeEvent
+
+
+ );
+}
+
+
+
+
+
+
+