Merge branch 'main' of https://github.com/amantaphelix/FoodiesWeb

package.json

@@ -4,13 +4,17 @@
   "private": true,
   "dependencies": {
     "@emailjs/browser": "^4.3.3",
+    "@emotion/react": "^11.11.4",
+    "@emotion/styled": "^11.11.5",
+    "@mui/material": "^5.16.1",
     "@react-icons/all-files": "^4.1.0",
     "@testing-library/jest-dom": "^5.17.0",
     "@testing-library/react": "^13.4.0",
     "@testing-library/user-event": "^13.5.0",
     "aos": "^2.3.4",
     "axios": "^1.5.1",
-    "framer-motion": "^11.1.9",
+    "clsx": "^2.1.1",
+    "framer-motion": "^11.3.2",
     "jwt-decode": "^4.0.0",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
@@ -22,6 +26,7 @@
     "react-scripts": "5.0.1",
     "react-spinners": "^0.13.8",
     "react-toastify": "^9.1.3",
+    "tailwind-merge": "^2.4.0",
     "web-vitals": "^2.1.4"
   },
   "scripts": {

server/controllers/feedbackController.js

@@ -0,0 +1,18 @@
+const asyncHandler = require('express-async-handler');
+const Feedback = require("../models/studentfeeback");
+
+const submitFeedback = asyncHandler(async (req, res) => {
+  const { message, canteenId ,userId} = req.body;
+
+
+  if (!message || !canteenId) {
+    res.status(400);
+    throw new Error('Message and Canteen ID are required');
+  }
+
+  const feedback = new Feedback({ message, canteenId, userId });
+  await feedback.save();
+  res.status(201).json({ message: 'Feedback submitted successfully' });
+});
+
+module.exports = { submitFeedback };

server/models/studentfeeback.js

@@ -0,0 +1,11 @@
+const mongoose = require('mongoose');
+const Schema = mongoose.Schema;
+
+const studentfeedbackSchema = new Schema({
+  message: { type: String, required: true },
+  canteenId: { type: mongoose.Schema.Types.ObjectId, ref: 'Canteen', required: true },
+  userId: { type: mongoose.Schema.Types.ObjectId, ref: 'User', required: true },
+  createdAt: { type: Date, default: Date.now }
+});
+
+module.exports = mongoose.model('StudentFeedback', studentfeedbackSchema );

server/routes/student.js

@@ -2,6 +2,7 @@ const express = require("express");
 const { auth, studentAuth, isCanteen } = require("../middlewares/auth");
 const router = express.Router();
 const authController = require("../controllers/Auth");
+const feedbackController = require("../controllers/feedbackController");
 
 router.post("/studentSignup", authController.studentSignup);
 router.post("/studentLogin", authController.studentLogin);
@@ -12,6 +13,8 @@ router.get("/resetPassword/:id/:token", authController.verifyLink);
 router.post("/newPassword/:id/:token", authController.resetPassword);
 router.get("/studentLogout", studentAuth, authController.studentLogout);
 router.get("/canteenLogout", auth, authController.canteenLogout);
+router.post('/submitFeedback', feedbackController.submitFeedback);
+
 router.post(
   "/changeStudentPassword",
   studentAuth,

src/App.js

@@ -1,4 +1,4 @@
-import React from "react";
+import React, { useEffect, useState } from "react";
 import "./App.css";
 import { Route, Routes, Navigate } from "react-router-dom";
 import Home from "./pages/Home";
@@ -18,31 +18,56 @@ import ContactUs from "./pages/ContactUs";
 import EditProfile from "./pages/EditProfile";
 import OtpVerify from "./pages/OtpVerify";
 
+import { Contributors } from "./pages/Contributors";
+import Navbar from "./components/Navbar";
+
+
+import Newss from "./components/Blog/newss";
+
+
 const Layout = ({ children }) => {
   return (
-    <div className="bg-cover bg-center min-h-screen bg-gradient-to-t from-blue-950 via-blue-950 to-gray-900 bg-no-repeat dark:bg-none">
+    <div className="bg-cover bg-center min-h-screen bg-gradient-to-t from-blue-950 via-blue-950 to-gray-900 bg-no-repeat dark:bg-none ">
       {children}
     </div>
   );
 };
 
 function App() {
+
+  const [preloader , setPreloader] = useState(false)
   const usertoken = localStorage.getItem("usertoken");
   const token = localStorage.getItem("token");
   const canteenId = localStorage.getItem("canteenId");
   const hasAnyToken = token || usertoken;
 
+  useEffect(() =>{
+
+    const t = setTimeout(() => {
+    setPreloader(true)
+  }, 0);
+
+  return () => clearTimeout(t)
+
+  },[])
+
   // Check if either token is undefined and redirect to login if true
   if (usertoken === undefined || token === undefined) {
     localStorage.removeItem("usertoken");
     localStorage.removeItem("token");
     window.location.href = "/login"; // Redirect to login page
     return null; // Render nothing else
   }
+
+
+
+
+
 
   return (
     <ThemeProvider>
-      <div className="">
+    {!preloader  ? <Loader />  :  <div className="">
+
         <Routes>
           <Route path="/" element={<Login />} />
           <Route path="/forgotPassword" element={<ForgotPassword />} />
@@ -156,7 +181,7 @@ function App() {
               path="/news"
               element={
                 <Layout>
-                  <News />
+                  <Newss />
                 </Layout>
               }
             />
@@ -181,6 +206,15 @@ function App() {
               </Layout>
             }
           />
+          <Route
+            path="/contributors"
+            element={
+              <Layout>
+                <Contributors />
+              </Layout>
+            }
+          />
+
 
           <Route
             path="*"
@@ -191,7 +225,7 @@ function App() {
             }
           />
         </Routes>
-      </div>
+      </div>}
     </ThemeProvider>
   );
 }

src/components/Blog/newss.css

@@ -0,0 +1,130 @@
+.BlogpageContainer_main{
+    background-color: var(--color-background);
+
+  }
+  .BlogpageContainer {
+    max-width: 1300px;
+    margin: auto;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+  }
+
+  .BlogpageContainer_main .header {
+    text-align: left;
+    background-color: var(--color-primary);
+    opacity: 0.9;
+    width: 100%;
+    margin-bottom: 45px;
+    margin-top: 120px;
+    padding: 0px 20px;
+    display: flex;
+    align-items: center;
+    justify-content: flex-start;
+
+
+
+  }
+  .BlogpageContainer_main .header h1 {
+    font-size: 2.5em;
+    width: 100%;
+   text-align: center;
+    max-width: 1300px;
+    margin: auto;
+    font-weight: 700;
+    color: var(--color-text-primary);
+  }
+  .BlogpageContainer .container {
+    display: flex;
+    flex-wrap: wrap;
+    padding: 0px 20px;
+    justify-content: space-around;
+    gap: 20px;
+    margin-bottom: 60px;
+  }
+
+  .BlogpageContainer .card {
+    background: white;
+    border-radius: 10px;
+    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
+    overflow: hidden;
+    width: calc(33% - 40px);
+    /* max-width: 300px; */
+    min-height: 300px;
+    margin: 10px;
+    cursor: pointer;
+    transition: transform 0.2s;
+  }
+
+  .BlogpageContainer .card:hover {
+    transform: translateY(-10px);
+  }
+
+  .BlogpageContainer .image {
+    width: 100%;
+    height: 150px;
+    object-fit: cover;
+  }
+
+  .BlogpageContainer .content1 {
+    padding: 15px;
+  }
+
+  .BlogpageContainer .content1 h2 {
+    display: -webkit-box;
+    -webkit-box-orient: vertical;
+    -webkit-line-clamp: 2;
+
+    overflow: hidden;
+    text-overflow: ellipsis;
+    font-weight: 600;
+      font-size: 1.5em;
+      margin: 0 0 10px 0;
+      transition: all 0.3s ease-in-out;
+  }
+  .BlogpageContainer .content1 h2:hover {
+    text-decoration: underline;
+  }
+
+  .BlogpageContainer .content1 p {
+    color: gray;
+    margin: 0;
+  }
+
+  /* Responsive styles */
+  @media (max-width: 1200px) {
+    .BlogpageContainer .card {
+      width: calc(33.33% - 40px); /* 3 cards per row */
+    }
+    .BlogpageContainer_main .header h1 {
+      font-size: 2rem;
+    }
+  }
+
+  @media (max-width: 900px) {
+    .BlogpageContainer_main .header h1 {
+      font-size: 1.75rem;
+    }
+    .BlogpageContainer .card {
+      width: calc(50% - 40px); /* 2 cards per row */
+    }
+  }
+
+  @media (max-width: 600px) {
+    .BlogpageContainer_main .header h1 {
+      font-size: 1.5rem;
+    }
+    .BlogpageContainer .container {
+      gap: 10px;
+    }
+    .BlogpageContainer .content1 h2 {
+      font-size: 0.9em;
+    }
+    .BlogpageContainer .content1 p {
+      font-size: 0.7em;
+    }
+    .BlogpageContainer .card {
+      width: 100%; /* 1 card per row */
+      min-height: auto;
+    }
+  }