Fix the officer cards not properly aligning

This commit is contained in:
chark1es 2024-03-17 14:22:38 -07:00
parent c8e710a02a
commit 627eb0d5e8
2 changed files with 5 additions and 3 deletions

View file

@ -9,12 +9,14 @@ const OfficerCard = ({
}) => { }) => {
const handleImageClick = () => { const handleImageClick = () => {
if (name === "Mustahsin Zarif") { if (name === "Mustahsin Zarif") {
onMustahsinClicked(); // This function is to be provided by the parent component onMustahsinClicked();
} }
}; };
return ( return (
<div className={`flex flex-col items-center w-64 rounded-lg`}> <div
className={`flex flex-col justify-center content-center mx-12 items-center w-64 rounded-lg`}
>
<img <img
className="w-26 h-auto sm:h-64 object-cover rounded-3xl cursor-pointer" className="w-26 h-auto sm:h-64 object-cover rounded-3xl cursor-pointer"
src={picture} src={picture}

View file

@ -48,7 +48,7 @@ const OfficerTabs = ({ officers }) => {
<div <div
key={selectedType} key={selectedType}
className="officers flex-row flex flex-wrap items-center justify-center space-x-16 p-12" className="officers flex-row flex flex-wrap flex-none items-center justify-center p-12"
> >
{filteredOfficers.map((officer) => ( {filteredOfficers.map((officer) => (
<OfficerCard <OfficerCard