mcp/carbon-components-svelte
1
0
Fork 0
mirror of https://github.com/carbon-design-system/carbon-components-svelte.git synced 2025-09-15 10:21:05 +00:00
Code Issues Projects Releases Packages Wiki Activity

docs: remove flaky iframe on:load behavior

Browse source
This commit is contained in:
Eric Liu 2020-10-24 15:20:04 -07:00
commit 626a1da8b0
1 changed files with 5 additions and 15 deletions
Download patch file Download diff file Expand all files Collapse all files

20
docs/src/components/Preview.svelte
View file

@ -4,18 +4,11 @@
export let src = ""; export let src = "";
export let framed = false; export let framed = false;
import { CodeSnippet, Button, InlineLoading } from "carbon-components-svelte"; import { CodeSnippet, Button } from "carbon-components-svelte";
import Launch16 from "carbon-icons-svelte/lib/Launch16"; import Launch16 from "carbon-icons-svelte/lib/Launch16";
import copy from "clipboard-copy"; import copy from "clipboard-copy";
import { url, beforeUrlChange } from "@sveltech/routify"; import { url, beforeUrlChange } from "@sveltech/routify";
import { theme } from "../store"; import { theme } from "../store";
let success = false;
$beforeUrlChange(() => {
if (success) success = false;
return true;
});
</script> </script>
<style global> <style global>
@ -135,10 +128,10 @@
<div class="preview"> <div class="preview">
{#if framed} {#if framed}
<div class="framed-header"> <div class="framed-header">
<div style="margin-left: var(--cds-spacing-03)"> <div
{#if framed && !success} style="margin-left: var(--cds-spacing-05); color: var(--cds-text-02)"
<InlineLoading description="Loading..." /> >
{/if} Content loaded in an iframe
</div> </div>
<Button <Button
style="margin-left: auto;" style="margin-left: auto;"
@ -155,9 +148,6 @@
<div class="preview-viewer" class:framed> <div class="preview-viewer" class:framed>
{#if framed} {#if framed}
<iframe <iframe
on:load="{() => {
success = true;
}}"
title="{src.split('/').pop()}" title="{src.split('/').pop()}"
src="{$url(`${src}?theme=${$theme}`)}" src="{$url(`${src}?theme=${$theme}`)}"
></iframe> ></iframe>