2016-10-31 21:04:15 +03:00
|
|
|
//- 💫 CSS > COMPONENTS > NAVIGATION
|
2016-10-03 21:19:13 +03:00
|
|
|
|
|
|
|
|
.c-nav
|
2017-10-03 15:14:52 +03:00
|
|
|
@include position(fixed, top, left, 0, 0)
|
2016-10-03 21:19:13 +03:00
|
|
|
@include size(100%, $nav-height)
|
|
|
|
|
background: $color-back
|
|
|
|
|
color: $color-theme
|
2016-10-31 21:04:15 +03:00
|
|
|
align-items: center
|
2016-10-03 21:19:13 +03:00
|
|
|
display: flex
|
|
|
|
|
justify-content: space-between
|
2017-10-03 15:14:52 +03:00
|
|
|
flex-flow: row wrap
|
2016-10-31 21:04:15 +03:00
|
|
|
padding: 0 2rem 0 1rem
|
2017-10-03 15:14:52 +03:00
|
|
|
z-index: 30
|
2016-10-03 21:19:13 +03:00
|
|
|
width: 100%
|
2017-10-03 15:14:52 +03:00
|
|
|
box-shadow: $box-shadow
|
2016-10-03 21:19:13 +03:00
|
|
|
|
2017-10-03 15:14:52 +03:00
|
|
|
//@include breakpoint(min, md)
|
|
|
|
|
// position: fixed
|
2016-10-03 21:19:13 +03:00
|
|
|
|
2016-10-31 21:04:15 +03:00
|
|
|
&.is-fixed
|
|
|
|
|
animation: slideInDown 0.5s ease-in-out
|
|
|
|
|
position: fixed
|
2016-10-03 21:19:13 +03:00
|
|
|
|
|
|
|
|
.c-nav__menu
|
|
|
|
|
@include size(100%)
|
|
|
|
|
display: flex
|
|
|
|
|
justify-content: flex-end
|
|
|
|
|
flex-flow: row nowrap
|
|
|
|
|
border-color: inherit
|
2017-10-03 15:14:52 +03:00
|
|
|
flex: 1
|
2016-10-03 21:19:13 +03:00
|
|
|
|
|
|
|
|
.c-nav__menu__item
|
|
|
|
|
display: flex
|
|
|
|
|
align-items: center
|
|
|
|
|
height: 100%
|
2016-10-31 21:04:15 +03:00
|
|
|
text-transform: uppercase
|
2017-10-03 15:14:52 +03:00
|
|
|
font-family: $font-secondary
|
|
|
|
|
font-size: 1.6rem
|
|
|
|
|
font-weight: bold
|
|
|
|
|
color: $color-theme
|
|
|
|
|
|
|
|
|
|
&:not(:first-child)
|
|
|
|
|
margin-left: 2em
|
2016-10-03 21:19:13 +03:00
|
|
|
|
2017-10-03 15:14:52 +03:00
|
|
|
&.is-active
|
|
|
|
|
color: $color-dark
|
|
|
|
|
pointer-events: none
|
