Academic Staff | Faculty of Business Studies<\/title>\n \n <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Inter:opsz,wght@14..32,300;14..32,400;14..32,500;14..32,600;14..32,700&display=swap\" rel=\"stylesheet\">\n \n <link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.0.0-beta3\/css\/all.min.css\">\n <style>\n * {\n margin: 0;\n padding: 0;\n box-sizing: border-box;\n }\n\n body {\n font-family: 'Inter', sans-serif;\n background: #f5f7fc; \/* very light grey-blue background for subtle depth, but main card area stays white *\/\n color: #1e293b;\n line-height: 1.4;\n padding: 2rem 1.5rem;\n }\n\n \/* main container \u2013 clean centered layout *\/\n .staff-container {\n max-width: 1280px;\n margin: 0 auto;\n background: #ffffff; \/* pure white background for main card area *\/\n border-radius: 32px;\n box-shadow: 0 20px 35px -12px rgba(0, 0, 0, 0.05), 0 1px 2px rgba(0, 0, 0, 0.02);\n overflow: hidden;\n padding: 2rem 2rem 2.5rem 2rem;\n }\n\n \/* header section with underline accent *\/\n .page-header {\n margin-bottom: 2.5rem;\n border-bottom: 3px solid #0f2b4d;\n display: inline-block;\n width: 100%;\n }\n .page-header h2 {\n font-size: 2rem;\n font-weight: 700;\n letter-spacing: -0.01em;\n color: #0a1c2f;\n display: inline-block;\n background: linear-gradient(135deg, #0a1c2f 0%, #1e3a5f 100%);\n background-clip: text;\n -webkit-background-clip: text;\n color: transparent;\n margin-bottom: 0.5rem;\n }\n .page-header h2 i {\n background: none;\n -webkit-background-clip: unset;\n color: #1e3a5f;\n margin-right: 10px;\n font-size: 1.9rem;\n background: transparent;\n }\n .header-underline {\n height: 4px;\n width: 80px;\n background: #0f2b4d;\n border-radius: 4px;\n margin-top: 8px;\n }\n\n \/* responsive grid \u2013 modern cards layout (replaces old table) *\/\n .staff-grid {\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));\n gap: 2rem;\n }\n\n \/* card design \u2013 white card with subtle shadow & rounded corners, premium UI *\/\n .staff-card {\n background: #ffffff;\n border-radius: 24px;\n box-shadow: 0 10px 20px -5px rgba(0, 0, 0, 0.05), 0 0 0 1px rgba(0, 0, 0, 0.02);\n transition: transform 0.2s ease, box-shadow 0.25s ease;\n overflow: hidden;\n display: flex;\n flex-direction: column;\n height: 100%;\n }\n .staff-card:hover {\n transform: translateY(-5px);\n box-shadow: 0 24px 36px -12px rgba(0, 0, 0, 0.12), 0 2px 5px rgba(0, 0, 0, 0.02);\n }\n\n \/* image area: consistent crop, object-fit cover *\/\n .card-image {\n width: 100%;\n background: #f1f5f9;\n display: flex;\n justify-content: center;\n align-items: center;\n padding: 1.8rem 1rem 0.8rem 1rem;\n }\n .card-image img {\n width: 160px;\n height: 160px;\n object-fit: cover;\n border-radius: 50%;\n box-shadow: 0 12px 18px -8px rgba(0, 0, 0, 0.1);\n border: 3px solid #ffffff;\n outline: 1px solid #e9edf2;\n transition: all 0.2s;\n }\n\n \/* content area *\/\n .card-content {\n padding: 1.2rem 1.5rem 1.8rem 1.5rem;\n text-align: center;\n flex: 1;\n display: flex;\n flex-direction: column;\n }\n\n .staff-name {\n font-size: 1.35rem;\n font-weight: 700;\n color: #0a2b44;\n margin-bottom: 0.4rem;\n line-height: 1.3;\n }\n\n .staff-title {\n font-size: 0.9rem;\n font-weight: 500;\n color: #4b5569;\n background: #f0f4fa;\n display: inline-block;\n padding: 0.25rem 1rem;\n border-radius: 40px;\n margin: 0.6rem auto 0.8rem auto;\n letter-spacing: 0.01em;\n }\n\n \/* button style \u2013 dark blue (#0a2f5a -> #0b3b5f) with smooth hover *\/\n .btn-profile {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: 8px;\n background: #0f2b4d; \/* dark blue base *\/\n color: white;\n text-decoration: none;\n font-weight: 600;\n font-size: 0.9rem;\n padding: 0.7rem 1.3rem;\n border-radius: 40px;\n transition: all 0.25s ease;\n margin-top: 0.8rem;\n border: none;\n cursor: pointer;\n width: fit-content;\n align-self: center;\n box-shadow: 0 1px 2px rgba(0,0,0,0.05);\n }\n .btn-profile i {\n font-size: 0.85rem;\n transition: transform 0.2s;\n }\n .btn-profile:hover {\n background: #06223f; \/* deeper dark blue *\/\n transform: scale(1.02);\n box-shadow: 0 8px 16px -6px rgba(15, 43, 77, 0.25);\n }\n .btn-profile:active {\n transform: scale(0.98);\n }\n\n \/* disabled button style (for missing profile link) *\/\n .btn-profile.disabled,\n .btn-profile:not([href]) {\n background: #9aaebf;\n cursor: default;\n pointer-events: none;\n opacity: 0.7;\n box-shadow: none;\n transform: none;\n }\n .btn-profile.disabled:hover {\n background: #9aaebf;\n transform: none;\n }\n\n \/* empty state for missing second column but card remains hidden? We handle missing data gracefully *\/\n .staff-card-placeholder {\n opacity: 0;\n visibility: hidden;\n display: none;\n }\n\n \/* For responsive small screens *\/\n @media (max-width: 680px) {\n body {\n padding: 1rem;\n }\n .staff-container {\n padding: 1.25rem;\n }\n .staff-grid {\n gap: 1.25rem;\n }\n .card-image img {\n width: 130px;\n height: 130px;\n }\n .staff-name {\n font-size: 1.2rem;\n }\n }\n\n \/* footer \/ subtle credit line (optional elegance) *\/\n .accent-note {\n text-align: center;\n margin-top: 2.8rem;\n font-size: 0.75rem;\n color: #8b9ab0;\n border-top: 1px solid #eef2f8;\n padding-top: 1.5rem;\n }\n\n \/* Fix any leftover table artifacts *\/\n table, tbody, tr, td {\n all: revert; \/* we replace table completely, but reset ensures no conflict *\/\n }\n \/* ensure hidden table elements do not affect layout *\/\n .staff-container table,\n .staff-container tbody,\n .staff-container tr,\n .staff-container td {\n display: block;\n }\n <\/style>\n<\/head>\n<body>\n\n<div class=\"staff-container\">\n <div class=\"page-header\">\n <h2><i class=\"fas fa-chalkboard-user\"><\/i> Academic Staff<\/h2>\n <div class=\"header-underline\"><\/div>\n <p style=\"margin-top: 12px; color: #4a5b73; font-weight: 400;\">Faculty of Business Studies \u2014 committed to excellence in education and research.<\/p>\n <\/div>\n\n <div class=\"staff-grid\" id=\"staffGrid\">\n \n \n \n <\/div>\n <div class=\"accent-note\">\n <i class=\"fas-regular fa-graduation-cap\"><\/i> Inspiring minds, shaping futures\n <\/div>\n<\/div>\n\n<script>\n \/\/ Staff data exactly extracted from the provided HTML table (with all details)\n \/\/ Each object matches: name, title, imageUrl, profileLink (if available)\n \/\/ Some links might be relative or #; we preserve exactly as original href.\n \/\/ For Mr. Pratheepan: the anchor has no href but text \"View Profile\" without link => we treat as disabled button.\n \/\/ For missing second column \/ empty cell: originally there is a cell after Mr. Pratheepan but no content; we ignore.\n \/\/ Data includes all 6 staff members (3 rows, 2 columns each, but note row 3 has only first cell and second empty -> we show only valid staff)\n \/\/ Let's list all 6 academic staff entries as per table:\n\n const staffData = [\n {\n name: \"Ms. Janaki Samuel Thevaruban\",\n title: \"Senior Lecturer Gr.I\",\n image: \"https:\/\/fbs.vau.ac.lk\/fa\/wp-content\/uploads\/2023\/03\/Ms_-J_-S_-Thevaruban-3-1.jpg\",\n profile: \"https:\/\/sites.google.com\/vau.ac.lk\/janakisamuelthevaruban\/home\"\n },\n {\n name: \"Dr. Koperunthevy Kalainathan\",\n title: \"Senior Lecturer Gr.I\",\n image: \"https:\/\/fbs.vau.ac.lk\/fa\/wp-content\/uploads\/2024\/11\/ssa.png\",\n profile: \"https:\/\/fbs.vau.ac.lk\/fa\/?page_id=818&preview=true\"\n },\n {\n name: \"Dr. G.R.M Gamlath\",\n title: \"Senior Lecturer Gr.I\",\n image: \"https:\/\/fbs.vau.ac.lk\/fa\/wp-content\/uploads\/2023\/03\/GAMLATH-SIR-212x270-1.jpg\",\n profile: \"https:\/\/fbs.vau.ac.lk\/fa\/mr-g-r-m-gamlath\/\"\n },\n {\n name: \"Mr. Chandrasegaran Larojan\",\n title: \"Senior Lecturer Gr.II\",\n image: \"https:\/\/fbs.vau.ac.lk\/fa\/wp-content\/uploads\/2024\/11\/IMG_20241010_143834.jpg\",\n profile: \"https:\/\/fbs.vau.ac.lk\/fa\/mr-c-larojan\/\"\n },\n {\n name: \"Ms. B. Manthahine Balasubramaniyam\",\n title: \"Lecturer(Prob.)\",\n image: \"https:\/\/fbs.vau.ac.lk\/fa\/wp-content\/uploads\/2023\/03\/IMG-20220614-WA0023-2-1.jpg\",\n profile: \"https:\/\/fbs.vau.ac.lk\/fa\/mrs-manthahine-janarthan\/\"\n },\n {\n name: \"Mr. Nadarajah Pratheepan\",\n title: \"Lecturer(Prob.)\",\n image: \"https:\/\/fbs.vau.ac.lk\/fa\/wp-content\/uploads\/2024\/07\/N.Pratheepan.jpg\",\n profile: null \/\/ no link: anchor without href -> View Profile but no link\n }\n \/\/ (The empty last cell in original table is ignored - no staff)\n ];\n\n \/\/ Function to create a card element with dynamic button state & UI interactions\n function createStaffCard(staff) {\n const card = document.createElement('div');\n card.className = 'staff-card';\n\n \/\/ Image section\n const imageDiv = document.createElement('div');\n imageDiv.className = 'card-image';\n const img = document.createElement('img');\n img.src = staff.image;\n img.alt = staff.name;\n \/\/ onerror fallback (in case images broken, still elegant)\n img.onerror = function() {\n this.src = 'https:\/\/via.placeholder.com\/200x200?text=No+Image';\n this.style.objectFit = 'cover';\n };\n imageDiv.appendChild(img);\n\n \/\/ Content section\n const contentDiv = document.createElement('div');\n contentDiv.className = 'card-content';\n\n const nameElem = document.createElement('h3');\n nameElem.className = 'staff-name';\n nameElem.innerText = staff.name;\n\n const titleElem = document.createElement('div');\n titleElem.className = 'staff-title';\n titleElem.innerText = staff.title;\n\n \/\/ Button: dark blue style, if profile link exists create anchor, else disabled span-like button.\n const btn = document.createElement('a');\n btn.className = 'btn-profile';\n \/\/ icon inside\n const icon = document.createElement('i');\n icon.className = 'fas fa-arrow-right';\n \n if (staff.profile && staff.profile.trim() !== \"\") {\n btn.href = staff.profile;\n btn.target = \"_blank\"; \/\/ open in new tab for better UX\n btn.rel = \"noopener noreferrer\";\n btn.innerHTML = 'View Profile <i class=\"fas fa-arrow-right\"><\/i>';\n } else {\n \/\/ Disabled button style - no actual link, interactive but not clickable\n btn.classList.add('disabled');\n btn.href = \"javascript:void(0);\";\n btn.setAttribute('aria-disabled', 'true');\n btn.innerHTML = 'Profile Unavailable <i class=\"fas fa-lock\"><\/i>';\n btn.style.cursor = \"default\";\n btn.style.pointerEvents = \"none\";\n \/\/ additional subtle styling\n }\n\n contentDiv.appendChild(nameElem);\n contentDiv.appendChild(titleElem);\n contentDiv.appendChild(btn);\n\n card.appendChild(imageDiv);\n card.appendChild(contentDiv);\n \n return card;\n }\n\n \/\/ Populate grid after page loads\n const gridContainer = document.getElementById('staffGrid');\n if (gridContainer) {\n staffData.forEach(staff => {\n const card = createStaffCard(staff);\n gridContainer.appendChild(card);\n });\n }\n\n \/\/ Optional: Add hover and micro-interactions \u2013 already in CSS.\n \/\/ Ensure any broken external images don't break layout\n \/\/ Also if any image fails, placeholder is provided.\n<\/script>\n\n\n<\/body>\n<\/html>\n","protected":false},"excerpt":{"rendered":"<p>Academic Staff | Faculty of Business Studies Academic Staff Faculty of Business Studies \u2014 committed to excellence in education and research. Inspiring minds, shaping futures<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"template-fullwidth.php","meta":{"footnotes":""},"class_list":["post-11","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/fbs.vau.ac.lk\/fa\/wp-json\/wp\/v2\/pages\/11","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/fbs.vau.ac.lk\/fa\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/fbs.vau.ac.lk\/fa\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/fbs.vau.ac.lk\/fa\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/fbs.vau.ac.lk\/fa\/wp-json\/wp\/v2\/comments?post=11"}],"version-history":[{"count":27,"href":"https:\/\/fbs.vau.ac.lk\/fa\/wp-json\/wp\/v2\/pages\/11\/revisions"}],"predecessor-version":[{"id":962,"href":"https:\/\/fbs.vau.ac.lk\/fa\/wp-json\/wp\/v2\/pages\/11\/revisions\/962"}],"wp:attachment":[{"href":"https:\/\/fbs.vau.ac.lk\/fa\/wp-json\/wp\/v2\/media?parent=11"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

{"id":11,"date":"2023-03-11T05:55:47","date_gmt":"2023-03-11T05:55:47","guid":{"rendered":"https:\/\/fbs.vau.ac.lk\/pm\/?page_id=11"},"modified":"2026-05-21T04:23:20","modified_gmt":"2026-05-21T04:23:20","slug":"staff","status":"publish","type":"page","link":"https:\/\/fbs.vau.ac.lk\/fa\/staff\/","title":{"rendered":"Staff"},"content":{"rendered":"\n\n\n\n \n \n Academic Staff | Faculty of Business Studies<\/title>\n \n <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Inter:opsz,wght@14..32,300;14..32,400;14..32,500;14..32,600;14..32,700&display=swap\" rel=\"stylesheet\">\n \n <link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.0.0-beta3\/css\/all.min.css\">\n <style>\n * {\n margin: 0;\n padding: 0;\n box-sizing: border-box;\n }\n\n body {\n font-family: 'Inter', sans-serif;\n background: #f5f7fc; \/* very light grey-blue background for subtle depth, but main card area stays white *\/\n color: #1e293b;\n line-height: 1.4;\n padding: 2rem 1.5rem;\n }\n\n \/* main container \u2013 clean centered layout *\/\n .staff-container {\n max-width: 1280px;\n margin: 0 auto;\n background: #ffffff; \/* pure white background for main card area *\/\n border-radius: 32px;\n box-shadow: 0 20px 35px -12px rgba(0, 0, 0, 0.05), 0 1px 2px rgba(0, 0, 0, 0.02);\n overflow: hidden;\n padding: 2rem 2rem 2.5rem 2rem;\n }\n\n \/* header section with underline accent *\/\n .page-header {\n margin-bottom: 2.5rem;\n border-bottom: 3px solid #0f2b4d;\n display: inline-block;\n width: 100%;\n }\n .page-header h2 {\n font-size: 2rem;\n font-weight: 700;\n letter-spacing: -0.01em;\n color: #0a1c2f;\n display: inline-block;\n background: linear-gradient(135deg, #0a1c2f 0%, #1e3a5f 100%);\n background-clip: text;\n -webkit-background-clip: text;\n color: transparent;\n margin-bottom: 0.5rem;\n }\n .page-header h2 i {\n background: none;\n -webkit-background-clip: unset;\n color: #1e3a5f;\n margin-right: 10px;\n font-size: 1.9rem;\n background: transparent;\n }\n .header-underline {\n height: 4px;\n width: 80px;\n background: #0f2b4d;\n border-radius: 4px;\n margin-top: 8px;\n }\n\n \/* responsive grid \u2013 modern cards layout (replaces old table) *\/\n .staff-grid {\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));\n gap: 2rem;\n }\n\n \/* card design \u2013 white card with subtle shadow & rounded corners, premium UI *\/\n .staff-card {\n background: #ffffff;\n border-radius: 24px;\n box-shadow: 0 10px 20px -5px rgba(0, 0, 0, 0.05), 0 0 0 1px rgba(0, 0, 0, 0.02);\n transition: transform 0.2s ease, box-shadow 0.25s ease;\n overflow: hidden;\n display: flex;\n flex-direction: column;\n height: 100%;\n }\n .staff-card:hover {\n transform: translateY(-5px);\n box-shadow: 0 24px 36px -12px rgba(0, 0, 0, 0.12), 0 2px 5px rgba(0, 0, 0, 0.02);\n }\n\n \/* image area: consistent crop, object-fit cover *\/\n .card-image {\n width: 100%;\n background: #f1f5f9;\n display: flex;\n justify-content: center;\n align-items: center;\n padding: 1.8rem 1rem 0.8rem 1rem;\n }\n .card-image img {\n width: 160px;\n height: 160px;\n object-fit: cover;\n border-radius: 50%;\n box-shadow: 0 12px 18px -8px rgba(0, 0, 0, 0.1);\n border: 3px solid #ffffff;\n outline: 1px solid #e9edf2;\n transition: all 0.2s;\n }\n\n \/* content area *\/\n .card-content {\n padding: 1.2rem 1.5rem 1.8rem 1.5rem;\n text-align: center;\n flex: 1;\n display: flex;\n flex-direction: column;\n }\n\n .staff-name {\n font-size: 1.35rem;\n font-weight: 700;\n color: #0a2b44;\n margin-bottom: 0.4rem;\n line-height: 1.3;\n }\n\n .staff-title {\n font-size: 0.9rem;\n font-weight: 500;\n color: #4b5569;\n background: #f0f4fa;\n display: inline-block;\n padding: 0.25rem 1rem;\n border-radius: 40px;\n margin: 0.6rem auto 0.8rem auto;\n letter-spacing: 0.01em;\n }\n\n \/* button style \u2013 dark blue (#0a2f5a -> #0b3b5f) with smooth hover *\/\n .btn-profile {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: 8px;\n background: #0f2b4d; \/* dark blue base *\/\n color: white;\n text-decoration: none;\n font-weight: 600;\n font-size: 0.9rem;\n padding: 0.7rem 1.3rem;\n border-radius: 40px;\n transition: all 0.25s ease;\n margin-top: 0.8rem;\n border: none;\n cursor: pointer;\n width: fit-content;\n align-self: center;\n box-shadow: 0 1px 2px rgba(0,0,0,0.05);\n }\n .btn-profile i {\n font-size: 0.85rem;\n transition: transform 0.2s;\n }\n .btn-profile:hover {\n background: #06223f; \/* deeper dark blue *\/\n transform: scale(1.02);\n box-shadow: 0 8px 16px -6px rgba(15, 43, 77, 0.25);\n }\n .btn-profile:active {\n transform: scale(0.98);\n }\n\n \/* disabled button style (for missing profile link) *\/\n .btn-profile.disabled,\n .btn-profile:not([href]) {\n background: #9aaebf;\n cursor: default;\n pointer-events: none;\n opacity: 0.7;\n box-shadow: none;\n transform: none;\n }\n .btn-profile.disabled:hover {\n background: #9aaebf;\n transform: none;\n }\n\n \/* empty state for missing second column but card remains hidden? We handle missing data gracefully *\/\n .staff-card-placeholder {\n opacity: 0;\n visibility: hidden;\n display: none;\n }\n\n \/* For responsive small screens *\/\n @media (max-width: 680px) {\n body {\n padding: 1rem;\n }\n .staff-container {\n padding: 1.25rem;\n }\n .staff-grid {\n gap: 1.25rem;\n }\n .card-image img {\n width: 130px;\n height: 130px;\n }\n .staff-name {\n font-size: 1.2rem;\n }\n }\n\n \/* footer \/ subtle credit line (optional elegance) *\/\n .accent-note {\n text-align: center;\n margin-top: 2.8rem;\n font-size: 0.75rem;\n color: #8b9ab0;\n border-top: 1px solid #eef2f8;\n padding-top: 1.5rem;\n }\n\n \/* Fix any leftover table artifacts *\/\n table, tbody, tr, td {\n all: revert; \/* we replace table completely, but reset ensures no conflict *\/\n }\n \/* ensure hidden table elements do not affect layout *\/\n .staff-container table,\n .staff-container tbody,\n .staff-container tr,\n .staff-container td {\n display: block;\n }\n <\/style>\n<\/head>\n<body>\n\n<div class=\"staff-container\">\n <div class=\"page-header\">\n <h2><i class=\"fas fa-chalkboard-user\"><\/i> Academic Staff<\/h2>\n <div class=\"header-underline\"><\/div>\n <p style=\"margin-top: 12px; color: #4a5b73; font-weight: 400;\">Faculty of Business Studies \u2014 committed to excellence in education and research.<\/p>\n <\/div>\n\n <div class=\"staff-grid\" id=\"staffGrid\">\n \n \n \n <\/div>\n <div class=\"accent-note\">\n <i class=\"fas-regular fa-graduation-cap\"><\/i> Inspiring minds, shaping futures\n <\/div>\n<\/div>\n\n<script>\n \/\/ Staff data exactly extracted from the provided HTML table (with all details)\n \/\/ Each object matches: name, title, imageUrl, profileLink (if available)\n \/\/ Some links might be relative or #; we preserve exactly as original href.\n \/\/ For Mr. Pratheepan: the anchor has no href but text \"View Profile\" without link => we treat as disabled button.\n \/\/ For missing second column \/ empty cell: originally there is a cell after Mr. Pratheepan but no content; we ignore.\n \/\/ Data includes all 6 staff members (3 rows, 2 columns each, but note row 3 has only first cell and second empty -> we show only valid staff)\n \/\/ Let's list all 6 academic staff entries as per table:\n\n const staffData = [\n {\n name: \"Ms. Janaki Samuel Thevaruban\",\n title: \"Senior Lecturer Gr.I\",\n image: \"https:\/\/fbs.vau.ac.lk\/fa\/wp-content\/uploads\/2023\/03\/Ms_-J_-S_-Thevaruban-3-1.jpg\",\n profile: \"https:\/\/sites.google.com\/vau.ac.lk\/janakisamuelthevaruban\/home\"\n },\n {\n name: \"Dr. Koperunthevy Kalainathan\",\n title: \"Senior Lecturer Gr.I\",\n image: \"https:\/\/fbs.vau.ac.lk\/fa\/wp-content\/uploads\/2024\/11\/ssa.png\",\n profile: \"https:\/\/fbs.vau.ac.lk\/fa\/?page_id=818&preview=true\"\n },\n {\n name: \"Dr. G.R.M Gamlath\",\n title: \"Senior Lecturer Gr.I\",\n image: \"https:\/\/fbs.vau.ac.lk\/fa\/wp-content\/uploads\/2023\/03\/GAMLATH-SIR-212x270-1.jpg\",\n profile: \"https:\/\/fbs.vau.ac.lk\/fa\/mr-g-r-m-gamlath\/\"\n },\n {\n name: \"Mr. Chandrasegaran Larojan\",\n title: \"Senior Lecturer Gr.II\",\n image: \"https:\/\/fbs.vau.ac.lk\/fa\/wp-content\/uploads\/2024\/11\/IMG_20241010_143834.jpg\",\n profile: \"https:\/\/fbs.vau.ac.lk\/fa\/mr-c-larojan\/\"\n },\n {\n name: \"Ms. B. Manthahine Balasubramaniyam\",\n title: \"Lecturer(Prob.)\",\n image: \"https:\/\/fbs.vau.ac.lk\/fa\/wp-content\/uploads\/2023\/03\/IMG-20220614-WA0023-2-1.jpg\",\n profile: \"https:\/\/fbs.vau.ac.lk\/fa\/mrs-manthahine-janarthan\/\"\n },\n {\n name: \"Mr. Nadarajah Pratheepan\",\n title: \"Lecturer(Prob.)\",\n image: \"https:\/\/fbs.vau.ac.lk\/fa\/wp-content\/uploads\/2024\/07\/N.Pratheepan.jpg\",\n profile: null \/\/ no link: anchor without href -> View Profile but no link\n }\n \/\/ (The empty last cell in original table is ignored - no staff)\n ];\n\n \/\/ Function to create a card element with dynamic button state & UI interactions\n function createStaffCard(staff) {\n const card = document.createElement('div');\n card.className = 'staff-card';\n\n \/\/ Image section\n const imageDiv = document.createElement('div');\n imageDiv.className = 'card-image';\n const img = document.createElement('img');\n img.src = staff.image;\n img.alt = staff.name;\n \/\/ onerror fallback (in case images broken, still elegant)\n img.onerror = function() {\n this.src = 'https:\/\/via.placeholder.com\/200x200?text=No+Image';\n this.style.objectFit = 'cover';\n };\n imageDiv.appendChild(img);\n\n \/\/ Content section\n const contentDiv = document.createElement('div');\n contentDiv.className = 'card-content';\n\n const nameElem = document.createElement('h3');\n nameElem.className = 'staff-name';\n nameElem.innerText = staff.name;\n\n const titleElem = document.createElement('div');\n titleElem.className = 'staff-title';\n titleElem.innerText = staff.title;\n\n \/\/ Button: dark blue style, if profile link exists create anchor, else disabled span-like button.\n const btn = document.createElement('a');\n btn.className = 'btn-profile';\n \/\/ icon inside\n const icon = document.createElement('i');\n icon.className = 'fas fa-arrow-right';\n \n if (staff.profile && staff.profile.trim() !== \"\") {\n btn.href = staff.profile;\n btn.target = \"_blank\"; \/\/ open in new tab for better UX\n btn.rel = \"noopener noreferrer\";\n btn.innerHTML = 'View Profile <i class=\"fas fa-arrow-right\"><\/i>';\n } else {\n \/\/ Disabled button style - no actual link, interactive but not clickable\n btn.classList.add('disabled');\n btn.href = \"javascript:void(0);\";\n btn.setAttribute('aria-disabled', 'true');\n btn.innerHTML = 'Profile Unavailable <i class=\"fas fa-lock\"><\/i>';\n btn.style.cursor = \"default\";\n btn.style.pointerEvents = \"none\";\n \/\/ additional subtle styling\n }\n\n contentDiv.appendChild(nameElem);\n contentDiv.appendChild(titleElem);\n contentDiv.appendChild(btn);\n\n card.appendChild(imageDiv);\n card.appendChild(contentDiv);\n \n return card;\n }\n\n \/\/ Populate grid after page loads\n const gridContainer = document.getElementById('staffGrid');\n if (gridContainer) {\n staffData.forEach(staff => {\n const card = createStaffCard(staff);\n gridContainer.appendChild(card);\n });\n }\n\n \/\/ Optional: Add hover and micro-interactions \u2013 already in CSS.\n \/\/ Ensure any broken external images don't break layout\n \/\/ Also if any image fails, placeholder is provided.\n<\/script>\n\n\n<\/body>\n<\/html>\n","protected":false},"excerpt":{"rendered":"<p>Academic Staff | Faculty of Business Studies Academic Staff Faculty of Business Studies \u2014 committed to excellence in education and research. Inspiring minds, shaping futures<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"template-fullwidth.php","meta":{"footnotes":""},"class_list":["post-11","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/fbs.vau.ac.lk\/fa\/wp-json\/wp\/v2\/pages\/11","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/fbs.vau.ac.lk\/fa\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/fbs.vau.ac.lk\/fa\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/fbs.vau.ac.lk\/fa\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/fbs.vau.ac.lk\/fa\/wp-json\/wp\/v2\/comments?post=11"}],"version-history":[{"count":27,"href":"https:\/\/fbs.vau.ac.lk\/fa\/wp-json\/wp\/v2\/pages\/11\/revisions"}],"predecessor-version":[{"id":962,"href":"https:\/\/fbs.vau.ac.lk\/fa\/wp-json\/wp\/v2\/pages\/11\/revisions\/962"}],"wp:attachment":[{"href":"https:\/\/fbs.vau.ac.lk\/fa\/wp-json\/wp\/v2\/media?parent=11"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}