aboutsummaryrefslogtreecommitdiffhomepage
path: root/src
diff options
context:
space:
mode:
Diffstat (limited to 'src')
-rw-r--r--src/pages/og/[slug].png.ts69
1 files changed, 25 insertions, 44 deletions
diff --git a/src/pages/og/[slug].png.ts b/src/pages/og/[slug].png.ts
index 0481681..3c695f0 100644
--- a/src/pages/og/[slug].png.ts
+++ b/src/pages/og/[slug].png.ts
@@ -74,70 +74,49 @@ export async function GET({ params }: { params: { slug: string } }) {
flex: "1",
},
children: [
- // 3-line slogan as the main element
+ // Page title as the main element
+ {
+ type: "div",
+ props: {
+ style: {
+ fontSize: "48px",
+ fontWeight: "700",
+ lineHeight: "1.2",
+ letterSpacing: "-0.02em",
+ },
+ children: title,
+ },
+ },
+ // 3-line slogan (inline, smaller)
{
type: "div",
props: {
style: {
display: "flex",
- flexDirection: "column",
- gap: "4px",
+ gap: "14px",
+ fontSize: "24px",
+ fontWeight: "500",
+ color: "#a5b4fc",
},
children: [
+ { type: "div", props: { children: "だれもが" } },
{
type: "div",
props: {
- style: {
- fontSize: "46px",
- fontWeight: "800",
- lineHeight: "1.15",
- color: "#ffffff",
- },
- children: "だれもが",
- },
- },
- {
- type: "div",
- props: {
- style: {
- fontSize: "46px",
- fontWeight: "800",
- lineHeight: "1.15",
- color: "#c7d2fe",
- },
+ style: { color: "#c7d2fe" },
children: "しあわせに",
},
},
{
type: "div",
props: {
- style: {
- fontSize: "46px",
- fontWeight: "800",
- lineHeight: "1.15",
- color: "#a5b4fc",
- },
+ style: { color: "#e0e7ff" },
children: "暮らせるまちへ",
},
},
],
},
},
- // Page title
- {
- type: "div",
- props: {
- style: {
- fontSize: "26px",
- fontWeight: "500",
- lineHeight: "1.3",
- color: "#e0e7ff",
- paddingTop: "8px",
- borderTop: "1px solid rgba(255,255,255,0.15)",
- },
- children: title,
- },
- },
// Name + domain
{
type: "div",
@@ -147,15 +126,17 @@ export async function GET({ params }: { params: { slug: string } }) {
gap: "16px",
fontSize: "20px",
fontWeight: "400",
- color: "rgba(255,255,255,0.55)",
+ color: "rgba(255,255,255,0.45)",
+ paddingTop: "12px",
+ borderTop: "1px solid rgba(255,255,255,0.1)",
},
children: [
{ type: "div", props: { children: "小平市議 安竹洋平" } },
{
type: "div",
props: {
- children: "yasutakeyohei.com",
style: { opacity: "0.6" },
+ children: "yasutakeyohei.com",
},
},
],