Просмотр исходного кода

Push the footer to the bottom of the page

sh4nks 9 лет назад
Родитель
Сommit
46eaf2cd76
2 измененных файлов с 59 добавлено и 28 удалено
  1. 35 20
      flaskbb/themes/aurora/src/flaskbb.scss
  2. 24 8
      flaskbb/themes/aurora/static/css/flaskbb.css

+ 35 - 20
flaskbb/themes/aurora/src/flaskbb.scss

@@ -1,11 +1,22 @@
-@mixin not-last-child($selector) {
-  & #{$selector}:not(:last-child) {
-    @content;
-  }
+html {
+    // push footer to bottom
+    position: relative;
+    min-height: 100%;
 }
 
 body {
     background-color: #E8F1F2;
+    // Margin bottom by footer height
+    margin-bottom: 60px;
+}
+
+.flaskbb-footer {
+    position: absolute;
+    bottom: 0;
+    // Set the fixed height of the footer here
+    height: 60px;
+    // use the same width as container
+    width: inherit;
 }
 
 .flaskbb-layout {
@@ -46,6 +57,7 @@ body {
 .forum-navigation {
     border: 1px solid #cad7e1;
     border-radius: 0 0 0.25em 0.25em;
+
     .navbar-nav .user-btn {
         padding-right: 2em;
         padding-left: 1em;
@@ -92,22 +104,25 @@ body {
         &:not(:last-child) {
             border-bottom: 1px solid #cad7e1;
         }
-    }
-
-}
-
-// topic?
-.forum-info {
-    position: relative;
-    float: left;
-    .forum-status {
-        font-size: 2em;
-        padding-right: 0.5em;
-    }
-    .forum-name {
-
-    }
-    .forum-description {
+        .forum-info {
+            position: relative;
+            float: left;
+            .forum-status {
+                font-size: 2em;
+                padding-right: 0.5em;
+            }
+            .forum-name {
+                font-weight: bold;
+            }
+            .forum-moderators {
+                font-style: italic;
+            }
+        }
+        .forum-last-post {
+            .last-post-title {
+                font-weight: bold;
+            }
+        }
 
     }
 }

+ 24 - 8
flaskbb/themes/aurora/static/css/flaskbb.css

@@ -1,5 +1,16 @@
+html {
+  position: relative;
+  min-height: 100%; }
+
 body {
-  background-color: #E8F1F2; }
+  background-color: #E8F1F2;
+  margin-bottom: 60px; }
+
+.flaskbb-footer {
+  position: absolute;
+  bottom: 0;
+  height: 60px;
+  width: inherit; }
 
 .flaskbb-layout {
   padding-top: 20px;
@@ -63,12 +74,17 @@ body {
     padding-bottom: 1em; }
     .category-body .category-content:not(:last-child) {
       border-bottom: 1px solid #cad7e1; }
-
-.forum-info {
-  position: relative;
-  float: left; }
-  .forum-info .forum-status {
-    font-size: 2em;
-    padding-right: 0.5em; }
+    .category-body .category-content .forum-info {
+      position: relative;
+      float: left; }
+      .category-body .category-content .forum-info .forum-status {
+        font-size: 2em;
+        padding-right: 0.5em; }
+      .category-body .category-content .forum-info .forum-name {
+        font-weight: bold; }
+      .category-body .category-content .forum-info .forum-moderators {
+        font-style: italic; }
+    .category-body .category-content .forum-last-post .last-post-title {
+      font-weight: bold; }
 
 /*# sourceMappingURL=flaskbb.css.map */