<script>
import Page1 from './Page1.svelte';
import Page2 from './Page2.svelte';
let page = Page1;
function selectPage1(){
page = Page1;
}
function selectPage2(){
page = Page2;
}
</script>
<nav>
<a href='/' on:click|preventDefault={selectPage1}>Page 1</a>
<a href='/' on:click|preventDefault={selectPage2}>Page 2</a>
</nav>
<svelte:component this={page} duration={3000}/>
<style>
nav{
background-color: #333;
overflow: hidden;
}
nav a {
float: left;
color: #f2f2f2;
text-align: center;
padding: 14px 16px;
text-decoration: none;
font-size: 17px;
}
nav a:hover {
background-color: #ddd;