changeset 3299:d561eb3787f5 beta

header: don't use fixed position A fixed div at the top prevents anchors and pageup/pagedown from working correctly ... and it is not like the top menu items are used all the time - next/previous page links would be more relevant to show in a fixed position. made the upper menu as a dropdown to old fixed mode by clicking upper semi transparent bar
author Mads Kiilerich <madski@unity3d.com>
date Thu, 31 Jan 2013 23:27:21 +0100
parents b38230cf8710
children 2c0208bd686b
files rhodecode/public/css/style.css rhodecode/templates/base/base.html
diffstat 2 files changed, 30 insertions(+), 7 deletions(-) [+]
line wrap: on
line diff
--- a/rhodecode/public/css/style.css	Fri Feb 01 01:21:12 2013 +0100
+++ b/rhodecode/public/css/style.css	Thu Jan 31 23:27:21 2013 +0100
@@ -243,8 +243,6 @@
 }
 
 #header {
-    margin: 0;
-    padding: 0 10px;
 }
 
 #header ul#logged-user {
@@ -310,6 +308,26 @@
 #header ul#logged-user li.highlight a:hover {
     color: #FFF;
 }
+#header-dd {
+    clear: both;
+    position: fixed !important;
+    background-color: #003B76;
+    opacity: 0.01;
+    cursor: pointer;
+    min-height: 10px;	
+    width: 100% !important;
+    -webkit-border-radius: 0px 0px 4px 4px;
+    -khtml-border-radius: 0px 0px 4px 4px;
+    -moz-border-radius: 0px 0px 4px 4px;
+    border-radius: 0px 0px 4px 4px;
+}
+
+#header-dd:hover{
+	opacity: 0.2;
+    -webkit-transition: opacity 0.5s ease-in-out;
+    -moz-transition: opacity 0.5s ease-in-out;
+    transition: opacity 0.5s ease-in-out;	
+}
 
 #header #header-inner {
     min-height: 44px;
@@ -335,14 +353,13 @@
     border-radius: 4px 4px 4px 4px;
 }
 #header #header-inner.hover {
-    position: fixed !important;
     width: 100% !important;
-    margin-left: -10px !important;
-    z-index: 10000;
     -webkit-border-radius: 0px 0px 0px 0px;
     -khtml-border-radius: 0px 0px 0px 0px;
     -moz-border-radius: 0px 0px 0px 0px;
     border-radius: 0px 0px 0px 0px;
+    position: fixed !important;
+    z-index: 10000;    
 }
 
 .ie7 #header #header-inner.hover,
@@ -3485,7 +3502,7 @@
 #content {
     clear: both;
     overflow: hidden;
-    padding: 54px 10px 14px 10px;
+    padding: 10px 10px 14px 10px;
 }
 
 #content div.box div.title div.search {
--- a/rhodecode/templates/base/base.html	Fri Feb 01 01:21:12 2013 +0100
+++ b/rhodecode/templates/base/base.html	Thu Jan 31 23:27:21 2013 +0100
@@ -2,8 +2,9 @@
 <%inherit file="root.html"/>
 
 <!-- HEADER -->
+<div id="header-dd"></div>
 <div id="header">
-    <div id="header-inner" class="title hover">
+    <div id="header-inner" class="title">
         <div id="logo">
             <h1><a href="${h.url('home')}">${c.rhodecode_name}</a></h1>
         </div>
@@ -357,5 +358,10 @@
       }
       return false;
      });
+
+     YUE.on('header-dd', 'click',function(e){
+         YUD.addClass('header-inner', 'hover');	 
+     });
+
 </script>
 </%def>