kunthawat/emdash-blog-template
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: add hero_image display with Image component

Browse Source 
Show actual hero image when available, fallback to code window otherwise.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Kunthawat Greethong
2026-04-30 13:51:52 +07:00
parent 6b77cc355e
commit cdf15f8988
1 changed files with 7 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
src/pages/index.astro
View File

@@ -1,6 +1,7 @@
--- ---
import { getEmDashEntry } from "emdash"; import { getEmDashEntry } from "emdash";
import { PortableText } from "emdash/ui"; import { PortableText } from "emdash/ui";
import { Image } from "emdash/ui";
import Base from "../layouts/Base.astro"; import Base from "../layouts/Base.astro";
const { entry: homepage } = await getEmDashEntry("homepage", "main"); const { entry: homepage } = await getEmDashEntry("homepage", "main");
@@ -36,8 +37,11 @@ const d = homepage.data;
</a> </a>
</div> </div>
</div> </div>
<div class="hero-visual"> <div class="hero-visual" {...homepage.edit.hero_image}>
<div class="code-window"> {d.hero_image?.src ? (
<Image image={d.hero_image} />
) : (
<div class="code-window">
<div class="code-header"> <div class="code-header">
<span class="dot red"></span> <span class="dot red"></span>
<span class="dot yellow"></span> <span class="dot yellow"></span>
@@ -57,6 +61,7 @@ const d = homepage.data;
], ],
&#125;);</code></pre> &#125;);</code></pre>
</div> </div>
)}
</div> </div>
</section> </section>