github.com/ezbercih/terraform@v0.1.1-0.20140729011846-3c33865e0839/website/source/stylesheets/_footer.less (about) 1 2 #footer-wrap{ 3 background-color: white; 4 padding: 0 0 50px 0; 5 } 6 7 body.page-home{ 8 #footer{ 9 margin-top: -40px; 10 } 11 } 12 13 #footer{ 14 padding: 140px 0 40px; 15 color: black; 16 background-color: white; 17 .skew { 18 .skewY(-2deg); 19 } 20 21 >.container.skew{ 22 .skewY(2deg); 23 } 24 25 a{ 26 color: black; 27 } 28 29 30 .footer-links{ 31 margin-bottom: 20px; 32 33 .li-under a:hover::after, 34 .li-under a:focus::after { 35 opacity: 1; 36 -webkit-transform: skewY(15deg) translateY(8px); 37 -moz-transform: skewY(15deg) translateY(8px); 38 transform: skewY(15deg) translateY(8px); 39 } 40 41 .li-under a::after { 42 background-color: @purple; 43 } 44 45 li{ 46 a{ 47 text-transform: uppercase; 48 font-size: 12px; 49 letter-spacing: 3px; 50 .transition( color 0.3s ease ); 51 font-weight: 400; 52 53 &:hover{ 54 color: @purple; 55 .transition( color 0.3s ease ); 56 background-color: transparent; 57 } 58 } 59 } 60 } 61 62 .buttons.navbar-nav{ 63 float: none; 64 display: inline-block; 65 margin-bottom: 30px; 66 margin-top: 0px; 67 68 li{ 69 &.first{ 70 margin-right: 12px; 71 } 72 73 &.download{ 74 a{ 75 background: url(../images/icon-download-purple.png) 8px 6px no-repeat; 76 .img-retina("../images/icon-download-purple.png", "../images/icon-download-purple@2x.png", 20px, 20px); 77 } 78 } 79 80 &.github{ 81 a{ 82 background: url(../images/icon-github-purple.png) 8px 6px no-repeat; 83 .img-retina("../images/icon-github-purple.png", "../images/icon-github-purple@2x.png", 20px, 20px); 84 } 85 } 86 } 87 88 li > a { 89 padding-top: 6px; 90 padding-bottom: 6px; 91 padding-left: 40px; 92 } 93 } 94 95 .footer-hashi{ 96 float: right; 97 padding-top: 5px; 98 letter-spacing: 2px; 99 100 a{ 101 color: black; 102 font-weight: @font-weight-lato-xb; 103 } 104 105 span{ 106 margin-right: 10px; 107 } 108 109 .hashi-logo{ 110 display: inline-block; 111 vertical-align: middle; 112 i{ 113 display: inline-block; 114 width: 37px; 115 height: 40px; 116 background: url(../images/footer-hashicorp-logo.png) 0 0 no-repeat; 117 .img-retina("../images/footer-hashicorp-logo.png", "../images/footer-hashicorp-logo@2x.png", 37px, 40px); 118 } 119 } 120 } 121 } 122 123 .page-sub{ 124 #footer-wrap{ 125 padding: 0; 126 } 127 128 #footer{ 129 padding: 140px 0 100px; 130 background-color: @black; 131 transform: none; 132 133 >.container{ 134 transform: none; 135 } 136 137 a{ 138 color: white; 139 } 140 141 .footer-hashi{ 142 color: white; 143 144 .hashi-logo{ 145 i{ 146 background: url(../images/footer-hashicorp-white-logo.png) 0 0 no-repeat; 147 .img-retina("../images/footer-hashicorp-white-logo.png", "../images/footer-hashicorp-white-logo@2x.png", 37px, 40px); 148 } 149 } 150 } 151 } 152 } 153 154 @media (max-width: 992px) { 155 .page-sub #footer, #footer{ 156 .footer-hashi { 157 padding-top: 14px; 158 span{ 159 margin-right: 6px; 160 } 161 .hashi-logo{ 162 i{ 163 margin-top: -6px; 164 width: 20px; 165 height: 22px; 166 background-size: 20px 22px; 167 } 168 } 169 } 170 } 171 172 173 } 174 175 @media (max-width: 768px) { 176 #footer{ 177 padding: 100px 0 40px; 178 text-align: center; 179 180 .footer-links{ 181 float: none; 182 display: inline-block; 183 } 184 185 .footer-hashi { 186 float: none; 187 display: inline-block; 188 189 .pull-right{ 190 float: none !important; 191 } 192 } 193 } 194 } 195 196 @media (max-width: 320px) { 197 #footer{ 198 text-align: center; 199 200 .footer-links{ 201 .li-under{ 202 float: none !important; 203 } 204 } 205 } 206 } 207 208