totole/sapper-template
1
0
Fork 0
mirror of https://github.com/kevin-DL/sapper-template.git synced 2026-01-11 18:14:27 +00:00
Code Issues Packages Projects Releases Wiki Activity

pass props.path down to nav - is a bit more self-explanatory

Browse Source
This commit is contained in:
Rich Harris
2018-06-28 14:34:06 -04:00
parent 365e8521ae
commit 1dcad25401
2 changed files with 4 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
app/App.html
View File

@@ -1,9 +1,4 @@
<Nav page={
props.path === '/' ? 'home' :
props.path === '/about' ? 'about' :
props.path.startsWith('/blog') ? 'blog' :
null
}/>
<Nav path={props.path}/>
<main>
<svelte:component this={Page} {...props}/>

6
components/Nav.html
View File

@@ -1,11 +1,11 @@
<nav>
<ul>
<li><a class='{page === "home" ? "selected" : ""}' href='.'>home</a></li>
<li><a class='{page === "about" ? "selected" : ""}' href='about'>about</a></li>
<li><a class='{path === "/" ? "selected" : ""}' href='.'>home</a></li>
<li><a class='{path === "/about" ? "selected" : ""}' href='about'>about</a></li>
<!-- for the blog link, we're using rel=prefetch so that Sapper prefetches
the blog data when we hover over the link or tap it on a touchscreen -->
<li><a rel=prefetch class='{page === "blog" ? "selected" : ""}' href='blog'>blog</a></li>
<li><a rel=prefetch class='{path.startsWith("/blog") ? "selected" : ""}' href='blog'>blog</a></li>
</ul>
</nav>