Added new project, updated blog and project cards

Author: djmartin2019

public/assets/websites/AlphaVantageDashboard.png

@@ -49,19 +49,20 @@ export const projects: Project[] = [
     startDate: "2024-01",
   },
   {
-    id: "sp500-analytics",
-    title: "S&P 500 Analytics",
+    id: "pyspark-stock-analysis-pipeline",
+    title: "Stock Analysis Dashboard",
     description:
-      "Comprehensive market-analysis dashboard using PostgreSQL, Python & Next.js.",
+      "A comprehensive stock market analysis platform built with Apache Spark, Delta Lake, and Dash.",
     longDescription:
-      "A financial analytics platform providing comprehensive market analysis tools with real-time data visualization and historical trend analysis.",
-    image: "/assets/websites/stock-market-dashboard.png",
-    technologies: ["NextJS", "TailwindCSS", "TypeScript", "Vercel"],
+      "This project implements a modern data engineering pipeline following the medallion architecture pattern to ingest, process, and visualize stock market data from Alpha Vantage API.",
+    image: "/assets/websites/AlphaVantageDashboard.png",
+    technologies: ["Plotly", "Python", "PySpark", "Delta Lake"],
     status: "current",
-    githubUrl: "https://github.com/djmartin2019/stock-analysis-project",
+    githubUrl:
+      "https://github.com/djmartin2019/pyspark-stock-analysis-pipeline",
     featured: true,
     category: "Finance",
-    startDate: "2025-03",
+    startDate: "2025-09",
   },
   {
     id: "texas-frontstep",

src/data/projects.ts

@@ -46,21 +46,22 @@ const imageURL = image.startsWith('http') ? image : new URL(image, Astro.site).h
     <meta property="og:title" content={title} />
     <meta property="og:description" content={description} />
     <meta property="og:image" content={imageURL} />
-    <meta property="og:image:width" content="1200" />
-    <meta property="og:image:height" content="630" />
+    <meta property="og:image:width" content="1024" />
+    <meta property="og:image:height" content="1024" />
     <meta property="og:image:alt" content={title} />
     <meta property="og:site_name" content="DJM Tech" />
     <meta property="og:locale" content="en_US" />
 
     <!-- Twitter -->
-    <meta name="twitter:card" content="summary_large_image" />
+    <meta name="twitter:card" content="summary" />
     <meta name="twitter:site" content="@djmartin2019" />
     <meta name="twitter:creator" content="@djmartin2019" />
     <meta name="twitter:url" content={canonicalURL} />
     <meta name="twitter:title" content={title} />
     <meta name="twitter:description" content={description} />
     <meta name="twitter:image" content={imageURL} />
     <meta name="twitter:image:alt" content={title} />
+    <meta name="twitter:domain" content="djm-tech.dev" />
 
     <!-- Additional LinkedIn-specific meta tags -->
     <meta name="linkedin:owner" content="davidjmartin2025" />

src/layouts/Layout.astro

@@ -53,7 +53,7 @@ const allTags = await getAllTags();
       <h2 class="text-2xl font-bold blog-title mb-8">Featured Posts</h2>
       <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
         {blogPosts.filter(post => post.featured).slice(0, 3).map((post) => (
-          <article class="featured-post neon-card overflow-hidden hover:shadow-neon-glow transition-all duration-300">
+          <article class="featured-post neon-card overflow-hidden hover:shadow-neon-glow transition-all duration-300 flex flex-col">
             <div class="h-64 blog-image-bg flex items-center justify-center overflow-hidden">
               <Image 
                 src={post.image || "/assets/og-default.png"} 
@@ -64,7 +64,7 @@ const allTags = await getAllTags();
                 loading="lazy"
               />
             </div>
-            <div class="p-6">
+            <div class="p-6 flex flex-col flex-grow">
               <div class="flex items-center text-sm blog-meta mb-3">
                 <span>{new Date(post.date).toLocaleDateString('en-US', { year: 'numeric', month: 'long', day: 'numeric' })}</span>
                 <span class="mx-2">•</span>
@@ -79,7 +79,7 @@ const allTags = await getAllTags();
                   <span class="px-2 py-1 blog-tag text-xs rounded">{tag}</span>
                 ))}
               </div>
-              <a href={`/blog/${post.slug}`} class="blog-link">
+              <a href={`/blog/${post.slug}`} class="blog-link mt-auto">
                 Read More →
               </a>
             </div>
@@ -95,7 +95,7 @@ const allTags = await getAllTags();
       <h2 class="text-2xl font-bold section-title mb-8">All Posts</h2>
       <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8" id="posts-grid">
         {blogPosts.map((post) => (
-          <article class={`blog-post neon-card overflow-hidden hover:shadow-neon-glow transition-all duration-300 ${post.tags.join(' ')}`}>
+          <article class={`blog-post neon-card overflow-hidden hover:shadow-neon-glow transition-all duration-300 ${post.tags.join(' ')} flex flex-col`}>
             <div class="h-64 blog-image-bg flex items-center justify-center overflow-hidden">
               <Image 
                 src={post.image || "/assets/og-default.png"} 
@@ -106,7 +106,7 @@ const allTags = await getAllTags();
                 loading="lazy"
               />
             </div>
-            <div class="p-6">
+            <div class="p-6 flex flex-col flex-grow">
               <div class="flex items-center text-sm blog-meta mb-3">
                 <span>{new Date(post.date).toLocaleDateString('en-US', { year: 'numeric', month: 'long', day: 'numeric' })}</span>
                 <span class="mx-2">•</span>
@@ -125,7 +125,7 @@ const allTags = await getAllTags();
                   <span class="px-2 py-1 blog-tag text-xs rounded">{tag}</span>
                 ))}
               </div>
-              <a href={`/blog/${post.slug}`} class="blog-link">
+              <a href={`/blog/${post.slug}`} class="blog-link mt-auto">
                 Read More →
               </a>
             </div>

src/pages/blog.astro

@@ -109,7 +109,7 @@ const allSkills = getAllSkills();
 
       <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
         {featuredProjects.slice(0, 3).map((project) => (
-          <div class="neon-card overflow-hidden hover:shadow-neon-glow transition-all duration-300">
+          <div class="neon-card overflow-hidden hover:shadow-neon-glow transition-all duration-300 flex flex-col">
             <div class="h-64 project-image-bg flex items-center justify-center overflow-hidden">
               <Image 
                 src={project.image} 
@@ -119,7 +119,7 @@ const allSkills = getAllSkills();
                 class="w-full h-full object-cover"
               />
             </div>
-            <div class="p-6">
+            <div class="p-6 flex flex-col flex-grow">
               <div class="flex items-center justify-between mb-2">
                 <h3 class="text-xl font-semibold project-title">{project.title}</h3>
                 <span class={`px-2 py-1 text-xs font-medium rounded-full status-badge status-${project.status}`}>
@@ -132,7 +132,7 @@ const allSkills = getAllSkills();
                   <span class="px-2 py-1 tech-tag text-xs rounded">{tech}</span>
                 ))}
               </div>
-              <div class="flex flex-col sm:flex-row gap-3">
+              <div class="flex flex-col sm:flex-row gap-3 mt-auto">
                 {project.liveUrl && (
                   <a href={project.liveUrl} target="_blank" rel="noopener noreferrer" class="primary-cta-button flex items-center justify-center">
                     <ExternalLink class="h-4 w-4 mr-2" />
@@ -169,7 +169,7 @@ const allSkills = getAllSkills();
 
       <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
         {recentPosts.slice(0, 3).map((post) => (
-          <article class="neon-card overflow-hidden hover:shadow-neon-glow transition-all duration-300">
+          <article class="neon-card overflow-hidden hover:shadow-neon-glow transition-all duration-300 flex flex-col">
             <div class="h-48 blog-image-bg flex items-center justify-center overflow-hidden">
               <Image 
                 src={post.image || "/assets/og-default.png"} 
@@ -180,7 +180,7 @@ const allSkills = getAllSkills();
                 loading="lazy"
               />
             </div>
-            <div class="p-6">
+            <div class="p-6 flex flex-col flex-grow">
               <div class="flex items-center text-sm blog-meta mb-2">
                 <span>{new Date(post.date).toLocaleDateString('en-US', { year: 'numeric', month: 'long', day: 'numeric' })}</span>
                 <span class="mx-2">•</span>
@@ -193,7 +193,7 @@ const allSkills = getAllSkills();
                   <span class="px-2 py-1 blog-tag text-xs rounded">{tag}</span>
                 ))}
               </div>
-              <a href={`/blog/${post.slug}`} class="blog-link">
+              <a href={`/blog/${post.slug}`} class="blog-link mt-auto">
                 Read More →
               </a>
             </div>

src/pages/index.astro

@@ -58,7 +58,7 @@ const roadmapProjects = getProjectsByStatus('roadmap');
     <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
       <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8" id="projects-grid">
         {projects.map((project) => (
-          <div class={`project-card neon-card overflow-hidden hover:shadow-neon-glow transition-all duration-300 ${project.status}`}>
+          <div class={`project-card neon-card overflow-hidden hover:shadow-neon-glow transition-all duration-300 ${project.status} flex flex-col`}>
             <div class="h-48 project-image-bg flex items-center justify-center overflow-hidden">
               <Image 
                 src={project.image} 
@@ -68,7 +68,7 @@ const roadmapProjects = getProjectsByStatus('roadmap');
                 class="w-full h-full object-cover"
               />
             </div>
-            <div class="p-6">
+            <div class="p-6 flex flex-col flex-grow">
               <div class="flex items-center justify-between mb-3">
                 <h3 class="text-xl font-semibold project-title">{project.title}</h3>
                 <span class={`px-3 py-1 text-xs font-medium rounded-full status-badge status-${project.status}`}>
@@ -93,12 +93,12 @@ const roadmapProjects = getProjectsByStatus('roadmap');
               </div>
 
               {project.longDescription && (
-                <div class="mb-4">
+                <div class="mb-4 flex-grow">
                   <p class="text-sm project-description">{project.longDescription}</p>
                 </div>
               )}
 
-              <div class="flex flex-col sm:flex-row gap-3">
+              <div class="flex flex-col sm:flex-row gap-3 mt-auto">
                 {project.liveUrl && (
                   <a href={project.liveUrl} target="_blank" rel="noopener noreferrer" class="primary-cta-button flex items-center justify-center">
                     <ExternalLink class="h-4 w-4 mr-2" />