@@ -18,9 +18,10 @@ import { ScalingIframe } from "@components/ScalingIframe";
1818interface Props {
1919 sketchId: string ;
2020 authorName: string ;
21+ title: string ;
2122}
2223
23- const { sketchId, authorName } = Astro .props ;
24+ const { sketchId, authorName, title } = Astro .props ;
2425const sketchInfo = await getSketch (sketchId );
2526
2627const currentLocale = getCurrentLocale (Astro .url .pathname );
@@ -46,46 +47,56 @@ if (width && height) {
4647 heightOverWidth = height / width ;
4748}
4849
49- const iframeTitle = ` OpenProcessing Sketch: ${sketchInfo . title } by ${authorName } ` ;
50+ const iframeTitle = ` OpenProcessing Sketch: ${title } by ${authorName } ` ;
5051---
5152
5253<Head
53- title ={ sketchInfo . title }
54+ title ={ title }
5455 locale ={ currentLocale }
5556 featuredImageSrc ={ featuredImageURL }
5657 description ={ sketchInfo .instructions }
5758/>
5859
5960<BaseLayout
60- title ={ sketchInfo . title }
61+ title ={ title }
6162 titleAuthor ={ authorName }
6263 subtitle ={ dateString }
6364 variant =" item"
6465 topic ={ " community" }
6566>
6667 <div class =" max-w-[770px]" >
67- <div style ={ {
68- position: ' relative' ,
69- width: ' 100%' ,
70- paddingBottom: ` ${(heightOverWidth * 100 ).toFixed (4 )}% ` ,
71- }} >
72- { width ? (
73- <ScalingIframe
74- client :load
75- src = { makeSketchEmbedUrl (sketchInfo .visualID )}
76- width = { width }
77- height = { height }
78- title = { iframeTitle }
79- />
80- ) : (
81- <iframe
82- src = { makeSketchEmbedUrl (sketchInfo .visualID )}
83- width = " 100%"
84- height = " 100%"
85- style = { { position: ' absolute' , top: 0 , left: 0 , right: 0 , bottom: 0 }}
86- title = { iframeTitle }
87- />
88- )}
68+ <div
69+ style ={ {
70+ position: " relative" ,
71+ width: " 100%" ,
72+ paddingBottom: ` ${(heightOverWidth * 100 ).toFixed (4 )}% ` ,
73+ }}
74+ >
75+ {
76+ width ? (
77+ <ScalingIframe
78+ client :load
79+ src = { makeSketchEmbedUrl (sketchInfo .visualID )}
80+ width = { width }
81+ height = { height }
82+ title = { iframeTitle }
83+ />
84+ ) : (
85+ <iframe
86+ src = { makeSketchEmbedUrl (sketchInfo .visualID )}
87+ width = " 100%"
88+ height = " 100%"
89+ style = { {
90+ position: " absolute" ,
91+ top: 0 ,
92+ left: 0 ,
93+ right: 0 ,
94+ bottom: 0 ,
95+ }}
96+ title = { iframeTitle }
97+ />
98+ )
99+ }
89100 </div >
90101 <div class =" py-md grid gap-y-sm md:gap-y-md" >
91102 <LinkButton
0 commit comments