/////////////////// // // // HEADER // // // /////////////////// .main-header-full { position: fixed; z-index: 10000; left: 0; top: 0; width: 100%; background: $dark-polar; height: 3em; line-height: 3em; box-shadow: 0 0 0.15em 0 rgba(0, 0, 0, 0.1); } .main-header { .avatar { height: 2rem; margin: auto 0.5rem auto auto; border-radius: 35%; @include breakpoint(tablet) { display: none; } @include breakpoint(mobile) { display: none; } } .avatar.hidden { display:none; } @include header-title-mobile @include breakpoint(laptop) { @include header-title-full } @include breakpoint(desktop) { @include header-title-full } article { flex-grow: 1; } .title { } nav.full { @include breakpoint(mobile) { display: none; } @include breakpoint(tablet) { display: none; } ul { display: flex; margin: 0 auto 0 auto; padding: 0 0 0 3rem; justify-content: flex-end; li { margin-right: .5rem; @include breakpoint(desktop) { margin-right: 1.5rem; } } } @include inline-list; .rss-icon { max-width: 18%; } } nav.mobile { @include breakpoint(desktop) { display: none; } @include breakpoint(laptop) { display: none; } } @include breakpoint(tablet) { @include mobile-nav; } @include breakpoint(mobile) { @include mobile-nav; } }