bilal/kolaytercih
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update component configurations and styles: add new registry for @magicui in components.json, remove unused opengraph image files, and enhance opengraph-image.tsx with new font loading and styling adjustments. Refactor button sizes and styles in various components for improved responsiveness and visual consistency. Overall, these changes aim to streamline the application and enhance user experience.
Some checks failed
Deploy / deploy (push) Has been cancelled
Details

Browse Source
This commit is contained in:
bilalgursen
2026-08-01 18:54:43 +03:00
parent 55eb32b22a
commit b3dd36fa72
23 changed files with 260 additions and 28 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/app/globals.css
View File

@@ -215,4 +215,4 @@
/* scroll-behavior: smooth KULLANMA — Lenis (ScrollFlow, anchors: true)
kaydırmayı zaten yumuşatıyor; ikisi birlikte çift yumuşatma yapar. */
}
}
}

1
src/app/opengraph-image.alt.txt
View File

@@ -1 +0,0 @@
KolayTercih — YKS tercihin, gerçek YÖK Atlas verisiyle. Sıralamanı gir, dengeli 24 tercihlik listeni al.

BIN
src/app/opengraph-image.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 43 KiB

92
src/app/opengraph-image.tsx Normal file
View File

@@ -0,0 +1,92 @@
import { ImageResponse } from "next/og";
import { loadSiteOgFonts } from "@/lib/og-fonts";
export const alt =
"KolayTercih — YKS tercihin, gerçek YÖK Atlas verisiyle. Sıralamanı gir, dengeli 24 tercihlik listeni al.";
export const size = { width: 1200, height: 630 };
export const contentType = "image/png";
export default async function OpenGraphImage() {
const fonts = await loadSiteOgFonts();
return new ImageResponse(
(
<div
style={{
display: "flex",
width: "100%",
height: "100%",
alignItems: "center",
justifyContent: "center",
background: "white",
}}
>
<div
style={{
display: "flex",
flexDirection: "column",
alignItems: "center",
maxWidth: 920,
padding: "0 48px",
}}
>
<div
style={{
display: "flex",
alignItems: "center",
fontFamily: "Bricolage Grotesque",
letterSpacing: "-0.05em",
color: "#0f172a",
}}
>
<svg
width="64"
height="64"
viewBox="0 0 180 180"
style={{ display: "flex", marginRight: 4 }}
>
<rect x="27" y="56" width="57" height="57" rx="13" fill="#3b82f6" />
<rect x="91" y="29" width="56" height="56" rx="13" fill="#fdc7a7" />
<rect x="91" y="95" width="56" height="56" rx="13" fill="#ff5a00" />
</svg>
<span style={{ display: "flex", fontSize: 72, lineHeight: 1 }}>
<span style={{ fontWeight: 300 }}>Kolay</span>
<span style={{ fontWeight: 600 }}>Tercih</span>
</span>
</div>
<div
style={{
display: "flex",
marginTop: 28,
fontFamily: "Clarity City",
fontSize: 34,
fontWeight: 600,
lineHeight: 1.25,
textAlign: "center",
color: "#1e293b",
}}
>
YKS tercihin, gerçek YÖK Atlas verisiyle
</div>
<div
style={{
display: "flex",
marginTop: 16,
fontFamily: "Clarity City",
fontSize: 26,
fontWeight: 300,
lineHeight: 1.3,
textAlign: "center",
color: "#64748b",
}}
>
Sıralamanı gir · Dengeli 24 tercihlik listeni al
</div>
</div>
</div>
),
{ ...size, fonts },
);
}

18
src/app/rehber/[slug]/opengraph-image.tsx
View File

@@ -1,5 +1,6 @@
import { ImageResponse } from "next/og";
import { getRehber } from "@/lib/rehber";
import { loadRehberOgFonts } from "@/lib/og-fonts";
import {
rehberBasliginiBol,
rehberMetniniParcala,
@@ -18,6 +19,7 @@ export default async function RehberOpenGraphImage({
const yazi = getRehber(slug);
const baslik = yazi?.baslik ?? "Tercih Rehberi";
const { vurgu, kalan } = rehberBasliginiBol(baslik);
const fonts = await loadRehberOgFonts();
return new ImageResponse(
(
@@ -30,7 +32,7 @@ export default async function RehberOpenGraphImage({
overflow: "hidden",
background: "white",
color: "#2563eb",
fontFamily: "sans-serif",
fontFamily: "Bricolage Grotesque",
}}
>
{[
@@ -108,6 +110,7 @@ export default async function RehberOpenGraphImage({
style={{
display: "flex",
alignItems: "center",
fontFamily: "Clarity City",
fontSize: 20,
fontWeight: 700,
letterSpacing: "0.18em",
@@ -123,8 +126,9 @@ export default async function RehberOpenGraphImage({
display: "flex",
flexWrap: "wrap",
maxWidth: 980,
fontFamily: "Cal Sans",
fontSize: baslik.length > 70 ? 48 : baslik.length > 52 ? 54 : 62,
fontWeight: 300,
fontWeight: 400,
lineHeight: 1.02,
letterSpacing: "-0.025em",
color: "#2563eb",
@@ -133,8 +137,9 @@ export default async function RehberOpenGraphImage({
<span
style={{
display: "flex",
fontFamily: "Bricolage Grotesque",
color: "#ff5a00",
fontWeight: 700,
fontWeight: 600,
letterSpacing: "-0.04em",
}}
>
@@ -144,6 +149,7 @@ export default async function RehberOpenGraphImage({
key={i}
style={{
display: "flex",
fontFamily: "Bricolage Grotesque",
fontStyle: "italic",
fontWeight: 800,
}}
@@ -168,6 +174,7 @@ export default async function RehberOpenGraphImage({
key={i}
style={{
display: "flex",
fontFamily: "Bricolage Grotesque",
fontStyle: "italic",
fontWeight: 800,
}}
@@ -203,18 +210,19 @@ export default async function RehberOpenGraphImage({
style={{
display: "flex",
marginLeft: 2,
fontFamily: "Bricolage Grotesque",
fontSize: 24,
letterSpacing: "-0.05em",
color: "#2563eb",
}}
>
<span style={{ fontWeight: 300 }}>Kolay</span>
<span style={{ fontWeight: 700 }}>Tercih</span>
<span style={{ fontWeight: 600 }}>Tercih</span>
</span>
</div>
</div>
</div>
),
size,
{ ...size, fonts },
);
}