github.com/kardianos/nomad@v0.1.3-0.20151022182107-b13df73ee850/website/source/assets/stylesheets/_header.scss (about) 1 // 2 // Header 3 // -------------------------------------------------- 4 5 #header { 6 position: relative; 7 height: 92px; 8 color: $white; 9 text-rendering: optimizeLegibility; 10 margin-bottom: 0; 11 /* opacity: 0; 12 @include translate3d(0, -10px, 0); */ 13 transition: all 1s ease; 14 background-color: $white; 15 16 /* &.showit{ 17 opacity: 1; 18 @include translate3d(0, 0px, 0); 19 transition: all 1s ease; 20 } */ 21 22 // &.navbar-static-top{ 23 // height:70px; 24 // z-index: 1000; 25 // } 26 27 .navbar-header{ 28 29 .navbar-toggle{ 30 padding-right: 15px; 31 margin-top: 26px; 32 margin-bottom: 14px; 33 margin-right: 0; 34 //border: 2px solid $white; 35 border-radius: 0; 36 .icon-bar{ 37 border: 1px solid $black; 38 border-radius: 0; 39 } 40 } 41 } 42 43 44 .navbar-brand { 45 display: inline-block; 46 padding: 0; 47 margin: 16px 10px 0 0 ; 48 49 .logo{ 50 display: inline-block; 51 height: 56px; 52 padding: 0; 53 color: $gray-darker; 54 font-family: $font-family-blanc; 55 font-size: 28px; 56 line-height: 56px; 57 padding-left: 60px; 58 background: image-url('../images/logo-header.png') 0 0 no-repeat; 59 @include img-retina("../images/logo-header.png", "../images/logo-header@2x.png", 49px, 56px); 60 61 &:hover{ 62 @include transition(all 300ms ease-in); 63 color: $green-dark; 64 text-decoration: none; 65 } 66 } 67 } 68 69 .main-links.navbar-nav{ 70 margin-top: 36px; 71 margin-left: 120px; 72 73 li > a { 74 @include v-nav-style(); 75 } 76 } 77 78 .buttons{ 79 ul.navbar-nav{ 80 margin-top: 36px; 81 li { 82 padding-left: 12px; 83 84 &.download{ 85 background: image-url('../images/icon-download.png') 0 0 no-repeat; 86 @include img-retina("../images/icon-download.png", "../images/icon-download@2x.png", 18px, 18px); 87 margin-right: 22px; 88 background-position: 0 1px; 89 } 90 91 &.github{ 92 background: image-url('../images/icon-github.png') 0 0 no-repeat; 93 @include img-retina("../images/icon-github.png", "../images/icon-github@2x.png", 19px, 18px); 94 background-position: 0 1px; 95 } 96 97 >a { 98 @include v-nav-style(); 99 } 100 } 101 } 102 } 103 104 .nav > li > a:hover, .nav > li > a:focus { 105 background-color: transparent; 106 color: $black; 107 @include transition( color 0.3s ease ); 108 } 109 } 110 111 @media (min-width: 992px) { 112 113 } 114 115 @media (max-width: 992px) { 116 117 } 118 119 @media (max-width: 992px) { 120 #header{ 121 .main-links.navbar-nav{ 122 margin-left: 20px; 123 } 124 125 .buttons{ 126 ul.navbar-nav{ 127 li { 128 &.download{ 129 margin-right: 8px; 130 } 131 } 132 } 133 } 134 } 135 136 } 137 138 @media (max-width: 763px) { 139 .navbar-static-top { 140 .nav-white { 141 background-color:rgba(0,0,0,0.5); 142 } 143 } 144 } 145 146 @media (max-width: 320px) { 147 148 }