changed font size of select button

src/components/Layout/Header.jsx

@@ -8,16 +8,18 @@ import { useProfile } from "../../hooks/useProfile";
 import { useNavigate } from "react-router-dom";
 import Avatar from "../../components/common/Avatar";
 import { useChangePassword } from "../Context/ChangePasswordContext";
-import {useProjects} from "../../hooks/useProjects";
+import { useProjects } from "../../hooks/useProjects";
-import {useEffect, useState} from "react";
+import { useEffect, useState } from "react";
 const Header = () => {
-  const {profile} = useProfile();
+  const { profile } = useProfile();
   const [selectedProjectId, setSelectedProjectId] = useState("all");
   const dispatch = useDispatch(changeMaster("Job Role"));
   const { data, loading } = useMaster();
   const navigate = useNavigate();
-  const {projects, loading:projectLoading} = useProjects()
+  const { projects, loading: projectLoading } = useProjects();
-  const selectedProject = useSelector((store)=>store. localVariables.projectId)
+  const selectedProject = useSelector(
+    (store) => store.localVariables.projectId
+  );
 
   const getRole = (roles, joRoleId) => {
     if (!Array.isArray(roles)) return "User";
@@ -63,16 +65,12 @@ const Header = () => {
   const handleProfilePage = () => {
     navigate(`/employee/${profile?.employeeInfo?.id}?for=attendance`);
   };
-  const handleProjectselection = (project) =>
+  const handleProjectselection = (project) => {
-  {
+    useDispatch(setProjectId(project.id));
-     useDispatch(setProjectId(project.id))
+    setProject(project);
-    setProject(project)
+  };
-  }
- 
 
-
+  const { openChangePassword } = useChangePassword();
-  const {openChangePassword} = useChangePassword();
-  
 
   return (
     <nav
@@ -93,7 +91,7 @@ const Header = () => {
       >
         {/* Search */}
         <div className=" align-items-center">
-{/* 
+          {/* 
                <li className="nav-item ">
                     <label>
                               <select
@@ -118,22 +116,21 @@ const Header = () => {
                               </select>
                             </label>
           </li> */}
-          
 
           <div className="btn-group">
             <button
-              className="btn btn-outline-primary btn-sm dropdown-toggle"
+              className="btn btn-sm-sm btn-xl dropdown-toggle"
               type="button"
               data-bs-toggle="dropdown"
               aria-expanded="false"
             >
               {selectedProject === " "
                 ? "All Projects"
-                : projects?.find((p) => p?.id === selectedProject)?.name || "Select Project"}
+                : projects?.find((p) => p?.id === selectedProject)?.name ||
+                  "Select Project"}
             </button>
 
             <ul className="dropdown-menu">
-             
               {projects?.map((project) => (
                 <li key={project?.id}>
                   <button
@@ -145,7 +142,7 @@ const Header = () => {
                 </li>
               ))}
             </ul>
-          </div> 
+          </div>
           {/* <div className="nav-item navbar-search-wrapper mb-0">
             <a className="nav-item nav-link search-toggler px-0" href="#">
               <span
@@ -178,10 +175,8 @@ const Header = () => {
           </div> */}
         </div>
 
-
         {/* icon list */}
         <ul className="navbar-nav flex-row align-items-center ms-md-auto">
-     
           <li className="nav-item dropdown-shortcuts navbar-dropdown dropdown me-2 me-xl-0">
             <a
               className="nav-link dropdown-toggle hide-arrow"
@@ -688,7 +683,9 @@ const Header = () => {
                   </span>
                 </a>
               </li>
-              <li onClick={openChangePassword}> {/* Use the function from the context */}
+              <li onClick={openChangePassword}>
+                {" "}
+                {/* Use the function from the context */}
                 <a
                   aria-label="go to profile"
                   className="dropdown-item cusor-pointer"
@@ -718,4 +715,4 @@ const Header = () => {
     </nav>
   );
 };
-export default Header;
+export default Header;