|
9 | 9 |
|
10 | 10 | const { data }: PageProps = $props(); |
11 | 11 |
|
12 | | - let readmeIframeEl = $state<HTMLIFrameElement | null>(null); |
13 | | - let readmeIframeHeight = $state(800); |
14 | | -
|
15 | | - function handleReadmeIframeLoad() { |
16 | | - const doc = readmeIframeEl?.contentDocument; |
17 | | - if (!doc) return; |
18 | | -
|
19 | | - // Marimo's wasm app shell sets html/body to 100vh with internal scrolling, |
20 | | - // which prevents the iframe from sizing to real content. Override so the |
21 | | - // document flows naturally and scrollHeight reflects actual content height. |
22 | | - const style = doc.createElement('style'); |
23 | | - style.textContent = ` |
24 | | - html, body { |
25 | | - height: auto !important; |
26 | | - min-height: 0 !important; |
27 | | - max-height: none !important; |
28 | | - overflow: visible !important; |
29 | | - } |
30 | | - #App, #root, marimo-mount, [class*="marimo"] { |
31 | | - height: auto !important; |
32 | | - min-height: 0 !important; |
33 | | - max-height: none !important; |
34 | | - overflow: visible !important; |
35 | | - } |
36 | | - `; |
37 | | - (doc.head ?? doc.documentElement).appendChild(style); |
38 | | -
|
39 | | - const update = () => { |
40 | | - const h = Math.max( |
41 | | - doc.documentElement?.scrollHeight ?? 0, |
42 | | - doc.body?.scrollHeight ?? 0 |
43 | | - ); |
44 | | - if (h > 0) readmeIframeHeight = h; |
45 | | - }; |
46 | | -
|
47 | | - update(); |
48 | | - const ro = new ResizeObserver(update); |
49 | | - if (doc.documentElement) ro.observe(doc.documentElement); |
50 | | - if (doc.body) ro.observe(doc.body); |
51 | | - } |
52 | | -
|
53 | 12 | // Extract repository URL safely |
54 | 13 | const repositoryUrl = $derived( |
55 | 14 | data.project_url?.find((url: string) => url.startsWith('repository,'))?.split(', ')[1] |
|
142 | 101 |
|
143 | 102 | {#if data.readme_py} |
144 | 103 | <iframe |
145 | | - bind:this={readmeIframeEl} |
146 | 104 | src={resolve('/readme_py/readme_py.html')} |
147 | 105 | title="README" |
148 | 106 | loading="lazy" |
149 | | - onload={handleReadmeIframeLoad} |
150 | | - class="w-full max-w-4xl rounded-2xl border border-bg300 bg-bg100 text-left shadow-lg" |
151 | | - style="height: {readmeIframeHeight}px;" |
| 107 | + class="h-[96vh] w-full max-w-4xl rounded-2xl border mb-28 border-bg300 bg-bg100 text-left shadow-lg" |
152 | 108 | ></iframe> |
153 | 109 | {:else if data.description} |
154 | 110 | <div |
|
0 commit comments