kuba/strona-czynna
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Make rounded corners optional photo component

Browse Source
This commit is contained in:
Kuba Orlik 2026-08-10 16:05:41 +02:00
parent 8935bcd362
commit 117d09059e
2 changed files with 13 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/back/jdd-components/photo/photo.css
View File

@ -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;

12
src/back/jdd-components/photo/photo.jdd.tsx
View File

@ -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,