jeffemmett
/
pwf-website-new
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Adjust the class display to better utilize screen space on all devices 

Modify grid layout in ClassesSection component to display classes in a 2x2 or 1x4 grid.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 9139fa4a-deb6-40f3-971b-e98fd6d687ed
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/af8dabca-e746-4e53-9c29-d8d4d9cf30f5/27961860-e88b-41ac-a047-d0e5f710e101.jpg
This commit is contained in:
JeffEmmett 2025-06-13 22:37:14 +00:00
parent 11f0e0cac9
commit 8968eb30c2
1 changed files with 2 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
client/src/components/classes/classes-section.tsx
View File

@ -25,7 +25,7 @@ export function ClassesSection() {
{/* Class description boxes removed */} {/* Class description boxes removed */}
{isLoading ? ( {isLoading ? (
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8"> <div className="grid grid-cols-1 md:grid-cols-2 gap-8">
{[1, 2, 3].map((_, i) => ( {[1, 2, 3].map((_, i) => (
<div key={i} className="bg-white rounded-lg overflow-hidden shadow-lg"> <div key={i} className="bg-white rounded-lg overflow-hidden shadow-lg">
<Skeleton className="w-full h-48" /> <Skeleton className="w-full h-48" />
@ -46,7 +46,7 @@ export function ClassesSection() {
<p>Error loading classes. Please try again later.</p> <p>Error loading classes. Please try again later.</p>
</div> </div>
) : ( ) : (
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8"> <div className="grid grid-cols-1 md:grid-cols-2 gap-8">
{classes?.map((classData) => ( {classes?.map((classData) => (
<ClassCard <ClassCard
key={classData.id} key={classData.id}