Showcase different class types with unique, representative images

Implement dynamic image selection for class cards based on classType.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: d004b9e1-f9be-46e2-acda-f440ccd644a9
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/af8dabca-e746-4e53-9c29-d8d4d9cf30f5/a2f79e84-df0d-4bb5-8ea7-a2e7862fc47d.jpg
This commit is contained in:
JeffEmmett 2025-06-13 18:02:17 +00:00
parent e3865110ab
commit ab0484f16e
2 changed files with 11 additions and 2 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.3 MiB

View File

@ -1,5 +1,8 @@
import { Class } from "@shared/schema";
import FadiaGardenImage from "@assets/fadia-garden_1749836720986.jpg";
import PilatesClassImage from "@assets/pilates_class_1749837680834.jpeg";
import FadiaStudioImage from "@assets/Fadia-156.jpg";
import FadiaPrivateImage from "@assets/Fadia-132.jpg";
interface ClassCardProps {
classData: Class;
@ -32,9 +35,15 @@ export function ClassCard({ classData }: ClassCardProps) {
}
};
// Get class image - using the beautiful garden class photo for all types
// Get class image based on class type - using four different images
const getClassImage = () => {
return FadiaGardenImage;
switch (classData.classType) {
case "group": return FadiaGardenImage; // Garden outdoor class
case "small-group": return PilatesClassImage; // New uploaded class image
case "private": return FadiaPrivateImage; // Studio private session
case "online": return FadiaStudioImage; // Studio setting for online classes
default: return FadiaGardenImage;
}
};
return (