From 5fb2ce80c6ddf21103aefb248b0aa65f315d8d75 Mon Sep 17 00:00:00 2001
From: LIU Yulong <liuyulong@letv.com>
Date: Thu, 8 Jan 2015 21:00:44 +0800
Subject: [PATCH] Set proper z-index value on messages and navbar

The navbar should have been using the built in navbar-fixed-top class
as it is a fixed top navbar.  After added the correct class, the
correct z-index value was added via Bootstrap, then the messages
container simply needed to add a z-index that would appropriately
place it above dropdowns.

The user menu was simply a symptom of the overall problem, where all
the dropdowns in the navbar needed to behave the same way.

The z-index variables of the theme were used, therefore the
incorrect stacking of the messages over the spinner and the modal
were fixed at the same time.

It was noted that the right padding of the messages was using the
incorrect padding variable.  This was corrected.

Closes-bug: #1408640
Co-Authored-By: Diana Whitten <hurgleburgler@gmail.com>
Change-Id: I1d59049d43e74c2a897673307593993f4291da39
---
 openstack_dashboard/static/dashboard/scss/_layout.scss    | 4 ++--
 .../static/dashboard/scss/components/_messages.scss       | 6 +++---
 openstack_dashboard/templates/header/_header.html         | 2 +-
 .../themes/material/static/horizon/_styles.scss           | 8 --------
 .../themes/material/templates/header/_header.html         | 2 +-
 5 files changed, 7 insertions(+), 15 deletions(-)

diff --git a/openstack_dashboard/static/dashboard/scss/_layout.scss b/openstack_dashboard/static/dashboard/scss/_layout.scss
index 18472a43e..42368a2ea 100644
--- a/openstack_dashboard/static/dashboard/scss/_layout.scss
+++ b/openstack_dashboard/static/dashboard/scss/_layout.scss
@@ -12,10 +12,10 @@ $navbar-border-size: 1px !default;
 $navbar-true-height: $navbar-height + $navbar-border-size !default;
 
 #main_content {
-  height: 100%; /* fallback if needed --> its scrolls, but it works */
-  height: calc(100% - #{$navbar-true-height});
+  height: 100%;
   display: table;
   min-width: $main-content-min-width;
+  padding-top: $navbar-true-height;
 }
 
 #content_body,
diff --git a/openstack_dashboard/static/dashboard/scss/components/_messages.scss b/openstack_dashboard/static/dashboard/scss/components/_messages.scss
index e996957f8..4b2536fc4 100644
--- a/openstack_dashboard/static/dashboard/scss/components/_messages.scss
+++ b/openstack_dashboard/static/dashboard/scss/components/_messages.scss
@@ -1,8 +1,8 @@
 .messages {
   position: fixed;
-  z-index: 9999;
-  top: $padding-large-vertical*2;
-  right: $padding-large-vertical*2;
+  z-index: $zindex-dropdown + 1;
+  padding-top: $padding-small-vertical;
+  right: $padding-large-horizontal;
 
   // TODO (hurgleburlger) RESPONSIVE
   // We will readdress this when we address the responsiveness of Horizon
diff --git a/openstack_dashboard/templates/header/_header.html b/openstack_dashboard/templates/header/_header.html
index a5e1e9c8c..77c647ee3 100644
--- a/openstack_dashboard/templates/header/_header.html
+++ b/openstack_dashboard/templates/header/_header.html
@@ -1,7 +1,7 @@
 {% load i18n %}
 
 {% spaceless %}
-<nav class="navbar navbar-default">
+<nav class="navbar navbar-default navbar-fixed-top">
   <div class="container-fluid">
     <!-- Brand and toggle get grouped for better mobile display -->
     <div class="navbar-header">
diff --git a/openstack_dashboard/themes/material/static/horizon/_styles.scss b/openstack_dashboard/themes/material/static/horizon/_styles.scss
index c398d6e83..dfca8f3b2 100644
--- a/openstack_dashboard/themes/material/static/horizon/_styles.scss
+++ b/openstack_dashboard/themes/material/static/horizon/_styles.scss
@@ -15,7 +15,6 @@
 }
 
 #content_body {
-  padding-top: $navbar-height;
   transition: padding-left $sidebar-animation;
   display: block;
   padding-left: $sidebar-width + $content-body-padding;
@@ -32,13 +31,6 @@
 }
 
 
-// The top nav is fixed, even when the page scrolls
-.topbar {
-  width: 100%;
-  position: fixed;
-  z-index: 4;
-}
-
 // Border radius is unattractive here
 .navbar {
   border-radius: 0;
diff --git a/openstack_dashboard/themes/material/templates/header/_header.html b/openstack_dashboard/themes/material/templates/header/_header.html
index 46d6b9acf..9b3bec204 100644
--- a/openstack_dashboard/themes/material/templates/header/_header.html
+++ b/openstack_dashboard/themes/material/templates/header/_header.html
@@ -2,7 +2,7 @@
 {% load context_selection %}
 {% load compress %}
 
-<nav class="navbar-inverse">
+<nav class="navbar-inverse navbar-fixed-top">
   <div class="container-fluid">
     <!-- Brand and toggle get grouped for better mobile display -->
     <div class="navbar-header">