<script lang="ts">

  import Header from "../../pieces/Header.svelte";
  import Router from "svelte-spa-router";
  import { profileRoutes, prefix } from "../../routes/profileRoutes.js";

  // let dispatch = createEventDispatcher();


  // what if i did the fetch in ProfilePage rather than in each ProfileDisplay and ProfileSettings
  // i mean it would update each time no matter what right? cuz onMount? and then i keep the results in
  // a Store and it's all good right?

</script>

<!-- remove ={clickedHome} if you want to forward the event to App.svelte-->
<Header />

<!-- The Wave -->
<!-- <div class="spacer layer1"></div> -->

<div>
  <Router routes={profileRoutes} {prefix} />
</div>

<!-- <Footer /> -->


<style>

/* this doesn't work, fucks up all my sub routes */
  /* div {
    max-width: 960px;
    margin: 40px auto;
  } */





/* from Haikei */
  /* for any Haikei image */

  /* .spacer{
    aspect-ratio: 900/300;
    width: 100%;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
  } */
  
  /* the specific image we use, you need both classes */

  /* .layer1{
    background-image: url('/img/wave-haikei.svg');
  } */

</style>
