michalvankodev/michalvankodev-site
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add some dark styles

Browse Source
This commit is contained in:
Michal Vanko
2019-09-10 21:23:50 +02:00
parent 3fc5ad4d90
commit 5e6971692e
5 changed files with 75 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

42
src/components/Nav.svelte
View File

@ -3,7 +3,7 @@
</script>
<style>
nav {
/* nav {
border-bottom: 1px solid rgba(255,62,0,0.1);
font-weight: 300;
padding: 0 1em;
@ -15,7 +15,7 @@
}
/* clearfix */
ul::after {
/* ul::after {
content: '';
display: block;
clear: both;
@ -39,22 +39,48 @@
background-color: rgb(255,62,0);
display: block;
bottom: -1px;
}
} */
a {
/* a {
text-decoration: none;
padding: 1em 0.5em;
display: block;
}
} */
nav {
position: sticky;
top: 0;
background: rgb(31, 22, 94);
z-index: 1;
padding: 0.5em;
box-shadow: 0px 2px 4px #090808;
}
nav a {
padding: 0.4em 0.5em;
text-decoration: none;
}
nav a:hover {
text-decoration: underline
}
</style>
<nav>
<ul>
<!-- <ul> -->
<!-- <li><a class='{segment === undefined ? "selected" : ""}' href='.'>home</a></li> -->
<li><a class='{segment === "portfolio" ? "selected" : ""}' href='portfolio'>portfolio</a></li>
<!-- <li><a class='{segment === "portfolio" ? "selected" : ""}' href='portfolio'>portfolio</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='{segment === "blog" ? "selected" : ""}' href='blog'>blog</a></li> -->
</ul>
<!-- </ul> -->
<div class="page-navigation">
<a href="portfolio#personal-information">About</a>
<a href="portfolio#skills">Skills</a>
<a href="portfolio#work-history">Work History</a>
<a href="portfolio#projects">Projects</a>
<a href="portfolio#education">Education</a>
</div>
</nav>