<script>
import One from './one.svelte'
import Two from './two.svelte'
import { quintOut } from 'svelte/easing';
import { crossfade } from 'svelte/transition';
import { Tabs, Tab, TabList, TabPanel } from 'svelte-tabs';
let name = 'world';
const [send, receive] = crossfade({
duration: d => Math.sqrt(d * 200),
fallback(node, params) {
const style = getComputedStyle(node);
const transform = style.transform === 'none' ? '' : style.transform;
return {
duration: 600,
easing: quintOut,
css: t => `
transform: ${transform} scale(${t});
opacity: ${t}
`
};
}
});
</script>
<style>
:global(.svelte-tabs) {
display: grid;
}
:global(.svelte-tabs div.svelte-tabs__tab-panel) {
grid-row: 2;
grid-column: 1;