Commit 394ec6d8b1bd86c61925175b46a2107fa62acdef
1 parent
0e06b2d0
Exists in
master
and in
29 other branches
ActionItem152: top bar rework 90% done
git-svn-id: https://svn.colivre.coop.br/svn/noosfero/trunk@1185 3f533792-8f58-4932-b0fe-aaf55b0a4547
Showing
8 changed files
with
194 additions
and
318 deletions
Show diff stats
app/helpers/application_helper.rb
@@ -112,15 +112,14 @@ module ApplicationHelper | @@ -112,15 +112,14 @@ module ApplicationHelper | ||
112 | def shortcut_header_links | 112 | def shortcut_header_links |
113 | if logged_in? | 113 | if logged_in? |
114 | [ | 114 | [ |
115 | - ( link_to_myprofile( content_tag('span', _('My profile')), {}, nil, { :id => 'icon_go_home'} ) ), | ||
116 | - # MUDAR, O ID acima deve ser no Link <a id=... | 115 | + ( link_to_myprofile( content_tag('span', _('My profile')), {}, nil, { :id => 'link_go_home'} ) ), |
117 | # O ID icon_accessibility tambem tem que aparcer e testei o link nao ta funcionado. | 116 | # O ID icon_accessibility tambem tem que aparcer e testei o link nao ta funcionado. |
118 | - ( link_to content_tag('span', _('Admin')), { :controller => 'admin_panel' }, :id => 'icon_admin' if current_user.person.is_admin?), | ||
119 | - ( link_to content_tag('span', _('Logout')), { :controller => 'account', :action => 'logout'}, :id => 'icon_logout', :method => 'post'), | 117 | + ( link_to content_tag('span', _('Admin')), { :controller => 'admin_panel' }, :id => 'link_admin_panel' if current_user.person.is_admin?), |
118 | + ( link_to content_tag('span', _('Logout')), { :controller => 'account', :action => 'logout'}, :id => 'link_logout'), | ||
120 | ] | 119 | ] |
121 | else | 120 | else |
122 | [ | 121 | [ |
123 | - ( link_to content_tag('span', _('Login')), { :controller => 'account', :action => 'login' }, :id => 'icon_login' ), | 122 | + ( link_to content_tag('span', _('Login')), { :controller => 'account', :action => 'login' }, :id => 'link_login' ), |
124 | ] | 123 | ] |
125 | end.join(" ") | 124 | end.join(" ") |
126 | end | 125 | end |
app/views/layouts/application.rhtml
1 | <html> | 1 | <html> |
2 | <head> | 2 | <head> |
3 | <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> | 3 | <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> |
4 | - <title> | ||
5 | - <% if @category %> | ||
6 | - Noosfero → <%= @category.full_name %> | ||
7 | - <% else %> | 4 | + <title> |
5 | + <%- if @category -%> | ||
6 | + Noosfero → <%= @category.full_name -%> | ||
7 | + <%- else -%> | ||
8 | Noosfero | 8 | Noosfero |
9 | - <% end %> | 9 | + <%- end -%> |
10 | </title> | 10 | </title> |
11 | <meta name="description" content="FIXME: Descriptions of Noosfero" /> | 11 | <meta name="description" content="FIXME: Descriptions of Noosfero" /> |
12 | <meta name="keywords" content="Noosfero, Community, Open Source" /> | 12 | <meta name="keywords" content="Noosfero, Community, Open Source" /> |
@@ -26,45 +26,44 @@ | @@ -26,45 +26,44 @@ | ||
26 | <body class='category<%= category_color %>'> | 26 | <body class='category<%= category_color %>'> |
27 | 27 | ||
28 | <% unless flash[:notice].nil? %> | 28 | <% unless flash[:notice].nil? %> |
29 | - <div id='notice' onClick="Element.hide('notice');"> | 29 | + <div id='notice' onclick="Element.hide('notice');"> |
30 | <%= flash[:notice] %> | 30 | <%= flash[:notice] %> |
31 | <%= javascript_tag(visual_effect(:fade, "notice", :duration => 15)) %> | 31 | <%= javascript_tag(visual_effect(:fade, "notice", :duration => 15)) %> |
32 | </div> | 32 | </div> |
33 | <% end %> | 33 | <% end %> |
34 | 34 | ||
35 | + <div id='accessibility_menu'> | ||
36 | + <a href='#content' id='link_go_content'><span><%= _('Go to content') %></span></a> | ||
37 | + </div><!-- accessibility_menu --> | ||
38 | + | ||
39 | + <div id='path_category'> | ||
40 | + <% if @category -%> | ||
41 | + <%= @category.full_name(" → ") %> | ||
42 | + <% end -%> | ||
43 | + <%= javascript_tag(visual_effect(:fade, "path_category", :duration => 10)) %> | ||
44 | + </div> | ||
45 | + | ||
35 | <div id="wrap"> | 46 | <div id="wrap"> |
36 | 47 | ||
37 | <div id='noosfero_bar' style='position: absolute;'> | 48 | <div id='noosfero_bar' style='position: absolute;'> |
38 | - <div id='accessibility_bar'> | ||
39 | - <div id='accessibility_menu'> | ||
40 | - <a href='#content' id='icon_go_content'><span><%= _('Go to content') %></span></a> | ||
41 | - <!-- <%= shortcut_header_links %> --> | ||
42 | - </div><!-- accessibility_menu --> | ||
43 | - <div id='path_category'> | ||
44 | - <% if @category %> | ||
45 | - <%= @category.full_name %> | ||
46 | - <% end %> | ||
47 | - <%= javascript_tag(visual_effect(:fade, "path_category", :duration => 10)) %> | ||
48 | - </div> | ||
49 | - </div><!-- accessibility_bar --> | ||
50 | - <div id='search_box'> | ||
51 | - <%= search_box %> | ||
52 | - </div><!-- id='search_box' --> | ||
53 | 49 | ||
54 | <div id='navigation_bar'> | 50 | <div id='navigation_bar'> |
55 | - <SCRIPT LANGUAGE="JavaScript"> <!-- FIXME: Tirar o script daqui caso seja solucao adotada --> | ||
56 | - function posset(chkbox, group) { | ||
57 | - var posSetting = (chkbox.checked) ? "fixed" : "absolute" | ||
58 | - document.getElementById(group).style.position = posSetting | ||
59 | - } | ||
60 | - </SCRIPT> | ||
61 | - <INPUT TYPE="checkbox" NAME="Fix" VALUE="0" onClick="posset(this, 'noosfero_bar')" style='float: left;'> | ||
62 | <%= render :file => 'shared/categories_menu' %> | 51 | <%= render :file => 'shared/categories_menu' %> |
63 | </div><!-- id='navigation_bar' --> | 52 | </div><!-- id='navigation_bar' --> |
64 | - | ||
65 | <script type="text/javascript"> | 53 | <script type="text/javascript"> |
66 | prepareMenu('navigation_bar', { timeout: 5 }); | 54 | prepareMenu('navigation_bar', { timeout: 5 }); |
67 | </script> | 55 | </script> |
56 | + | ||
57 | + <!-- div id='search_box'> | ||
58 | + We will not need it... | ||
59 | + <%= search_box %> | ||
60 | + </div>< !-- id='search_box' --> | ||
61 | + | ||
62 | + <div id='user_box'> | ||
63 | + <%= shortcut_header_links %> | ||
64 | + <a href="javascript:alert('to do...')" id="open_search"><span>Search</span></a> | ||
65 | + </div><!-- id='user_box' --> | ||
66 | + | ||
68 | </div><!-- id="noosfero_bar" --> | 67 | </div><!-- id="noosfero_bar" --> |
69 | 68 | ||
70 | <div id='frame'><!-- Frame que envolve toda pagina de um usuario --> | 69 | <div id='frame'><!-- Frame que envolve toda pagina de um usuario --> |
app/views/shared/categories_menu.rhtml
1 | -<%= image_tag 'noosfero.png', :style => 'float: left;' %> | ||
2 | -<ul> | ||
3 | - <li id='category'>Noosfero <ul><li><%= shortcut_header_links %></li></ul></li> | 1 | +<ul id='cat_menu'> |
2 | + <a href='/' id='link_to_home'><span><%= _("Go Home") %></span></a> | ||
4 | <% @environment.display_categories.each do |item| %> | 3 | <% @environment.display_categories.each do |item| %> |
5 | - <li id='category<%= item.display_color %>' <%= 'class="active"' if (@category && (@category.top_ancestor == item)) %> > | 4 | + <li id='category<%= item.display_color %>'<%= ' class="active"' if (@category && (@category.top_ancestor == item)) %>> |
6 | <%= item.name %> | 5 | <%= item.name %> |
7 | <ul> | 6 | <ul> |
8 | <% item.children.each do |child| %> | 7 | <% item.children.each do |child| %> |
70 Bytes
public/stylesheets/common.css
1 | body { | 1 | body { |
2 | -margin: 0px; | ||
3 | -padding: 0px; | 2 | + margin: 0px; |
3 | + padding: 0px; | ||
4 | } | 4 | } |
5 | 5 | ||
6 | #notice { | 6 | #notice { |
7 | -cursor: pointer; | ||
8 | -} | 7 | + cursor: pointer; |
8 | +} | ||
9 | 9 | ||
10 | #wrap { | 10 | #wrap { |
11 | -margin:0px; | 11 | + border: 3px solid #2A5896; |
12 | +} | ||
13 | +body.category1 #wrap { | ||
14 | + border-color: #E26B00; | ||
15 | +} | ||
16 | +body.category2 #wrap { | ||
17 | + border-color: #61B60E; | ||
18 | +} | ||
19 | +body.category3 #wrap { | ||
20 | + border-color: #694371; | ||
21 | +} | ||
22 | +body.category4 #wrap { | ||
23 | + border-color: #B80000; | ||
12 | } | 24 | } |
13 | 25 | ||
14 | a img { | 26 | a img { |
@@ -19,17 +31,17 @@ a:hover img { | @@ -19,17 +31,17 @@ a:hover img { | ||
19 | } | 31 | } |
20 | 32 | ||
21 | #environment_identification { | 33 | #environment_identification { |
22 | -position: absolute !important; | ||
23 | -background: url("../images/bg_blue_logo.png") 5px no-repeat !important; | ||
24 | -vertical-align: bottom !important ; | ||
25 | -width: 230px !important ; | ||
26 | -height: 34px !important ; | ||
27 | -line-height: 34px !important ; | ||
28 | -padding-left: 60px !important ; | 34 | + position: absolute !important; |
35 | + background: url("../images/bg_blue_logo.png") 5px no-repeat !important; | ||
36 | + vertical-align: bottom !important ; | ||
37 | + width: 230px !important ; | ||
38 | + height: 34px !important ; | ||
39 | + line-height: 34px !important ; | ||
40 | + padding-left: 60px !important ; | ||
29 | } | 41 | } |
30 | 42 | ||
31 | #environment_identification:hover { | 43 | #environment_identification:hover { |
32 | -color: #dfdfdf !important ; | 44 | + color: #DFDFDF !important ; |
33 | } | 45 | } |
34 | 46 | ||
35 | div.fieldWithErrors { | 47 | div.fieldWithErrors { |
@@ -59,38 +71,38 @@ div#errorExplanation h2 { | @@ -59,38 +71,38 @@ div#errorExplanation h2 { | ||
59 | } | 71 | } |
60 | 72 | ||
61 | div#footer { | 73 | div#footer { |
62 | -background: #ffffff url("../images/bg_footer.png") repeat-x !important; | ||
63 | -background-position: 0px 0px; | ||
64 | -font-family: Verdana, Arial, Serif-sans; | ||
65 | -margin: 0px !important; | ||
66 | -padding: 5px !important; | ||
67 | -text-align: center !important; | ||
68 | -clear: both !important; | ||
69 | -font-size: 10px !important; | ||
70 | -color: #545454 !important; | 74 | + background: #ffffff url("../images/bg_footer.png") repeat-x !important; |
75 | + background-position: 0px 0px; | ||
76 | + font-family: Verdana, Arial, Serif-sans; | ||
77 | + margin: 0px !important; | ||
78 | + padding: 5px !important; | ||
79 | + text-align: center !important; | ||
80 | + clear: both !important; | ||
81 | + font-size: 10px !important; | ||
82 | + color: #545454 !important; | ||
71 | } | 83 | } |
72 | 84 | ||
73 | div#footer a { | 85 | div#footer a { |
74 | -color: #545454; | ||
75 | -text-decoration: none; | ||
76 | -border-bottom: 1px dotted #545454; | 86 | + color: #545454; |
87 | + text-decoration: none; | ||
88 | + border-bottom: 1px dotted #545454; | ||
77 | } | 89 | } |
78 | 90 | ||
79 | div#footer a:hover { | 91 | div#footer a:hover { |
80 | -color: #000000; | ||
81 | -border: 0px; | 92 | + color: #000000; |
93 | + border: 0px; | ||
82 | } | 94 | } |
83 | 95 | ||
84 | div#footer ul { | 96 | div#footer ul { |
85 | -margin: 0px; | ||
86 | -padding: 0px; | 97 | + margin: 0px; |
98 | + padding: 0px; | ||
87 | } | 99 | } |
88 | 100 | ||
89 | div#footer li { | 101 | div#footer li { |
90 | -display: block; | ||
91 | -float: right; | ||
92 | -margin-right: 20px; | ||
93 | -height: 20px; | 102 | + display: block; |
103 | + float: right; | ||
104 | + margin-right: 20px; | ||
105 | + height: 20px; | ||
94 | } | 106 | } |
95 | 107 | ||
96 | /* file manager (big) style */ | 108 | /* file manager (big) style */ |
public/stylesheets/help.css
public/stylesheets/menu.css
1 | -/* Geral Bar */ | ||
2 | -#noosfero_bar { | ||
3 | - width: 100%; | ||
4 | - height: 40px; | ||
5 | - padding: 0px; | ||
6 | - margin-left: -3px; | ||
7 | - _margin-left: -0px; | ||
8 | - margin-top: -3px; | ||
9 | - font-family: Sans, Verdana, Arial; | ||
10 | - z-index: 9999; | ||
11 | -} | ||
12 | - | ||
13 | -/* Accessibility Bar */ | ||
14 | - | ||
15 | -#accessibility_bar { | ||
16 | -position: absolute; | ||
17 | -top: 35px; | ||
18 | -margin-left: 15px; | ||
19 | -height: 20px; | ||
20 | -line-height: 20px; | ||
21 | -font-size: 12px !important ; | ||
22 | -font-family: Sans, Verdana, Arial !important ; | ||
23 | -vertical-align: middle !important ; | ||
24 | -text-align: left; | ||
25 | -} | ||
26 | - | ||
27 | -#accessibility_bar a { | ||
28 | -text-decoration: none; | ||
29 | -color: #dfdfdf; | ||
30 | -padding-left: 9px; | ||
31 | -background: url("../images/ico_enterlink.gif") no-repeat; | ||
32 | -background-position: 0px 6px; | ||
33 | -padding-right: 4px; | ||
34 | -} | ||
35 | - | ||
36 | -#accessibility_bar a:hover { | ||
37 | -color: #ffffff; | ||
38 | -text-decoration: underline; | 1 | +#accessibility_menu { |
2 | + position: absolute; | ||
3 | + font-size: 1px; | ||
39 | } | 4 | } |
40 | 5 | ||
41 | #path_category { | 6 | #path_category { |
42 | -font-weight: bold; | ||
43 | -color: #545454; | ||
44 | -z-index: 2000; | ||
45 | -padding-top: 4px; | 7 | + position: absolute; |
8 | + top: 45px; | ||
9 | + left: 50px; | ||
10 | + font-weight: bold; | ||
46 | } | 11 | } |
47 | 12 | ||
48 | -/* Menu Itens Accessibility */ | ||
49 | - | ||
50 | -#accessibility_menu { | ||
51 | - float: right; | ||
52 | - text-align: right; | ||
53 | - margin-right: 10px; | ||
54 | - font-family: Verdana, Arial, Serif-sans; | ||
55 | - font-size: 9px; | ||
56 | - color: #545454; | ||
57 | - font-weight: normal; | 13 | +#noosfero_bar { |
14 | + position: absolute; | ||
15 | + left: 3px; | ||
16 | + right: 3px; | ||
17 | + height: 22px; | ||
18 | + z-index: 9999; | ||
19 | + background-color: #3465A4; | ||
58 | } | 20 | } |
59 | 21 | ||
60 | -#accessibility_menu a#icon_go_home { | ||
61 | -background: url("../images/ico_enterlink.gif") no-repeat; | ||
62 | -} | ||
63 | - | ||
64 | -#accessibility_menu a { | ||
65 | - color: black; | 22 | +#link_to_home { |
23 | + position: absolute; | ||
24 | + top: 0px; | ||
25 | + left: 0px; | ||
26 | + display: block; | ||
27 | + width: 30px; | ||
28 | + height: 100%; | ||
29 | + background: url(/images/noosfero.png) 0px 50% no-repeat; | ||
30 | + text-align: center; | ||
31 | + color: transparent; | ||
32 | + font-size: 0px; | ||
33 | +} | ||
34 | + | ||
35 | +body.category #noosfero_bar { background-color: #2A5896 } | ||
36 | + | ||
37 | +body.category1 #noosfero_bar { background-color: #E26B00 } | ||
38 | +#category1 .linkSubMenu, | ||
39 | +#category1 ul { background-color: #F57900 } | ||
40 | +#category1:hover .linkSubMenu, | ||
41 | +#category1:hover ul { background-color: #CE5C00 } | ||
42 | + | ||
43 | +body.category2 #noosfero_bar { background-color: #58A80A } | ||
44 | +#category2 .linkSubMenu, | ||
45 | +#category2 ul { background-color: #61B60E } | ||
46 | +#category2:hover .linkSubMenu, | ||
47 | +#category2:hover ul { background-color: #4E9A06 } | ||
48 | + | ||
49 | +body.category3 #noosfero_bar { background-color: #694371 } | ||
50 | +#category3 .linkSubMenu, | ||
51 | +#category3 ul { background-color: #75507B } | ||
52 | +#category3:hover .linkSubMenu, | ||
53 | +#category3:hover ul { background-color: #5C3566 } | ||
54 | + | ||
55 | +body.category4 #noosfero_bar { background-color: #B80000 } | ||
56 | +#category4 .linkSubMenu, | ||
57 | +#category4 ul { background-color: #CC0000 } | ||
58 | +#category4:hover .linkSubMenu, | ||
59 | +#category4:hover ul { background-color: #A40000 } | ||
60 | + | ||
61 | +#user_box { | ||
62 | + position: absolute; | ||
63 | + top: 0px; | ||
64 | + right: 0px; | ||
65 | +} | ||
66 | + | ||
67 | +#user_box a:link, | ||
68 | +#user_box a:visited { | ||
69 | + font-size: 11px; | ||
70 | + font-weight: bold; | ||
71 | + text-decoration: none; | ||
72 | + line-height: 22px; | ||
73 | + color: #FFF; | ||
74 | + margin-right: 10px; | ||
75 | + opacity: 0.7; | ||
66 | } | 76 | } |
67 | - | ||
68 | -#accessibility_menu a:hover span { | ||
69 | - color: white; | 77 | +#user_box a:hover, |
78 | +#user_box a:active { | ||
79 | + opacity: 1; | ||
70 | } | 80 | } |
71 | 81 | ||
72 | -/* Itens Navigation Bar */ | ||
73 | - | ||
74 | -#navigation_bar { | 82 | +#cat_menu { |
83 | + padding: 0px; | ||
84 | + margin: 0px; | ||
75 | width: 100%; | 85 | width: 100%; |
76 | - padding: 0px !important; | ||
77 | - height: 35px; | ||
78 | - vertical-align: middle; | ||
79 | - line-height: 35px; | ||
80 | - z-index: 995; | ||
81 | } | 86 | } |
82 | 87 | ||
83 | -#navigation_bar ul { | ||
84 | - padding: 0px !important; | ||
85 | - margin: 0px !important; | ||
86 | - z-index: 996; | 88 | +#cat_menu a { |
89 | + font-weight: bold; | ||
90 | + line-height: 22px; | ||
91 | + text-decoration: none; | ||
92 | + color: #FFF; | ||
87 | } | 93 | } |
88 | 94 | ||
89 | -#navigation_bar ul li { | ||
90 | - list-style: none; | ||
91 | - display: inline; | ||
92 | - font-size: 17px; | ||
93 | - margin-right: 5px; | ||
94 | -} | 95 | +#category1 ul a:hover, #category1 a:active { color: #FDD79E } |
96 | +#category2 ul a:hover, #category2 a:active { color: #C4F099 } | ||
97 | +#category3 ul a:hover, #category3 a:active { color: #D6BFD3 } | ||
98 | +#category4 ul a:hover, #category4 a:active { color: #F79494 } | ||
95 | 99 | ||
96 | -#navigation_bar ul li a { | 100 | +.linkSubMenu { |
101 | + cursor: default; | ||
97 | float: left; | 102 | float: left; |
98 | display: block; | 103 | display: block; |
99 | - cursor: default; | ||
100 | - margin-top: 5px; | ||
101 | margin-left: 5px; | 104 | margin-left: 5px; |
102 | - text-align: center; | ||
103 | - height: 30px; | ||
104 | - padding-left: 5px; | ||
105 | - padding-right: 5px; | ||
106 | - line-height: 30px; | ||
107 | - vertical-align: middle; | ||
108 | - color: #fff; | ||
109 | - text-decoration: none; | ||
110 | -} | ||
111 | - | ||
112 | -#navigation_bar ul ul { | ||
113 | -position: absolute; | ||
114 | -top: 35px; | ||
115 | -margin: 0px; | ||
116 | -padding: 0px; | ||
117 | -width: 100%; | ||
118 | -left: 0px; | ||
119 | -display: none; | ||
120 | -z-index: 997; | 105 | + padding: 0px 5px; |
106 | + height: 100%; | ||
107 | + position: relative; | ||
108 | + left: 50px; | ||
121 | } | 109 | } |
122 | 110 | ||
123 | -#navigation_bar ul li ul li { | ||
124 | - text-align: center; | ||
125 | -} | ||
126 | - | ||
127 | -#navigation_bar ul li ul li a { | ||
128 | - display: inline; | ||
129 | - cursor: pointer; | ||
130 | - width: auto; | ||
131 | - padding-left: 5px; | ||
132 | - padding-right: 5px; | ||
133 | - margin: 0px; | ||
134 | - text-align: center; | ||
135 | -} | ||
136 | - | ||
137 | -#search_box { | ||
138 | -position: absolute; | ||
139 | -top: 8px; | ||
140 | -right: 8px; | ||
141 | -margin: 0px; | ||
142 | -z-index: 998; | ||
143 | -} | ||
144 | -#search_box form, #search_box input { | ||
145 | - display: inline; | ||
146 | -} | ||
147 | -#search_box .button { | ||
148 | - color: white; | ||
149 | - width: 24px; | 111 | +#cat_menu li { |
150 | padding: 0px; | 112 | padding: 0px; |
151 | margin: 0px; | 113 | margin: 0px; |
152 | -} | ||
153 | -#search_box .button:hover { | ||
154 | - color: black; | ||
155 | -} | ||
156 | - | ||
157 | -#input_search { | ||
158 | -border: 1px solid transparent; | ||
159 | -color: #545454; | ||
160 | -background-color: #efefef; | ||
161 | -width: 130px; | ||
162 | -font-size: 12px; | ||
163 | -} | ||
164 | - | ||
165 | -#input_search:hover, #input_search:focus { | ||
166 | -border: 1px solid white; | ||
167 | -color: black; | ||
168 | -background-color: white; | ||
169 | -} | ||
170 | - | ||
171 | -/* Itens Colors Change */ | ||
172 | - | ||
173 | -/* ITEM 0 */ | ||
174 | -body.category #navigation_bar, | ||
175 | -li#category a { | ||
176 | -background-color: #3465a4; | ||
177 | -} | ||
178 | - | ||
179 | -li#category:hover a, li#category a:focus, | ||
180 | -li#category ul { | ||
181 | - background-color: #245090 !important; | ||
182 | -} | ||
183 | - | ||
184 | -body.category #wrap { | ||
185 | -border: 3px solid #245090 !important; | ||
186 | -} | ||
187 | -li#category ul li a { | ||
188 | - color: white; | ||
189 | - background-color: #245090; | ||
190 | - border-right: 1px solid white; | ||
191 | -} | ||
192 | -li#category ul li a:hover { | ||
193 | - color: black; | ||
194 | -} | ||
195 | - | ||
196 | -/* ITEM 1 - Orange */ | ||
197 | -body.category1 #navigation_bar, | ||
198 | -li#category1 a { background-color: #f57900; } | ||
199 | - | ||
200 | -li#category1:hover a, li#category1 a:focus, | ||
201 | -li#category1 ul { | ||
202 | - background-color: #da6303 !important; | ||
203 | -} | ||
204 | -body.category1 #wrap { | ||
205 | -border: 3px solid #da6303 !important; | ||
206 | -} | ||
207 | -li#category1 ul li a { | ||
208 | - color: white; | ||
209 | - background-color: #da6303; | ||
210 | - border-right: 1px solid white; | ||
211 | -} | ||
212 | -li#category1 ul li a:hover { | ||
213 | - color: black; | 114 | + list-style: none; |
115 | + display: inline; | ||
214 | } | 116 | } |
215 | 117 | ||
216 | -/* ITEM 2 - Green */ | ||
217 | -body.category2 #navigation_bar, | ||
218 | -li#category2 a { | ||
219 | - background-color: #71b737 !important; | 118 | +#cat_menu ul { |
119 | + display: none; | ||
120 | + position: absolute; | ||
121 | + top: 22px; | ||
122 | + left: 0px; | ||
123 | + width: 100%; | ||
124 | + padding: 0px 0px 0px 20px; | ||
125 | + margin: 0px; | ||
220 | } | 126 | } |
221 | 127 | ||
222 | -li#category2:hover a, li#category2 a:focus, | ||
223 | -li#category2 ul { | ||
224 | - background-color: #4e9a06 !important; | ||
225 | -} | ||
226 | -body.category2 #wrap { | ||
227 | -border: 3px solid #4e9a06 !important; | ||
228 | -} | ||
229 | -li#category2 ul li a { | ||
230 | - color: white; | ||
231 | - background-color: #4e9a06; | ||
232 | - border-right: 1px solid white; | ||
233 | -} | ||
234 | -li#category2 ul li a:hover { | ||
235 | - color: black; | 128 | +/* |
129 | +#cat_menu ul li { | ||
130 | + padding: 0px; | ||
131 | + margin: 0px; | ||
236 | } | 132 | } |
133 | +*/ | ||
237 | 134 | ||
238 | -/* ITEM 3 - Purple */ | ||
239 | -body.category3 #navigation_bar, | ||
240 | -li#category3 a { | ||
241 | - background-color: #75507b !important; | ||
242 | -} | ||
243 | 135 | ||
244 | -li#category3:hover a, li#category3 a:focus, | ||
245 | -li#category3 ul { | ||
246 | - background-color: #633a6d !important; | ||
247 | -} | ||
248 | -body.category3 #wrap { | ||
249 | -border: 3px solid #633a6d !important; | ||
250 | -} | ||
251 | -li#category3 ul li a { | ||
252 | - color: white; | ||
253 | - background-color: #633a6d; | ||
254 | - border-right: 1px solid white; | ||
255 | -} | ||
256 | -li#category3 ul li a:hover { | ||
257 | - color: black; | 136 | +#cat_menu ul a { |
137 | + background: url(/images/bolota.gif) 0% 50% no-repeat; | ||
138 | + padding-left: 15px; | ||
139 | + margin-left: -11px; | ||
258 | } | 140 | } |
259 | - | ||
260 | -/* ITEM 4 - Red */ | ||
261 | -body.category4 #navigation_bar, | ||
262 | -li#category4 a { | ||
263 | - background-color: #cc0000 !important; | 141 | +#cat_menu ul span { |
142 | + background: url(/images/bolota.gif) 100% 50% no-repeat; | ||
143 | + padding-right: 15px; | ||
264 | } | 144 | } |
265 | 145 | ||
266 | -li#category4:hover a, li#category4 a:focus, | ||
267 | -li#category4 ul { | ||
268 | - background-color: #ae0303 !important; | ||
269 | -} | ||
270 | -body.category4 #wrap { | ||
271 | -border: 3px solid #ae0303 !important; | ||
272 | -} | ||
273 | -li#category4 ul li a { | ||
274 | - color: white; | ||
275 | - background-color: #ae0303; | ||
276 | - border-right: 1px solid white; | ||
277 | -} | ||
278 | -li#category4 ul li a:hover { | ||
279 | - color: black; | ||
280 | -} |
public/stylesheets/search.css