50 lines
870 B
Sass
50 lines
870 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)
|
|
|
|
$nav-height: 60px
|
|
|
|
body
|
|
padding-top: $nav-height
|
|
background: lightgrey
|
|
|
|
.container
|
|
max-width: 1100px
|
|
padding: 20px 30px
|
|
|
|
#main-nav
|
|
position: fixed
|
|
top: 0
|
|
left: 0
|
|
width: 100%
|
|
height: $nav-height
|
|
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
|
|
|
|
#main-wrapper
|
|
margin-top: 25px
|
|
background: white
|