website-cb-mirror/src/App.svelte

61 lines
1.6 KiB
Svelte

<script>
import { Router, Route } from "svelte-navigator"
import Home from "./lib/routes/Home.svelte"
import Contact from "./lib/routes/Contact.svelte"
import Navbar from "./lib/Navbar.svelte";
import Recommendations from "./lib/routes/Recommendations.svelte";
import Projects from "./lib/routes/Projects.svelte";
import Links from "./lib/routes/Links.svelte";
import NotFound from "./lib/routes/NotFound.svelte";
import Skeletons from "./lib/Skeletons.svelte";
</script>
<Router>
<h1>sofi web</h1>
<Skeletons/>
<div>
<nav>
<Navbar/>
</nav>
<main>
<Route path="/" component={Home} primary={false}/>
<Route path="/contact" component={Contact} primary={false}/>
<Route path="/recommendations" component={Recommendations} primary={false}/>
<Route path="/projects" component={Projects} primary={false}/>
<Route path="/links" component={Links} primary={false}/>
<Route path="*" component={NotFound} primary={false}/>
</main>
</div>
</Router>
<style>
h1 {
font-size: 50px;
text-align: center;
text-decoration: underline;
text-decoration-color: #d52c9c;
}
div {
display: flex;
margin: 0 10px;
gap: 15px;
justify-content: center;
}
main {
width: 40vw;
}
@media only screen and (max-width: 600px) {
div {
display: block;
width: 100%;
}
main {
width: 90%;
}
}
</style>