starting with the frontend

react/src/app/components/navbar.js

@@ -6,7 +6,7 @@ import Avatar from "./avatar"
 export default function Navbar() {
 
   return (
-    <nav className="flex justify-between items-center px-4 py-3 bg-gray-800 text-white">
+    <nav className="flex justify-between items-center px-4 py-3 bg-green-800 text-white">
       <Sections/>
       <Avatar/>
     </nav>

react/src/app/components/sections.js

@@ -4,16 +4,16 @@ export default function Sections() {
     return (
       <div className="flex gap-6">
         <Link href="/" className="text-white hover:text-gray-300">
-          BookCrossing
+          Home
         </Link>
         <Link href="/available" className="text-white hover:text-gray-300">
-          Available
+          Recent Exams
         </Link>
         <Link href="/loans" className="text-white hover:text-gray-300">
-          My loans
+          Grades
         </Link>
         <Link href="/owned" className="text-white hover:text-gray-300">
-          My books
+          Exchange Exams
         </Link>
       </div>
     )

react/src/app/globals.css

@@ -2,7 +2,7 @@
 
 :root {
   --background: #ffffff;
-  --foreground: #171717;
+  --foreground: #1a6e2b;
 }
 
 @theme inline {
@@ -14,8 +14,8 @@
 
 @media (prefers-color-scheme: dark) {
   :root {
-    --background: #0a0a0a;
-    --foreground: #ededed;
+    --background: #efeaea;
+    --foreground: #150b0b;
   }
 }
 

react/src/app/page.js

 export default function Home() {
   return (
     <>
-    Welcome to BookCrossing
+    Welcome
     </>
   );
 }