From 78958cd6af1a627799d5b12fe9eedcd9b321a47e Mon Sep 17 00:00:00 2001
From: JeffEmmett <20747463-JeffEmmett@users.noreply.replit.com>
Date: Wed, 7 May 2025 02:38:17 +0000
Subject: [PATCH] Improve the website's appearance and navigation for a better
 user experience

Fixes image URL type in ClassCard and adds styling to Link components in Header.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: acaf01d7-65a7-4fc5-901d-853488e196e8
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/af8dabca-e746-4e53-9c29-d8d4d9cf30f5/a204958c-2c80-4d4c-8cf4-2cabe0721c6a.jpg
---
 client/src/components/classes/class-card.tsx |  2 +-
 client/src/components/navigation/header.tsx  | 10 ++++++----
 client/src/index.css                         |  4 ++--
 3 files changed, 9 insertions(+), 7 deletions(-)

diff --git a/client/src/components/classes/class-card.tsx b/client/src/components/classes/class-card.tsx
index b8d8013..ad98ed0 100644
--- a/client/src/components/classes/class-card.tsx
+++ b/client/src/components/classes/class-card.tsx
@@ -69,7 +69,7 @@ export function ClassCard({ classData, onBookClick }: ClassCardProps) {
   return (
     <div className="bg-white rounded-lg overflow-hidden shadow-lg transition-transform duration-300 hover:transform hover:scale-105">
       <img 
-        src={classData.imageUrl || "https://images.unsplash.com/photo-1518611012118-696072aa579a?ixlib=rb-4.0.3&auto=format&fit=crop"} 
+        src={classData.imageUrl as string || "https://images.unsplash.com/photo-1518611012118-696072aa579a?ixlib=rb-4.0.3&auto=format&fit=crop"} 
         alt={classData.name} 
         className="w-full h-48 object-cover" 
       />
diff --git a/client/src/components/navigation/header.tsx b/client/src/components/navigation/header.tsx
index 891d499..54e078f 100644
--- a/client/src/components/navigation/header.tsx
+++ b/client/src/components/navigation/header.tsx
@@ -40,10 +40,12 @@ export default function Header() {
           {/* Desktop Navigation */}
           <nav className="hidden md:flex space-x-8">
             {navLinks.map((link) => (
-              <Link key={link.path} href={link.path}>
-                <a className={`transition-colors duration-200 font-raleway font-medium ${isActive(link.path)}`}>
-                  {link.name}
-                </a>
+              <Link 
+                key={link.path} 
+                href={link.path} 
+                className={`transition-colors duration-200 font-raleway font-medium ${isActive(link.path)}`}
+              >
+                {link.name}
               </Link>
             ))}
           </nav>
diff --git a/client/src/index.css b/client/src/index.css
index fcde2fc..1b6e13a 100644
--- a/client/src/index.css
+++ b/client/src/index.css
@@ -1,9 +1,9 @@
+@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;500;600;700&family=Raleway:wght@300;400;500;600&family=Aref+Ruqaa:wght@400;700&display=swap');
+
 @tailwind base;
 @tailwind components;
 @tailwind utilities;
 
-@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;500;600;700&family=Raleway:wght@300;400;500;600&family=Aref+Ruqaa:wght@400;700&display=swap');
-
 :root {
   --background: 0 0% 100%;
   --foreground: 20 14.3% 4.1%;