add fixed header

This commit is contained in:
Nolan Lawson 2018-01-10 22:17:15 -08:00
parent 3bba43ea17
commit e1d8419b11
3 changed files with 15 additions and 3 deletions

View File

@ -7,12 +7,19 @@ body {
background: white;
}
#svelte {
display: flex;
flex-direction: column;
}
main {
overflow-x: hidden;
overflow-y: auto;
position: relative;
max-width: 800px;
padding: 15px 15px;
box-sizing: border-box;
margin: 0 auto;
margin: 75px auto;
}
h1, h2, h3, h4, h5, h6 {

View File

@ -3,7 +3,6 @@
<main>
<slot></slot>
</main>
<script>
import Nav from './Nav.html';

View File

@ -41,6 +41,12 @@
nav {
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
background: royalblue;
position: fixed;
left: 0;
right: 0;
top: 0;
z-index: 10;
will-change: transform; /* avoids "repaints on scroll" for fixed position header */
}
ul {