💄 Optimized widget

This commit is contained in:
LittleSheep 2024-02-10 02:41:50 +08:00
parent 138bbb0944
commit 9024d5246e
2 changed files with 18 additions and 13 deletions

View File

@ -3,15 +3,15 @@ import RootLayout from "../layouts/RootLayout.astro";
--- ---
<RootLayout> <RootLayout>
<iframe class="moments-frame" src="https://feed.smartsheep.studio/realms/1?embedded=yes" /> <iframe class="moments-frame" src="https://feed.smartsheep.studio/realms/1?embedded=yes"></iframe>
</RootLayout> </RootLayout>
<style> <style>
.moments-frame { .moments-frame {
margin-top: 64px; margin-top: 64px;
display: block; display: block;
border: 0; border: 0;
width: 100vw; width: 100vw;
height: calc(100vh - 64px); height: calc(100vh - 64px);
} }
</style> </style>

View File

@ -121,11 +121,9 @@ const embedOptions = new URLSearchParams({
element.height = height ? `${height}px` : "360px"; element.height = height ? `${height}px` : "360px";
} }
window.addEventListener("DOMContentLoaded", () => { const widget = document.querySelector<HTMLIFrameElement>("#interactive-iframe");
const element = document.querySelector<HTMLIFrameElement>("#interactive-iframe"); widget?.addEventListener("onload", () => {
if (element) { resizeInteractiveWidget(widget);
resizeInteractiveWidget(element);
}
}); });
</script> </script>
@ -152,4 +150,11 @@ const embedOptions = new URLSearchParams({
grid-template-columns: 2fr 1fr; grid-template-columns: 2fr 1fr;
} }
} }
#interactive-iframe {
display: block;
border: 0;
width: 100%;
min-height: 360px;
}
</style> </style>