ActionItem110: Footer and box search backgrounds

git-svn-id: https://svn.colivre.coop.br/svn/noosfero/trunk@720 3f533792-8f58-4932-b0fe-aaf55b0a4547

ActionItem110: Footer and box search backgrounds
git-svn-id: https://svn.colivre.coop.br/svn/noosfero/trunk@720 3f533792-8f58-4932-b0fe-aaf55b0a4547
ValessioBrito
1 parent bd29a833
Showing 5 changed files with 56 additions and 38 deletions Show diff stats
app/views/layouts/application.rhtml
public/images/bg_footer.png
public/images/bg_searchbox.png
public/stylesheets/common.css
public/stylesheets/menu.css
@@ -61,11 +61,21 @@
     <div id="wrap" class='category<%= category_color %>'>
       <div id='noosfero_bar' class='category<%= category_color %>'>
+       <div id='top_bar' class='category<%= category_color %>'>
         <div id='accessibility_menu'>
           <a href='#content' title='Ir para o conteúdo'>Ir para conteúdo</a>
 	  <a href='#'>Acessibilidade</a>
         </div><!-- accessibility_menu -->
-
+	<div id='path_category'>
+        <% if @category %>
+            <%= @category.full_name %>
+	<% else @category %>
+        <div id='user_options'>
+               <%= user_options %>
+	</div><!-- id='user_options' -->
+        <% end %>
+	</div>
+       </div>
         <div id='search_box'>
           <form id='search_box_form' action="" method="GET">
             <input id="input_search" type='text' name='q' value='<%= _('Your search here ...')%>'>
@@ -73,23 +83,14 @@
           </form>
         </div><!-- id='search_box' -->
-        <div id='navigation_bar'>
+        <div id='navigation_bar' class='category<%= category_color %>'>
           <%= render :file => 'shared/categories_menu' %>
         </div><!-- id='navigation_bar' -->
         <script type="text/javascript">
-          prepareMenu('navigation_bar', { timeout: 50 });
+          prepareMenu('navigation_bar', { timeout: 10 });
         </script>
-	<div id='path_category'>
-        <% if @category %>
-            <%= @category.full_name %>
-	<% else @category %>
-        <div id='user_options'>
-               <%= user_options %>
-	</div><!-- id='user_options' -->
-        <% end %>
-	</div>
       </div><!-- id="noosfero_bar" -->
     <div id='frame'><!-- Frame que envolve toda pagina de um usuario -->
@@ -60,3 +60,9 @@ div#errorExplanation h2 {
   color: white;
   text-align: center;
 }
+
+div#footer {
+background: #ffffff url("../images/bg_footer.png") repeat-x !important;
+background-position: 0px 0px;
+}
+
@@ -4,6 +4,7 @@
   height: 11px;
   padding: 0px;
   margin-top: -5px;
+  margin-right: 5px;
   font-family: Verdana, Arial, Serif-sans;
   z-index: 9999;
 }
@@ -11,9 +12,8 @@
 /* Menu Itens Accessibility */
 #accessibility_menu {
-  position: absolute;
-  right: 10px;
-  top: 35px;
+  float: right;
+  margin-right: 10px;
   font-family: Verdana, Arial, Serif-sans;
   font-size: 10px;
   color: #dfdfdf;
@@ -33,17 +33,19 @@
   color: #ffffff;
 }
-/* Div Header */
+/* Top Bar */
-#user_options a {
-height: 35px !important ;
+#top_bar {
+height: 20px;
+line-height: 20px;
 color: #ffffff !important ;
-font-size: 10px !important ;
+font-size: 12px !important ;
 font-family: Sans-serif !important ;
 font-weight: bold !important ;
 vertical-align: middle !important ;
-padding: 0px 5px 0px 5px !important ;
-text-decoration: underline !important ;
+padding: 0px !important ;
+margin: 0px;
+text-align: left;
 }
 /* Itens Navigation Bar */
@@ -51,7 +53,7 @@ text-decoration: underline !important ;
 #navigation_bar {
   float: left;
   padding: 0px !important;
-  margin: 0px !important;
+  margin-top: -5px !important;
   height: 40px;
   vertical-align: middle;
   line-height: 40px;
@@ -83,12 +85,12 @@ text-decoration: underline !important ;
 }
 #navigation_bar ul ul {
+position: absolute;
+top: 58px;
 margin: 0px;
 padding: 0px;
 width: 100%;
 left: 0px;
-position: absolute;
-top: 40px;
 display: none;
 z-index: 999;
 }
@@ -108,11 +110,13 @@ z-index: 999;
 #search_box {
 float: right;
-margin-top: 10px;
-margin-right: 10px;
-height: 20px;
-line-height: 20px;
-vertical-align: middle;
+margin: 0px;
+width: 200px;
+height: 35px;
+padding-top: 5px;
+padding-left: 15px;
+background: url("../images/bg_searchbox.png") no-repeat;
+background-position: bottom left;
 }
 #input_search {
@@ -144,16 +148,7 @@ color: #545454;
 border: 1px inset #dfdfdf;
 }
-/* Path Category */
-#path_category {
-  clear: both;
-  padding: 3px;
-  font-size: 12px;
-  font-weight: bold;
-  text-align: left;
-  color: #fff;
-}
 /* Itens Colors Change */
@@ -172,6 +167,10 @@ border: 1px inset #dfdfdf;
   border: 5px solid #204a87 !important;
 }
+#top_bar.category {
+background-color: #204a87;
+}
+
 #category a {
   background: url("../images/bg_menu_options.png") no-repeat;
   background-position: 0px 0px;
@@ -209,6 +208,10 @@ li#category ul li a:hover {
 border: 5px solid #ce5c00 !important;
 }
+#top_bar.category1 {
+background-color: #ce5c00;
+}
+
 #category1 a {
   background: url("../images/bg_menu_options.png") no-repeat;
   background-position: -124px 0px;
@@ -246,6 +249,10 @@ li#category1 ul li a:hover {
 border: 5px solid #4e9a06 !important;
 }
+#top_bar.category2 {
+background-color: #4e9a06;
+}
+
 #category2 a {
   background: url("../images/bg_menu_options.png") no-repeat;
   background-position: -246px 0px;
@@ -283,6 +290,10 @@ li#category2 ul li a:hover {
 border: 5px solid #5c3566 !important;
 }
+#top_bar.category3 {
+background-color: #5c3566;
+}
+
 #category3 a {
   background: url("../images/bg_menu_options.png") no-repeat;
   background-position: -368px 0px;
	@@ -60,3 +60,9 @@ div#errorExplanation h2 {		@@ -60,3 +60,9 @@ div#errorExplanation h2 {
60	color: white;	60	color: white;
61	text-align: center;	61	text-align: center;
62	}	62	}
		63	+
		64	+div#footer {
		65	+background: #ffffff url("../images/bg_footer.png") repeat-x !important;
		66	+background-position: 0px 0px;
		67	+}
		68	+