GNOME.org
 

[extensions-web/wip/tomtryf/redesign: 5/18] Make footer stick to the bottom

commit 7d6e8c3db079acd5a1f34905531b12fe8128a649
Author: Tom Tryfonidis <tomtryf gnome org>
Date:   Fri Feb 17 16:29:12 2017 +0200

    Make footer stick to the bottom
    
    This is a sticky footer!

 sweettooth/static/css/style.css |   20 ++++++++++++++++++++
 sweettooth/templates/base.html  |    4 ++--
 2 files changed, 22 insertions(+), 2 deletions(-)
---
diff --git a/sweettooth/static/css/style.css b/sweettooth/static/css/style.css
index 780f95d..f79ea85 100644
--- a/sweettooth/static/css/style.css
+++ b/sweettooth/static/css/style.css
@@ -635,6 +635,26 @@ dl.icon_list dt img {
     color: inherit;
 }
 
+/* Sticky Footer */
+
+.gnome-body {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-box-orient: vertical;
+    -webkit-box-direction: normal;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    min-height: 100vh;
+}
+.gnome-content {
+    -webkit-flex:1;
+    -ms-flex:1;
+    -webkit-box-flex:1; 
+    flex:1;
+}
+
 /* Separators */
 /* ========================================================================== */
 
diff --git a/sweettooth/templates/base.html b/sweettooth/templates/base.html
index 0cab727..66b837d 100644
--- a/sweettooth/templates/base.html
+++ b/sweettooth/templates/base.html
@@ -30,7 +30,7 @@
     </script>
     {% block head %} {% endblock %}
   </head>
-  <body>
+  <body class="gnome-body">
     <header class="gnome-header">
         <div class="navbar navbar-fixed-top navbar-default affix-top">
             <div class="container">
@@ -95,7 +95,7 @@
 
     <div class="clearfix"></div>
 
-    <div id="container" class="two_columns">
+    <div id="container" class="two_columns gnome-content">
         <div class="container_12">
             <div id="content" class="without_sidebar">
             <div class="row">
[Date Prev][Date Next]   [Thread Prev][Thread Next]   [Thread Index] [Date Index] [Author Index]