Added Bookmark & Fixed BG Color

frontend/src/App.jsx

@@ -6,6 +6,7 @@ import Header from "./components/Header/Header";
 import LoginPage from "./pages/LoginPage";
 import Register from "./pages/Register";
 import Dashboard from "./pages/Dashboard";
+import Bookmark from "./pages/Bookmark";
 
 function App() {
   return (
@@ -16,6 +17,7 @@ function App() {
         <Route path="/login" element={<LoginPage/>} />
         <Route path="/register" element={<Register/>} />
         <Route path="dashboard" element={<Dashboard/>} />
+        <Route path="bookmark" element={<Bookmark/>} />
       </Routes>
     </BrowserRouter>
   );

frontend/src/pages/Bookmark.jsx

@@ -0,0 +1,58 @@
+// BookmarkPage.js
+import React from "react";
+
+const dummyBookmarks = [
+  {
+    id: 1,
+    title: "Favorite Programming Language?",
+    description: "Vote for your favorite programming language among the listed options.",
+  },
+  {
+    id: 2,
+    title: "Best Framework for Web Development?",
+    description: "Share your thoughts on the best framework for web development.",
+  },
+  {
+    id: 3,
+    title: "Favorite Food?",
+    description: "What's your favorite food? Vote and see the results.",
+  },
+];
+
+function Bookmark() {
+  return (
+    <div className="p-6 bg-base-200 h-screen">
+      <h1 className="text-4xl font-bold text-white mb-6">Bookmarked Polls</h1>
+      <div className="overflow-x-auto">
+        <table className="table w-full bg-base-100">
+          <thead>
+            <tr>
+              <th>#</th>
+              <th>Title</th>
+              <th>Description</th>
+              <th>Actions</th>
+            </tr>
+          </thead>
+          <tbody>
+            {dummyBookmarks.map((bookmark, index) => (
+              <tr key={bookmark.id}>
+                <th>{index + 1}</th>
+                <td className="text-white">{bookmark.title}</td>
+                <td className="text-gray-400 whitespace-normal break-words max-w-xs">
+                  {bookmark.description}
+                </td>
+                <td>
+                  <button className="btn btn-primary">
+                    View Poll
+                  </button>
+                </td>
+              </tr>
+            ))}
+          </tbody>
+        </table>
+      </div>
+    </div>
+  );
+}
+
+export default Bookmark;

frontend/src/pages/Dashboard.jsx

@@ -13,7 +13,7 @@ function Dashboard() {
   ];
 
   return (
-    <div className="flex flex-col lg:flex-row min-h-screen">
+    <div className="flex flex-col lg:flex-row min-h-screen bg-base-200">
       {showPollAddForm && (
         <div className="fixed inset-0 bg-gray-800 bg-opacity-75 flex items-center justify-center z-50">
           {/* Poll Add Form Component would go here */}
@@ -21,7 +21,7 @@ function Dashboard() {
       )}
 
       {/* User Profile Sidebar */}
-      <aside className="w-full lg:w-1/4 bg-slate-800 rounded-md mx-4 bg-opacity-50 shadow-lg p-4 flex flex-col items-center">
+      <aside className="w-full lg:w-1/4 bg-slate-800 rounded-md m-4 bg-opacity-50 shadow-lg p-4 flex flex-col items-center">
         <img
           src="https://via.placeholder.com/150" // Replace with actual path
           alt="User Profile"

frontend/src/pages/LoginPage.jsx

@@ -3,7 +3,7 @@ import React from 'react';
 
 const LoginPage = () => {
   return (
-    <div className="flex justify-center  p-4">
+    <div className="flex justify-center bg-base-200 h-screen  p-4">
       <div className="w-full max-w-md  rounded-lg  p-8">
         <h2 className="text-2xl font-semibold text-center text-white mb-6">Login</h2>
         

frontend/src/pages/Register.jsx

@@ -2,7 +2,7 @@ import React from "react";
 
 function Register() {
   return (
-    <div className=" flex justify-center p-4">
+    <div className=" flex justify-center h-screen bg-base-200 p-4">
       <div className="w-full max-w-md  rounded-lg ">
         <h2 className="text-2xl font-semibold text-center text-white mb-6">
           Sign Up