Permalink
Browse files

Added sticky footer.

  • Loading branch information...
1 parent fceb920 commit 7595690b6d47909765d10cfede29ffc7d2343d2b @jenmyers jenmyers committed Apr 18, 2012
Showing with 31 additions and 2 deletions.
  1. BIN source/images/github-button.png
  2. +1 −1 source/layout.slim
  3. +30 −1 source/stylesheets/screen.css.scss
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
View
@@ -6,8 +6,8 @@ html
== stylesheet_link_tag "screen.css"
body
- == partial "partials/header"
#main role="main"
+ == partial "partials/header"
- if is_blog_article?
- content_for :blog_article, yield
== partial settings.blog_article_template
@@ -1,23 +1,47 @@
+/* IMPORTS */
+
@import "compass";
@import "susy";
+/* FONTS */
+
@include font-face("TitilliumText22LThin", font-files("../fonts/TitilliumText22L001-webfont.eot", "../fonts/TitilliumText22L001-webfont.woff", "../fonts/TitilliumText22L001-webfont.ttf", "../fonts/TitilliumText22L001-webfont.svg#TitilliumText22LThin"));
@include font-face("TitilliumText22LLight", font-files("../fonts/TitilliumText22L002-webfont.eot", "../fonts/TitilliumText22L002-webfont.woff", "../fonts/TitilliumText22L001-webfont.ttf", "../fonts/TitilliumText22L002-webfont.svg#TitilliumText22LThin"));
@include font-face("TitilliumText22LRegular", font-files("../fonts/TitilliumText22L003-webfont.eot", "../fonts/TitilliumText22L003-webfont.woff", "../fonts/TitilliumText22L003-webfont.ttf", "../fonts/TitilliumText22L003-webfont.svg#TitilliumText22LThin"));
@include font-face("TitilliumText22LMedium", font-files("../fonts/TitilliumText22L004-webfont.eot", "../fonts/TitilliumText22L004-webfont.woff", "../fonts/TitilliumText22L004-webfont.ttf", "../fonts/TitilliumText22L004-webfont.svg#TitilliumText22LThin"));
@include font-face("TitilliumText22LBold", font-files("../fonts/TitilliumText22L005-webfont.eot", "../fonts/TitilliumText22L005-webfont.woff", "../fonts/TitilliumText22L005-webfont.ttf", "../fonts/TitilliumText22L005-webfont.svg#TitilliumText22LThin"));
@include font-face("TitilliumText22LXBold", font-files("../fonts/TitilliumText22L006-webfont.eot", "../fonts/TitilliumText22L006-webfont.woff", "../fonts/TitilliumText22L006-webfont.ttf", "../fonts/TitilliumText22L006-webfont.svg#TitilliumText22LThin"));
+/* MIXINS */
+
@mixin footer-padding {
padding-top: 50px;
- padding-bottom: 40px;
}
@mixin button {
display: inline-block;
margin-top: 20px;
}
+@mixin selfclear {
+ display: inline-block;
+ &:after {
+ content: ".";
+ display: block;
+ height: 0;
+ clear: both;
+ visibility: hidden;
+ }
+}
+
+/* LAYOUT */
+
+html, body, #main { height: 100%; }
+
+body > #main { height: auto; min-height: 100%; }
+
+* html .clearfix { height: 1%; }
+
body {
@include global-reset;
background: #f5f5f5 url("../images/bg-paper.png");
@@ -94,6 +118,7 @@ header {
.main-content {
@include columns(8);
+ @include selfclear;
font-size: 0.8em;
margin-top: 40px;
h3 {
@@ -162,6 +187,10 @@ footer {
background-color: #475366;
border-top: 2px solid #ccdbff;
color: #fff;
+ position: relative;
+ margin-top: -180px; /* negative value of footer height */
+ height: 180px;
+ clear: both;
.meta {
@include columns(3);
@include footer-padding;

0 comments on commit 7595690

Please sign in to comment.