From 127405811a6b57318f968f9e94f2df0fcc81ff0c Mon Sep 17 00:00:00 2001
From: Hari Dev <hariharidev5@gmail.com>
Date: Sun, 2 Feb 2025 09:58:07 +0530
Subject: [PATCH] refactor: Optimize imports and adjust Navbar and Post
 component styles for better responsiveness

---
 frontend/src/App.jsx               | 4 ++--
 frontend/src/components/Navbar.jsx | 6 ++++--
 frontend/src/components/Post.jsx   | 6 +++---
 3 files changed, 9 insertions(+), 7 deletions(-)

diff --git a/frontend/src/App.jsx b/frontend/src/App.jsx
index 3029ce2..498926a 100644
--- a/frontend/src/App.jsx
+++ b/frontend/src/App.jsx
@@ -1,5 +1,5 @@
-import React, { Suspense, useEffect, useState } from 'react'
-import { BrowserRouter as Router, Route, Routes, useLocation } from 'react-router-dom'
+import React, { Suspense } from 'react'
+import { Route, Routes, useLocation } from 'react-router-dom'
 import { DarkThemeToggle, Flowbite } from "flowbite-react";
 import Navbar from './components/Navbar'
 import Main from './pages/Main'
diff --git a/frontend/src/components/Navbar.jsx b/frontend/src/components/Navbar.jsx
index f140d16..acf9312 100644
--- a/frontend/src/components/Navbar.jsx
+++ b/frontend/src/components/Navbar.jsx
@@ -33,10 +33,12 @@ const Navbar =  () =>{
 
     return (
         <>
-        <nav className="fixed top-0 left-0 right-0 bg-white shadow-md aleo-regular z-50 select-none">
+        <nav className="fixed top-0 left-0 right-0 bg-white shadow-md aleo-regular z-50 select-none sm:w-auto">
             <div className="container mx-auto px-6 py-3 flex justify-between items-center">
                 <Link to="/" className="text-4xl text-black font-semibold hover:text-indigo-600">TALENTMATCH</Link>
-                <span className="lg:hidden" onClick={handleShowMenu}><MenuRoundedIcon/></span>
+                <span className="lg:hidden" onClick={handleShowMenu}>
+                    <MenuRoundedIcon className="sm:w-8 sm:h-8 md:w-10 md:h-10 lg:w-12 lg:h-12" />
+                </span>
 
                 <div ref={MenuRef} className={`lg:hidden fixed top-0 right-0 bg-white shadow-md p-4 w-64 z-10 transition-all duration-300 ${showMenu ? 'translate-x-0' : 'translate-x-full'}`}>
                     <button className="absolute top-4 right-4" onClick={handleShowMenu}>
diff --git a/frontend/src/components/Post.jsx b/frontend/src/components/Post.jsx
index 42a7284..bd374e4 100644
--- a/frontend/src/components/Post.jsx
+++ b/frontend/src/components/Post.jsx
@@ -25,15 +25,15 @@ const Post = ({ content,name, position,title }) => {
     <div className="h-auto mb-2.5 mx-4 sm:p-3">
      {content}
     </div>
-    <div className="flex items-center gap- mx-4 mt-5">
+    <div className="flex items-center gap-3 mx-4 mt-5">
       <svg className="w-10 h-10 me-3  text-gray-200 dark:text-gray-700" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="currentColor" viewBox="0 0 20 20">
         <path d="M10 0a10 10 0 1 0 10 10A10.011 10.011 0 0 0 10 0Zm0 5a3 3 0 1 1 0 6 3 3 0 0 1 0-6Zm0 13a8.949 8.949 0 0 1-4.951-1.488A3.987 3.987 0 0 1 9 13h2a3.987 3.987 0 0 1 3.951 3.512A8.949 8.949 0 0 1 10 18Z" />
       </svg>
       <div>
-        <div className="w-[57vh] bg-gray-200 font-bold rounded-full dark:bg-gray-700 px-2 mb-2 sm:text-[16px] sm:h-5 sm:w-[30vh]">
+        <div className="w-[57vh] bg-gray-200 font-bold rounded-full dark:bg-gray-700 px-2 mb-2 sm:text-[16px] sm:h-5 sm:w-[24vh]">
           {name}
         </div>
-        <div className=" px-2 font-bold bg-gray-200 rounded-full dark:bg-gray-700 sm:text-[14px] sm:w-[33vh] sm:h-5">
+        <div className=" px-2 font-bold bg-gray-200 rounded-full dark:bg-gray-700 sm:text-[14px] sm:w-[20vh] sm:h-5">
           {position}
         </div>
       </div>