changes- mobile device - sidebar - business directory page, phone number changed in carnatic music shyamala - businees directory

components/businessdirectory/Section1.jsx

@@ -6,6 +6,8 @@ export default function Section1() {
   const categories = Object.keys(directoryData);
   const [selectedCategory, setSelectedCategory] = useState(categories[0]);
 
+  const [isSidebarOpen, setIsSidebarOpen] = useState(false);
+
   const tableHeaders = [
     "Services",
     "Name",
@@ -26,24 +28,36 @@ export default function Section1() {
               <div className="space30 d-lg-none d-block" />
               <div className="blog-auhtor-details">
                 <div className="blog-categories">
-                  <h3 className="mb-3">Business Directory</h3>
+                  <h3 
+                    className="mb-3 d-flex justify-content-between align-items-center"
+                    style={{ cursor: 'pointer' }}
+                    onClick={() => setIsSidebarOpen(!isSidebarOpen)}
+                  >
+                    Business Directory
+                    <i className={`fa-solid d-lg-none ${isSidebarOpen ? 'fa-angle-up' : 'fa-angle-down'}`} />
+                  </h3>
                   <div className="space12" />
-                  <ul className="list-unstyled">
-                    {categories.map((cat) => (
-                      <li key={cat} className="mb-2">
-                        <button
-                          className={`category-btn w-100 text-start ${selectedCategory === cat
-                            ? "active"
-                            : "bg-white text-dark"
-                            }`}
-                          onClick={() => setSelectedCategory(cat)}
-                        >
-                          <span>{cat}</span>
-                          <i className="fa-solid fa-angle-right" />
-                        </button>
-                      </li>
-                    ))}
-                  </ul>
+                  <div className={`sidebar-menu-list ${isSidebarOpen ? 'd-block' : 'd-none d-lg-block'}`}>
+                    <ul className="list-unstyled">
+                      {categories.map((cat) => (
+                        <li key={cat} className="mb-2">
+                          <button
+                            className={`category-btn w-100 text-start ${selectedCategory === cat
+                              ? "active"
+                              : "bg-white text-dark"
+                              }`}
+                            onClick={() => {
+                              setSelectedCategory(cat);
+                              setIsSidebarOpen(false); // Close sidebar on mobile after selection
+                            }}
+                          >
+                            <span>{cat}</span>
+                            <i className="fa-solid fa-angle-right" />
+                          </button>
+                        </li>
+                      ))}
+                    </ul>
+                  </div>
                 </div>
               </div>
             </div>

utility/constant.utils.js

@@ -2215,7 +2215,7 @@ export const directoryData = {
     {
       services: "Carnatic Music",
       name: "Shyamala Ramachandran	",
-      phone: "519-741-1418",
+      phone: "519-897-6975",
       serviceArea: "-",
       location: "-",
       // website: "https://financepro.com"