39 lines
710 B
Sass
39 lines
710 B
Sass
|
$primary-color: yellow
|
||
|
$primary-color-highlight: darken($primary-color, 10%)
|
||
|
|
||
|
$box-shadow-1: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23)
|
||
|
$box-shadow-2: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23)
|
||
|
|
||
|
body
|
||
|
background: lightgrey
|
||
|
|
||
|
#main-nav
|
||
|
position: fixed
|
||
|
top: 0
|
||
|
left: 0
|
||
|
width: 100%
|
||
|
height: 60px
|
||
|
background: #212121
|
||
|
color: #eee
|
||
|
font-size: 2.75rem
|
||
|
box-shadow: $box-shadow-1
|
||
|
|
||
|
.nav-left
|
||
|
float: left
|
||
|
|
||
|
.nav-menu
|
||
|
list-style: none
|
||
|
padding-left: 15px
|
||
|
|
||
|
li
|
||
|
display: inline-block
|
||
|
margin-top: 6px
|
||
|
margin-left: 15px
|
||
|
|
||
|
.nav-link a
|
||
|
color: $primary-color
|
||
|
transition: all 230ms ease-in-out
|
||
|
|
||
|
&:hover
|
||
|
color: $primary-color-highlight
|