Add flooring to footer.

Add: templates/layout.html -Add `header`, `body`, and `footer` divs, for greater modularity and to floor the footer. static/sass/main.sass -Add styling to the new footer, which is always floored to the bottom of the page (even when an otherwise insufficient amount of content is present).
il y a 10 ans · d8b6a92ba0
--- a/static/sass/main.sass
+++ b/static/sass/main.sass
@@ -5,30 +5,36 @@
@import mixins
@import variables

 body
    margin: 0px
 html, body
    height: 100%
    margin: 0
    padding: 0

    *
        font-family: sans-serif

    div#main
 div#container
    min-height: 100%
    position: relative

    div#body
        padding-bottom: 50px
        padding-top: 4%

        div#center
            margin-left: auto
            margin-right: auto
            margin-top: 0px
            width: 75%

    div#footer
        @extend .t3

        background-color: $lightBlue
        bottom: -50px
        height: 60px
        padding-top: 12px
        position: fixed
        width: 100%
        position: absolute
        text-align: center
        width: 100%

        *
            color: white
@@ -36,16 +42,13 @@ body
        a
            @extend .t3

            text-decoration: none
            font-size: 1.2em
            margin-left: 5%
            margin-right: 5%
            text-decoration: none

            &:hover
                text-decoration: underline

        p span
            font-size: 0.7em

        &:hover
            bottom: 0px
--- a/templates/layout.html
+++ b/templates/layout.html
@@ -19,20 +19,25 @@
    = endblock
  </head>
  <body>
    <div id="main">
      <div id="center">
        = block body
        = endblock
    <div id="container">
      <div id="header">
      </div>

      <div id="body">
        <div id="center">
          = block body
          = endblock
        </div>
      </div>
    </div>

    <div id="footer">
      <a href="/">home</a>
      <a href="/about">about</a>
      <a href="/developers">developers</a>
      <p>
        &copy; 2012-2013 bitshift. <span>All Rights Reserved.</span>
      </p>
      <div id="footer">
        <a href="/">home</a>
        <a href="/about">about</a>
        <a href="/developers">developers</a>
        <p>
          &copy; 2012-2013 bitshift. <span>All Rights Reserved.</span>
        </p>
      </div>
    </div>
  </body>
 </html>