Bug 22680: OPAC language footer not positioned correctly
authorOwen Leonard <oleonard@myacpl.org>
Wed, 10 Apr 2019 17:55:22 +0000 (17:55 +0000)
committerNick Clemens <nick@bywatersolutions.com>
Thu, 11 Apr 2019 13:34:09 +0000 (13:34 +0000)
This patch modifies the OPAC CSS so that the language-selection footer
is positioned correctly.

To test, apply the patch and rebuild the OPAC CSS.

- Enable one or more translations in the OPAC
- View a page in the OPAC which can display in your browser without a
  vertical scrollbar (for instance, the OPAC main page with no news
  items or OpacMainUserBlock).
  - The language-selection footer should appear at the bottom of the
    screen. At smaller browser heights the footer should scroll
    offscreen.
  - Test with content in the opaccredits system preference, and with
    OpacKohaUrl enabled. The footer should still be positioned
    correctly.

Signed-off-by: Liz Rea <wizzyrea@gmail.com>

Signed-off-by: Nick Clemens <nick@bywatersolutions.com>

koha-tmpl/opac-tmpl/bootstrap/css/src/opac.scss

index 20fc1cd..b0f99c9 100644 (file)
@@ -36,6 +36,7 @@
         url('fonts/NotoSans-BoldItalic-webfont.woff') format('woff');
 }
 
+$footer-height: 45px;
 
 body {
     background: #FCF9FC none;
@@ -80,10 +81,10 @@ body {
     height: auto !important;
     height: 100%;
     min-height: 100%;
-    padding-right: 40px;
     padding-left: 40px;
-    /* Negative indent footer by it's height */
-    // margin: 0 auto -60px;
+    padding-right: 40px;
+    /* Negative indent footer by its height */
+    margin: 0 auto -#{$footer-height + 1};
 }
 
 .fa.fa-icon-black,
@@ -92,8 +93,9 @@ body {
 }
 
 #changelanguage {
+    clear: both;
     /* Set the fixed height of the footer here */
-    // height: 60px;
+    min-height: $footer-height;
     .nav {
         > .active {
             > p {
@@ -846,11 +848,11 @@ input[type="text"]:focus {
 
 .navbar-fixed-bottom {
     &.navbar-static-bottom {
-        margin-top: .5em;
         position: static;
     }
     .navbar-inner {
         box-shadow: none;
+        min-height: $footer-height;
     }
 }