Skip to content

Commit 9f5ebff

Browse files
eagleonhilleagleonhill
committed
Fix blog layout
1 parent ff41af7 commit 9f5ebff

File tree

3 files changed

+29
-30
lines changed

3 files changed

+29
-30
lines changed

‎.vitepress/components/BlogHome.vue‎

Lines changed: 27 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -15,53 +15,52 @@
1515
<article
1616
v-for="post in blogPosts"
1717
:key="post.slug"
18-
class="group border col-span-4 rounded-xl overflow-hidden transition-transform duration-300 hover:-translate-y-1 hover:shadow-xl border-[var(--vp-c-divider)] bg-[var(--vp-c-bg-soft)] flex flex-col"
18+
class="group border col-span-4 rounded-xl overflow-hidden transition-transform duration-300 hover:-translate-y-1 hover:shadow-xl border-[var(--vp-c-divider)] bg-[var(--vp-c-bg-soft)]"
1919
>
20-
<a :href="`/blog/${post.slug}`" class="block w-full h-full" :aria-label="`Read ${post.title}`">
20+
<a :href="`/blog/${post.slug}`" class="flex flex-col w-full h-full" :aria-label="`Read ${post.title}`">
2121
<div class="w-full aspect-video overflow-hidden">
2222
<img
2323
:src="post.image"
2424
:alt="post.title"
2525
class="w-full h-full object-contain transition-transform duration-300 group-hover:scale-105"
2626
/>
2727
</div>
28-
<div class="p-6 flex-1 flex flex-col gap-y-4">
28+
<div class="p-6 flex-1 flex flex-col gap-y-4 grow">
2929
<div class="inline-block p-2.5 rounded-lg text-md mb-4 self-start border border-[#81DACA] text-[var(--vp-c-brand-1)] bg-[#FAFDFD]">{{ post.category }}</div>
3030

3131
<h3 class="text-xl font-bold leading-normal">
3232
<span class="text-[var(--vp-c-text-1)] no-underline group-hover:text-[var(--vp-c-brand-1)]">{{ post.title }}</span>
3333
</h3>
3434

35-
<!-- author row with icon on its own line -->
36-
<div class="flex items-center gap-1.25 text-md text-[var(--vp-c-text-2)]">
37-
<svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5 text-[var(--vp-c-text-2)]" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
38-
<path stroke-linecap="round" stroke-linejoin="round" d="M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2" />
39-
<circle cx="12" cy="7" r="4" stroke-linecap="round" stroke-linejoin="round" />
40-
</svg>
41-
<span>by {{ post.author }}</span>
42-
</div>
43-
44-
<p class="text-[var(--vp-c-text-2)] leading-relaxed mb-6 flex-1">{{ post.excerpt }}</p>
45-
46-
<!-- bottom metadata: date (left) and reading time (right) with icons -->
47-
<div class="flex items-center justify-between text-sm text-[var(--vp-c-text-2)] mt-4">
48-
<div class="flex items-center gap-2">
49-
<svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4 text-[var(--vp-c-text-2)]" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5">
50-
<rect x="3" y="4" width="18" height="18" rx="2" ry="2" />
51-
<path d="M16 2v4M8 2v4M3 10h18" stroke-linecap="round" stroke-linejoin="round" />
35+
<div class="flex items-center gap-1.25 text-md text-[var(--vp-c-text-2)]">
36+
<svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5 text-[var(--vp-c-text-2)]" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
37+
<path stroke-linecap="round" stroke-linejoin="round" d="M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2" />
38+
<circle cx="12" cy="7" r="4" stroke-linecap="round" stroke-linejoin="round" />
5239
</svg>
53-
<span>{{ post.date }}</span>
40+
<span>by {{ post.author }}</span>
5441
</div>
5542

56-
<div class="flex items-center gap-2">
57-
<svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4 text-[var(--vp-c-text-2)]" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5">
58-
<circle cx="12" cy="12" r="9" stroke-linecap="round" stroke-linejoin="round" />
59-
<path d="M12 7v5l3 3" stroke-linecap="round" stroke-linejoin="round" />
60-
</svg>
61-
<span>{{ post.readingTime }} read</span>
43+
<p class="text-[var(--vp-c-text-2)] leading-relaxed flex-1 grow-1">{{ post.excerpt }}</p>
44+
45+
<!-- bottom metadata: date (left) and reading time (right) with icons -->
46+
<div class="flex items-center justify-between text-sm text-[var(--vp-c-text-2)] mt-4">
47+
<div class="flex items-center gap-2">
48+
<svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4 text-[var(--vp-c-text-2)]" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5">
49+
<rect x="3" y="4" width="18" height="18" rx="2" ry="2" />
50+
<path d="M16 2v4M8 2v4M3 10h18" stroke-linecap="round" stroke-linejoin="round" />
51+
</svg>
52+
<span>{{ post.date }}</span>
53+
</div>
54+
55+
<div class="flex items-center gap-2">
56+
<svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4 text-[var(--vp-c-text-2)]" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5">
57+
<circle cx="12" cy="12" r="9" stroke-linecap="round" stroke-linejoin="round" />
58+
<path d="M12 7v5l3 3" stroke-linecap="round" stroke-linejoin="round" />
59+
</svg>
60+
<span>{{ post.readingTime }} read</span>
61+
</div>
6262
</div>
6363
</div>
64-
</div>
6564
</a>
6665
</article>
6766
</div>

‎.vitepress/data/blogPosts.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,7 @@ export const blogPosts: BlogPost[] = [
2121
"author": "Hema Raghavan",
2222
"readingTime": "6 min",
2323
"category": "Case Study",
24-
"image": "https://cdn-images-1.medium.com/max/2400/1*72Jo87jR0xg_3zzBkwkNLQ.png",
24+
"image": "https://cdn-images-1.medium.com/max/2400/1*6-j31fR15GpaBT_y2n6G1A.png",
2525
"tags": [
2626
"machine-learning",
2727
"ml-workflow",

‎blog/kumo-optimizing-ml-development.md‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ author: Hema Raghavan
77
tags: [machine-learning, ml-workflow, cloud-computing, gpu-computing, developer-productivity, velda]
88
keywords: ["ML development", "GPU utilization", "Velda", "cloud development", "developer productivity", "MLOps"]
99
excerpt: "How Kumo.ai used Velda to accelerate experiments, cut dependency update times, and increase GPU utilization across the team."
10-
image: "https://cdn-images-1.medium.com/max/2400/1*72Jo87jR0xg_3zzBkwkNLQ.png"
10+
image: "https://cdn-images-1.medium.com/max/2400/1*6-j31fR15GpaBT_y2n6G1A.png"
1111
readingTime: "6 min"
1212
category: "Case Study"
1313
---

0 commit comments

Comments
 (0)