From 117d09059e3cf452e2f865989fe74a96886daec2 Mon Sep 17 00:00:00 2001
From: Kuba Orlik <kontakt@kuba-orlik.name>
Date: Mon, 10 Aug 2026 16:05:41 +0200
Subject: [PATCH] Make rounded corners optional  photo component

---
 src/back/jdd-components/photo/photo.css     |  4 +++-
 src/back/jdd-components/photo/photo.jdd.tsx | 12 ++++++++++--
 2 files changed, 13 insertions(+), 3 deletions(-)

diff --git a/src/back/jdd-components/photo/photo.css b/src/back/jdd-components/photo/photo.css
index 96d7158..a358300 100644
--- a/src/back/jdd-components/photo/photo.css
+++ b/src/back/jdd-components/photo/photo.css
@@ -2,7 +2,9 @@
 	display: flex; /* to get rid of added whitespace */
 
 	picture {
-		border-radius: 10px;
+		.image-jdd--rounded & {
+			border-radius: 10px;
+		}
 
 		img {
 			width: auto;
diff --git a/src/back/jdd-components/photo/photo.jdd.tsx b/src/back/jdd-components/photo/photo.jdd.tsx
index bae5478..edb868d 100644
--- a/src/back/jdd-components/photo/photo.jdd.tsx
+++ b/src/back/jdd-components/photo/photo.jdd.tsx
@@ -12,6 +12,7 @@ const component_arguments = {
 		image: new ComponentArguments.Image(),
 		alt: new ComponentArguments.ShortText(),
 	}),
+	rounded_corners: new ComponentArguments.Boolean(),
 } as const;
 
 export class Photo extends Component<typeof component_arguments> {
@@ -31,13 +32,20 @@ export class Photo extends Component<typeof component_arguments> {
 	}
 
 	toHTML({
-		args: { image },
+		args: { image, rounded_corners },
 		classes,
 		jdd_context: { render_image },
 		index,
 	}: ComponentToHTMLArgs<typeof component_arguments>): FlatTemplatable {
 		return (
-			<div class={["image-jdd", ...classes]} style={`--jdd-index: ${index}`}>
+			<div
+				class={[
+					"image-jdd",
+					{ "image-jdd--rounded": rounded_corners },
+					...classes,
+				]}
+				style={`--jdd-index: ${index}`}
+			>
 				{render_image(image.image, {
 					sizesAttr: "100vw",
 					alt: image.alt,