画像がない場合の表示を単色に

na-trium-144 · na-trium-144 · commit 634a9d1a7c3b · 2026-03-26T18:06:13.000+09:00
diff --git a/src/components/common/ProjectList.astro b/src/components/common/ProjectList.astro
@@ -39,7 +39,7 @@ const { projects, variant = "full" } = props;
             }}
           />
           :
-          <div class="aspect-5/3 w-full skeleton" />
+          <div class="aspect-5/3 w-full bg-gray-100" />
           }
           <div class="p-4">
             <h3 class="text-xl font-bold text-gray-800">
diff --git a/src/pages/projects/[...id].astro b/src/pages/projects/[...id].astro
@@ -41,7 +41,7 @@ if (project.data.status !== "dead") {
   title={project.data.app.name}
   description={project.data.app.description}
   focus={Focus.projects}
-  image={project.data.thumbnail?.src}
+  image={project.data.thumbnail?.src ?? null}
 >
   <main>
     <div
@@ -67,7 +67,7 @@ if (project.data.status !== "dead") {
         }}
       />
       :
-      <div class="aspect-5/3 w-full lg:w-150 lg:rounded-2xl skeleton" />
+      <div class="aspect-5/3 w-full lg:w-150 lg:rounded-2xl bg-gray-100" />
       }
       <div class="container mx-auto mt-8 px-4 lg:mx-0 lg:flex-1">
         <p class="flex items-center gap-1 text-gray-600">

Original file line number	Diff line number	Diff line change
`@@ -39,7 +39,7 @@ const { projects, variant = "full" } = props;`
`39`	`39`	`}}`
`40`	`40`	`/>`
`41`	`41`	`:`
`42`		`- <div class="aspect-5/3 w-full skeleton" />`
	`42`	`+ <div class="aspect-5/3 w-full bg-gray-100" />`
`43`	`43`	`}`
`44`	`44`	`<div class="p-4">`
`45`	`45`	`<h3 class="text-xl font-bold text-gray-800">`
Original file line number	Diff line number	Diff line change
`@@ -41,7 +41,7 @@ if (project.data.status !== "dead") {`
`41`	`41`	`title={project.data.app.name}`
`42`	`42`	`description={project.data.app.description}`
`43`	`43`	`focus={Focus.projects}`
`44`		`- image={project.data.thumbnail?.src}`
	`44`	`+ image={project.data.thumbnail?.src ?? null}`
`45`	`45`	`>`
`46`	`46`	`<main>`
`47`	`47`	`<div`
`@@ -67,7 +67,7 @@ if (project.data.status !== "dead") {`
`67`	`67`	`}}`
`68`	`68`	`/>`
`69`	`69`	`:`
`70`		`- <div class="aspect-5/3 w-full lg:w-150 lg:rounded-2xl skeleton" />`
	`70`	`+ <div class="aspect-5/3 w-full lg:w-150 lg:rounded-2xl bg-gray-100" />`
`71`	`71`	`}`
`72`	`72`	`<div class="container mx-auto mt-8 px-4 lg:mx-0 lg:flex-1">`
`73`	`73`	`<p class="flex items-center gap-1 text-gray-600">`