tr8n 3.0.5 → 3.1.1

data/app/views/tr8n/common/_language_selector.html.erb

@@ -1,8 +1,12 @@
 <% if Tr8n::Config.enabled? and (Tr8n::Config.open_registration_mode? or Tr8n::Config.current_user_is_translator?) %>
-    <span style="<%=opts[:style]%>; cursor:pointer;" onClick="tr8nLanguageSelector.toggle();">
-		  <%= tr8n_language_name_tag(Tr8n::Config.current_language, opts.merge(:name => :native, :linked => false)) %>
-			<% if opts[:show_arrow] %>
-			 <span style="<%=opts[:arrow_style]%>" id="tr8n_language_selector_trigger">▼</span>
-			<% end %>
-    </span>
+		<% if opts[:lightbox] %>
+      <%=link_to_function(tr8n_language_name_tag(Tr8n::Config.current_language, opts.merge(:name => :native, :linked => false)), "tr8nLightbox.show('/tr8n/language/select?lightbox=true', {height:500, width:400})")%>
+		<% else %>
+	    <span style="<%=opts[:style]%>; cursor:pointer;" onClick="tr8nLanguageSelector.toggle();">
+			  <%= tr8n_language_name_tag(Tr8n::Config.current_language, opts.merge(:name => :native, :linked => false)) %>
+				<% if opts[:show_arrow] %>
+				 <span style="<%=opts[:arrow_style]%>" id="tr8n_language_selector_trigger">▼</span>
+				<% end %>
+	    </span>
+		<% end %>
 <% end %>

data/app/views/tr8n/common/_paginator.html.erb

@@ -1,8 +1,14 @@
 <div style="padding-bottom:10px;padding-top:5px;">
   <table style="width:100%;">
     <tr>
-      <td style="text-align:left; vertical-align:top;font-size:11px; font-family:arial;"><%= page_entries_info(objects, :skip_decorations => true, :entry_name => subject) %></td>
-      <td style="text-align:right; vertical-align:top;font-size:11px; font-family:arial;"><%= will_paginate(objects, :skip_decorations => true, :style => "text-align:right;") %></td>
+      <td style="text-align:left; vertical-align:top;font-size:11px; font-family:arial;">
+				<% if objects.total_count > 0 %>
+					Showing <%= objects.offset_value + 1 %> - <%= objects.offset_value + objects.length %> of <%= objects.total_count %>
+				<% else %>	
+					No results found
+				<% end %>
+			</td>
+      <td style="text-align:right; vertical-align:top; font-size:11px; font-family:arial;"><%= paginate(objects) %></td>
     </tr>
   </table>
 </div>

data/app/views/tr8n/common/_scripts.html.erb

@@ -2,8 +2,9 @@
 
 	<%= tr8n_splash_screen_tag %>
 
-  <%=stylesheet_link_tag("/tr8n/stylesheets/tr8n.css") -%>
-  <%=javascript_include_tag("/tr8n/javascripts/tr8n.js") -%>
+  <%=stylesheet_link_tag("tr8n/tr8n.css") -%>
+  <%=javascript_include_tag("tr8n/tr8n.js") -%>
+
   <script type="text/javascript">
      initializeTr8n();
   </script>
@@ -23,12 +24,12 @@
 	  <script> 
 		  VKI_default_layout = "<%=Tr8n::KeyboardMapping.current_1_36%>";
 		</script> 	  
-    <%=javascript_include_tag("/tr8n/javascripts/keyboard_1_36.js", :charset => "UTF-8") -%>
-    <%=stylesheet_link_tag("/tr8n/stylesheets/keyboard_1_36.css") -%>
+    <%=javascript_include_tag("tr8n/keyboard_1_36.js", :charset => "UTF-8") -%>
+    <%=stylesheet_link_tag("tr8n/keyboard_1_36.css") -%>
   <% end %>  
 
   <% if Tr8n::Config.enable_keyboard_shortcuts? %>  
-    <%=javascript_include_tag("/tr8n/javascripts/shortcut.js", :charset => "UTF-8") -%>
+    <%=javascript_include_tag("tr8n/shortcut.js", :charset => "UTF-8") -%>
     <script type="text/javascript">
        <% Tr8n::Config.default_shortcuts.each do |key, data| %>     	
 				  shortcut.add("<%=key%>", function() {

data/app/views/tr8n/common/_splash_screen.html.erb

@@ -1,6 +1,6 @@
-<div style="margin:10px; background:white; padding:5px; border:solid 1px #bababa; border-color: #bababa #e8e8e8 #e8e8e8 #bababa;">
+<div class="tr8n_splash_screen">
   <div style="overflow:hidden;_overflow:visible; zoom:1;">
-    <%= image_tag "/tr8n/images/rotating_world.gif", :style => "float:left;margin-right:10px;" %>
+    <%= image_tag "tr8n/rotating_world.gif", :style => "float:left;margin-right:10px;" %>
     <div style="overflow:hidden">
       <div style="color:#444;font-weight:bold;font-size:12px;"><%= trl('Please wait.','Loading text for translations panel') %></div>
       <div style="font-size:11px"><%= trl('loading...','Loading text for translations panel') %></div>

data/app/views/tr8n/common/_translation_votes.html.erb

@@ -18,13 +18,13 @@
           <td style="text-align:center;vertical-align:top; padding-top:3px;">
             <% if trn.translation_key.locked? %>
               <div style="text-align:center; padding-top:1px;">
-							  <%=image_tag("/tr8n/images/lock.png", :style=>"height:14px", :title => trla("This phrase is locked", "Translator label"))%>
-                <%=link_to_function(image_tag("/tr8n/images/exclamation.png", :title=> trla("Report this translation", "Translator label")), "tr8nLightbox.show('/tr8n/translator/lb_report?translation_id=#{trn.id}', {width:600, height:360});")%>
+							  <%=image_tag("tr8n/lock.png", :style=>"height:14px", :title => trla("This phrase is locked", "Translator label"))%>
+                <%=link_to_function(image_tag("tr8n/exclamation.png", :title=> trla("Report this translation", "Translator label")), "tr8nLightbox.show('/tr8n/translator/lb_report?translation_id=#{trn.id}', {width:600, height:360});")%>
 							</div>
 						<% else %>
-              <%=link_to_function(image_tag("/tr8n/images/thumb_up.png", :title=>trla("Vote up this translation", "Translator label")), "tr8nTranslator.voteOnTranslation('#{trn.translation_key.key}', '#{trn.id}', 1)")%> 
-              <%=link_to_function(image_tag("/tr8n/images/thumb_down.png", :title=>trla("Vote down this translation", "Translator label")), "tr8nTranslator.voteOnTranslation('#{trn.translation_key.key}','#{trn.id}', -1)")%> 
-              <%=link_to_function(image_tag("/tr8n/images/exclamation.png", :title=>trla("Report this translation", "Translator label")), "tr8nLightbox.show('/tr8n/translator/lb_report?translation_id=#{trn.id}', {width:600, height:360});")%>
+              <%=link_to_function(image_tag("tr8n/thumb_up.png", :title=>trla("Vote up this translation", "Translator label")), "tr8nTranslator.voteOnTranslation('#{trn.translation_key.key}', '#{trn.id}', 1)")%> 
+              <%=link_to_function(image_tag("tr8n/thumb_down.png", :title=>trla("Vote down this translation", "Translator label")), "tr8nTranslator.voteOnTranslation('#{trn.translation_key.key}','#{trn.id}', -1)")%> 
+              <%=link_to_function(image_tag("tr8n/exclamation.png", :title=>trla("Report this translation", "Translator label")), "tr8nLightbox.show('/tr8n/translator/lb_report?translation_id=#{trn.id}', {width:600, height:360});")%>
             <% end %>   
           </td>
           <td style="text-align:left;vertical-align:top;font-size:11px; padding-top:3px;">

data/app/views/tr8n/dashboard/_forum.html.erb

@@ -10,16 +10,18 @@
 	</div>
 	
 	<div id="forum_content_<%=lang.id%>" style="display:none">
-		<table style="width:100%; background-color:white; border:1px dotted #ccc;">
-		  <% lang.recently_added_forum_messages.each do |message| %>
-		    <% style = (message == lang.recently_added_forum_messages.last ? "" : "border-bottom:1px dotted #ccc;" ) %>  
-		    <tr style="<%=style%>">
-	        <%= render :partial => "/tr8n/forum/message", :locals => {:message => message} %>
-					<td style="text-align:right; padding-right:5px;">
-						<%=link_to(tra("view", 'Link to view a forum message'), :controller => "/tr8n/forum", :action => :topic, :locale => lang.locale, :topic_id => message.topic.id)%>
-					</td> 
-		    </tr>
-		  <% end %>
-		</table>
+		<div class="section">
+			<table style="width:100%;">
+			  <% lang.recently_added_forum_messages.each do |message| %>
+			    <% style = (message == lang.recently_added_forum_messages.last ? "" : "border-bottom:1px dotted #ccc;" ) %>  
+			    <tr style="<%=style%>">
+		        <%= render :partial => "/tr8n/forum/message", :locals => {:message => message} %>
+						<td style="text-align:right; padding-right:5px;">
+							<%=link_to(tra("view", 'Link to view a forum message'), :controller => "/tr8n/forum", :action => :topic, :locale => lang.locale, :topic_id => message.topic.id)%>
+						</td> 
+			    </tr>
+			  <% end %>
+			</table>
+		</div>
 	</div>
 <% end %>

data/app/views/tr8n/dashboard/_language_metric.html.erb

@@ -1,4 +1,4 @@
-<div style="text-align:center; width:100%; border:1px dotted #ccc; background-color:white;">
+<div class="tr8n_dashboard_chart">
   <div style="font-size:14px; padding:3px;">
     <%=tra("Language Phrases", "Dashboard section header")%>
     <span style="font-size:10px;color:#ccc;">

data/app/views/tr8n/dashboard/_translations.html.erb

@@ -1,12 +1,3 @@
-<style>
-	.translations_table {
-		width:100%; background-color:white; border: 1px dotted #ccc;
-	}
-	.translations_table td {
-    padding:3px;
-  } 
-</style>
-
 <% unless lang.recently_updated_translations.empty? %>
 	<div style="padding-top:10px; font-size:14px; border-bottom:1px solid #ccc; margin-bottom:5px;">
     <div style="float:right; font-size:12px;">
@@ -18,7 +9,7 @@
 		<span style="color:#ccc; font-size:12px;">(<%=tra("last 5", "Translations header for showing only the last 5 translations")%>)</span>
 	</div>
 	
-	<div id="trans_content_<%=lang.id%>" class="translations_table" style="display:none;">
+	<div id="trans_content_<%=lang.id%>" class="section" style="display:none;">
     <%= render :partial => "/tr8n/translations/list", :locals => {:language => lang, :translations => lang.recently_updated_translations, :mode => :short_list} %>
 	</div>	
 <% end %>	

data/app/views/tr8n/dashboard/_translator_metric.html.erb

@@ -1,4 +1,4 @@
-<div style="text-align:center; width:100%; border:1px dotted #ccc; background-color:white;">
+<div class="tr8n_dashboard_chart">
   <div style="font-size:14px; padding:3px;"> 
 		<% if lang %>
 		  <%=tra("Your Translations", "Dashboard section header") %>

data/app/views/tr8n/dashboard/_votes.html.erb

@@ -1,12 +1,3 @@
-<style>
-	.votes_table {
-		width:100%; background-color:white; border: 1px dotted #ccc;
-	}
-	.votes_table td {
-    padding:3px;
-  } 
-</style>
-
 <% unless lang.recently_updated_votes.empty? %>
 	<div style="padding-top:10px; font-size:14px; border-bottom:1px solid #ccc; margin-bottom:5px;">
     <div style="float:right; font-size:12px;">
@@ -18,12 +9,12 @@
 		<span style="color:#ccc; font-size:12px;">(<%=tra("last 5", "Translations header for showing only the last 5 translation votes")%>)</span>
 	</div>
 	
-	<div id="votes_content_<%=lang.id%>" style="display:none">
-		<table class="translations_table">
+	<div id="votes_content_<%=lang.id%>" style="display:none"  class="section">
+		<table>
 		  <tr style="border-bottom:1px solid #ccc;">
 		    <td class="topic_header" style="width:200px;"><%=tra("Voter", "Translation votes section header")%></td>
         <td class="topic_header" style="width:25px;text-align:right;"><%=tra("Vote", "Translation votes section header")%></td>
-        <td class="topic_header" style="width:80px;text-align:right"><%=tra("Total Rank", "Translation votes section header")%></td>
+        <td class="topic_header" style="width:80px;text-align:right;padding-right:5px;"><%=tra("Total Rank", "Translation votes section header")%></td>
         <td class="topic_header" style=""><%=tra("Translation", "Translation votes section header")%></td>
 		  </tr>  
 		
@@ -53,7 +44,7 @@
                 <%= vote.vote %> 
             </td>  
             
-            <td style="text-align:right; vertical-align:top; padding-top:3px;">
+            <td style="text-align:right; vertical-align:top; padding-top:3px;padding-right:5px;">
                 <%= translation.rank_label %> 
             </td>
 						

data/app/views/tr8n/dashboard/{index.rhtml → index.html.erb}

@@ -12,7 +12,7 @@
 	  <%=tra("{user}'s Dashboard", "Dashboard section title", :user => [tr8n_current_translator, :name]) %>
 	</div>
 	
-	<div class="section_box" style="background-color:#FDFFF0;">
+	<div class="section yellow">
 	    <table style="width:100%">
 	      <tr>
 	        <td style="width:50%; padding-top:3px;">
@@ -94,7 +94,7 @@
 	
 	    <%=tr8n_toggler_tag("lang_content_#{lang.id}")%>
 			
-	    <%=image_tag("/tr8n/images/flags/#{lang.flag}.png", :title=>lang.native_name) if Tr8n::Config.enable_language_flags? %>&nbsp;
+	    <%=image_tag("tr8n/flags/#{lang.flag}.png", :title=>lang.native_name) if Tr8n::Config.enable_language_flags? %>&nbsp;
 	    <a name="<%=lang.locale%>" style="text-decoration:none;color:black;"><%=lang.english_name%></a>
 			
 			<% if tr8n_current_translator.manager? %> 
@@ -102,7 +102,7 @@
 			<% end %>
 		</div>
 		
-		<div id="lang_content_<%=lang.id%>" class="section_box colored">
+		<div id="lang_content_<%=lang.id%>" class="section grey">
 	    <%=render :partial=>"statistics", :locals => {:lang => lang, :translator_metric => translator_metric}%>
 			
 	    <%=render :partial=>"forum", :locals => {:lang => lang}%>

data/app/views/tr8n/forum/_messages.html.erb

@@ -1,12 +1,5 @@
-<div class="section_box">
-  <div style="margin-bottom:5px; padding-bottom:2px; border-bottom:1px solid #ccc; ">
-    <table style="width:100%;">
-      <tr>
-        <td align='left'><%= page_entries_info(@messages, {:entry_name => "message", :skip_decorations => true, :params => params.merge(:last_page => nil)}) %></td>
-        <td align='right'><%= will_paginate(@messages, :style => "text-align:right", :skip_decorations => true, :params => params.merge(:last_page => nil)) %></td>
-      </tr>
-    </table>
-  </div>
+<div class="section">
+	<%= tr8n_paginator_tag(@messages, 'message') %>	
 
   <table style="width:100%; ">
     <% @messages.each do |message| %>

data/app/views/tr8n/forum/_new_message.html.erb

@@ -3,7 +3,7 @@
 	<a name="reply_message">&nbsp;</a>
 </div>
 
-<div class="section_box colored">
+<div class="section grey">
   <%= form_tag({:action => :topic}, {:method => :post, :id => "forum_topic_form"}) do %>
     <%=hidden_field_tag(:topic_id, @topic.id)%>
     

data/app/views/tr8n/forum/_new_topic.html.erb

@@ -6,7 +6,7 @@
 	<% end %>
 </div>
 
-<div class="section_box colored">
+<div class="section grey">
   <%= form_tag({:action => :topic}, {:method => :post, :id => "forum_topic_form"}) do %>
     <%=hidden_field_tag(:language_id, params[:language_id])%>
     

data/app/views/tr8n/forum/index.html.erb

@@ -4,12 +4,12 @@
 	<% unless @topics.empty? %>
 	<div class="section_title">
 	  <div style="float:right; padding-top:6px; font-size:12px; color: #ccc;">
-	    <%=image_tag('/tr8n/images/plus.png')%> <%= link_to(tra("Start a new discussion topic"), :action => :topic, :mode => :create) %>
+	    <%=image_tag('tr8n/plus.png')%> <%= link_to(tra("Start a new discussion topic"), :action => :topic, :mode => :create) %>
 	  </div>
 	  
 	  <%=tra("{language} Language Discussion Topics", nil, :language => tr8n_current_language.native_name) %>  
 	</div>
-	<div class="section_box">
+	<div class="section">
 	    <table style="width:100%;">
 	       <tr style="border-bottom: 1px solid #ccc;">
 	         <td class="topic_header" style="width:20%; padding:5px;"><%=tra("Author", "Forum column header")%></td>
@@ -68,14 +68,7 @@
 	      <% end %>
 	    </table>
 	  
-	    <div style="margin-bottom:5px; padding-top:5px; border-top: 1px solid #ccc;">
-	      <table style="width:100%;">
-	        <tr>
-	          <td align='left'><%= page_entries_info(@topics, :entry_name => "forum topic", :skip_decorations => true) %></td>
-	          <td align='right'><%= will_paginate(@topics, :skip_decorations => true, :style => "text-align:right;") %></td>
-	        </tr>
-	      </table>
-	    </div>
+			<%= tr8n_paginator_tag(@topics, 'forum topic') %>	
 	</div>
 	<% end %>
 	

data/app/views/tr8n/forum/topic.html.erb

@@ -6,9 +6,9 @@
 	  <div class="section_title">
 	
 	    <div style="float:right; padding-top:20px; font-size:12px; color: #ccc;">
-	      <%=link_to(image_tag("/tr8n/images/reply.png") + " " + tra("Reply", "Reply button for forum topics"), :topic_id => @topic.id, :page => params[:page], :anchor => :reply_message) %> 
+	      <%=link_to(image_tag("tr8n/reply.png") + " " + tra("Reply", "Reply button for forum topics"), :topic_id => @topic.id, :page => params[:page], :anchor => :reply_message) %> 
 	      &nbsp; |  &nbsp; 
-	      <%=link_to(image_tag("/tr8n/images/plus.png") + " " + tra("Start a new discussion topic"), :mode => :create) %>
+	      <%=link_to(image_tag("tr8n/plus.png") + " " + tra("Start a new discussion topic"), :mode => :create) %>
 	    </div>
 	
 	    <div style="color:grey;font-size:16px;font-weight:bold">

data/app/views/tr8n/glossary/index.html.erb

@@ -2,7 +2,7 @@
 
 	<%= render :partial => "/tr8n/common/header" %>
 	
-	<div class="section_box" style="margin-bottom:10px; background-color:#EFF8FF; margin-top:0px;">
+	<div class="section blue">
 	  <%= form_tag({:action => :index}, {:method => :get, :id => "glossary_search_form"}) do %>
        <div style="float:right">
             <button type="submit" class="translator_btn translator_small_btn" onClick="Tr8n.Effects.submit('glossary_search_form'); return false;">
@@ -14,7 +14,7 @@
 	  <% end %>
 	</div>
 	
-	<div class="section_box">
+	<div class="section">
 	  <%= render :partial => "/tr8n/common/paginator", :locals => {:objects => @terms, :subject => 'term'} %>
 	
 	  <table style="width:100%">

data/app/views/tr8n/help/_footer.html.erb

@@ -0,0 +1,4 @@
+    </td> 
+  </tr>
+</table>  
+<%= render :partial => "/tr8n/common/footer" %>

data/app/views/tr8n/help/_header.html.erb

@@ -0,0 +1,106 @@
+<%= render :partial => "/tr8n/common/header" %>
+
+<style>
+	.documentation_section_title {
+      background: none repeat scroll 0 0 #F5F5F5;
+      padding: 20px;
+			color: #888888 !important;
+			font-size: 20px;		
+	}
+	
+	.documentation_section {
+		padding:10px;
+		font-family: arial;
+	}
+	
+	
+  .screenshot {
+      -moz-box-shadow: 3px 3px 4px #000;
+      -webkit-box-shadow: 3px 3px 4px #000;
+      box-shadow: 3px 3px 4px #000;	 
+			margin:15px;
+  }
+	
+	.documentation_section p {
+		margin-bottom: 15px;
+    font-family: arial;
+	}
+	
+  .documentation_section h2 {
+	    color: #888888;
+      font-size: 24px;
+      font-weight: normal;
+      letter-spacing: -1px;
+      margin: 0 0 5px;
+      padding: 3px 0 0;
+  }
+	
+	.documentation_table {
+	}
+
+  .documentation_table th {
+    font-weight:bold;
+		padding: 5px;
+    border: 1px solid #ccc;
+		text-align:left;
+  }
+
+  .documentation_table td {
+    padding: 5px;
+		border: 1px solid #ccc;
+  }
+
+  .documentation_table tr {
+  	background-color: white;
+  }
+
+  .documentation_table tr:hover {
+    background-color: #eee;
+  }
+	
+	.documentaiton_note {
+		color: #666;
+		font-style:italic;
+		font-size: 10px;
+	}
+	
+	.code_snippet {
+		margin-top:15px;
+    margin-bottom:15px;
+		background: #F6F7FA;
+		padding:5px;
+		border: 1px dotted #ccc;
+		font-size:12px;
+		font-family: arial;
+	}
+	
+  .data_list {
+    margin-top:15px;
+    margin-bottom:15px;
+    padding:5px;
+		margin-left:20px;
+		list-style:circle;
+  }
+	
+  .snippet {
+    border:1px dotted #ccc; 
+    background-color:#F8F8F8; 
+    padding:10px; 
+    font:12px 'Bitstream Vera Sans Mono','Courier',monospace;
+    margin-bottom:10px;
+  }
+
+  .snippet li {
+ 	  font:12px 'Bitstream Vera Sans Mono','Courier',monospace;
+  }
+</style>
+
+<table style="width:100%">
+	<tr>
+		<td style="width:160px;vertical-align:top;text-align:left;padding:5px;">
+      <%= render :partial => "navigation" %>
+		</td>
+		<td style="width:4px;background-color:#F5F5F5;border-right:1px solid #ccc;">
+			
+		</td>
+		<td style="vertical-align:top;text-align:left;padding:0px;">

data/app/views/tr8n/help/_navigation.html.erb

@@ -1,127 +1,91 @@
 <% @page_title = controller.action_name.titleize.gsub("_"," ") %>
+<% @version = 1 %>
 
-<%= render :partial => "/tr8n/common/header" %>
+<%
+  sections = [
+    {:title => "Introduction", :sections => [
+        {:title => "Welcome", :action => :index},
+    ]}, 
+    {:title => "Translation Basics", :sections => [
+        {:title => "Creating Translations", :action => :creating_translations},
+        {:title => "Voting on Translations", :action => :voting_on_translations},
+        {:title => "Understanding Ranks", :action => :ranks},
+    ]}, 
+    {:title => "Translator Tools", :sections => [
+        {:title => "Language Selector", :action => :language_selector},
+        {:title => "Inline Translator", :action => :inline_translator},
+        {:title => "Advanced Tools", :action => :advanced_tools, :sections => [
+          {:title => "Management", :action => :management},
+          {:title => "Dashboard", :action => :dashboard},
+          {:title => "Site Map", :action => :site_map},
+          {:title => "Phrases", :action => :phrases},
+          {:title => "Relationships", :action => :relationships},
+          {:title => "Translations", :action => :translations},
+          {:title => "Awards", :action => :awards},
+          {:title => "Discussions", :action => :discussions},
+          {:title => "Help", :action => :help},
+        ]},
+    ]}, 
+  ]
+%>
 
 
 <style>
+.documentation_sidebar {
+  font: 11px Arial,Helvetica,sans-serif;
+}
 
-  h1.tr8n             { font-size:18px;border-bottom:1px solid #ccc;margin-bottom:10px; }
-  h2.tr8n             { margin-bottom: 10px; }
-  h3.tr8n             { margin-bottom: 10px; }
+.navigation_header {
+  font: 12px Arial,Helvetica,sans-serif;
+  font-weight: bold;
+  padding-left: 3px;
+  padding-top: 10px;
+  padding-bottom: 10px;
+  text-transform: uppercase;
+	color: #888888 !important;
+}
 
-  p                   { margin-bottom: 20px; }
-  
-  #tr8n_help_title    { margin-bottom:20px; }
-  
-  #tr8n_sidebar       { margin-top:20px;margin-right:40px;width:200px;font-size:12px;float:left;border:dotted 1px #ccc;background-color:#f1f4f9;padding:8px; }
-  
-  #tr8n_sidebar li    { margin:0.5em; padding-left:0px;}
-	ol                  { margin:0.5em; padding-left:0px;}
-  ol.tr8n_primary     { maring-left:0px; padding-left:10px;list-style-type:upper-roman; }
-  ol.tr8n_secondary   { maring-left:0px; padding-left:10px;list-style-type:decimal; }
-  ol.tr8n_tertiary    { maring-left:0px; padding-left:10px;list-style-type:lower-alpha; }
-  ol.tr8n_quaternary  { maring-left:0px; padding-left:10px;list-style-type:decimal; }
-  ol.tr8n_quinternary { maring-left:0px; padding-left:10px;list-style-type:lower-roman; }
-  
-  #tr8n_help_content      { float:left;margin-top:30px;width:600px;font-size:12px; }
-  
-  #tr8n_help_content h1   { margin-bottom:0.75em; }
-  #tr8n_help_content ul   { margin:2em;padding-left:15;list-style-type:disc; }
-  
-  a.tr8n_selected      { color:Black !important;font-weight:bold; }
+.section_link {
+	padding:3px;
+}
 
+.section_link a {
+	text-decoration:none;
+}
+	
+.section_link a:hover {
+  text-decoration:none;
+}
+
+.section_link:hover {
+	background: #eee;
+}
+
+.section_link.selected {
+  background: #4096EE;
+	color:white;
+}
+
+.section_link.selected a {
+  color:white;
+}
 </style>
 
-<%# Note: Section titles must be unique. %>
+<%= form_tag({}, :id => "version_form", :method => :get) do %>
+<%=hidden_field_tag(:path, params[:path])%>
+<div class="documentation_sidebar">
+	
+	<% sections.each do |sec| %>
+    <div class="navigation_header"><%=tr(sec[:title])%></div>
+		<% (sec[:sections] || []).each do |sec1| %>
+      <div class="section_link <%="selected" if controller.action_name == sec1[:action].to_s %>"><%=link_to(tr(sec1[:title]), :action => sec1[:action])%></div>
+			<% if sec1[:sections] %>
+		    <% sec1[:sections].each do |sec2| %>
+	  	      <div style="padding-left:15px;" class="section_link <%="selected" if controller.action_name == sec2[:action].to_s %>"><%=link_to(tr(sec2[:title]), :action => sec2[:action])%></div>
+		    <% end %> 
+			<% end %> 
+		<% end %>	
+	<% end %>
 
-  <div id="tr8n_sidebar">
-    <ol class="tr8n_primary">
-      <li><%= tr8n_help_link("Introduction", { :filename => "index" }) %></li>
-          <ol class="tr8n_secondary">
-            <li><%= tr8n_help_link("Creating Translations") %>
-                <ol class="tr8n_tertiary">
-                  <li><%= tr8n_help_link("Translation Context Rules") %></li>
-                </ol>
-            </li>
-            <li><%= tr8n_help_link("Voting on Translations") %></li>
-            <li><%= tr8n_help_link("Rank") %>
-                <ol class="tr8n_tertiary">
-                  <li><%= tr8n_help_link("User Rank") %></li>
-                  <li><%= tr8n_help_link("Translation Rank") %></li>
-                </ol>
-            </li>
-          </ol>
-      </li>
-      <li><%= tr8n_help_link("Language Selector") %>
-          <ol class="tr8n_secondary">
-            <li><%= tr8n_help_link("Your Languages") %></li>
-            <li><%= tr8n_help_link("Other Languages") %></li>
-            <li><%= tr8n_help_link("Inline Translations") %></li>
-            <li><%= tr8n_help_link("Translation Tools") %></li>
-            <li><%= tr8n_help_link("Manage Language") %></li>
-          </ol>
-      </li>
-      <li><%= tr8n_help_link("Translating Inline") %>
-          <ol class="tr8n_secondary">
-            <li><%= tr8n_help_link("Phrases Without Translations") %>
-              <ol class="tr8n_tertiary">
-                  <li><%= tr8n_help_link("Original Phrase") %></li>
-                  <li><%= tr8n_help_link("Enter Translation") %>
-                      <ol class="tr8n_quaternary">
-                          <li><%= tr8n_help_link("Generate Context Rules") %></li>
-                          <li><%= tr8n_help_link("Translation Tokens") %></li>
-                          <li><%= tr8n_help_link("Suggested Translation") %></li>
-                      </ol>
-                  </li>
-              </ol>
-            </li>
-            <li><%= tr8n_help_link("Phrases With Translations") %></li>
-          </ol>
-      </li>
-      <li><%= tr8n_help_link("Using Translation Tools") %>
-          <ol class="tr8n_secondary">
-            <li><%= tr8n_help_link("Manage") %>
-              <ol class="tr8n_tertiary">
-                  <li><%= tr8n_help_link("Basic Information") %>
-                      <ol class="tr8n_quaternary">
-                          <li><%= tr8n_help_link("Native Name") %></li>
-                          <li><%= tr8n_help_link("Direction") %></li>
-                          <li><%= tr8n_help_link("Fallback Language") %></li>
-                      </ol>
-                  </li>
-                  <li><%= tr8n_help_link("Prohibited Words") %></li>
-                  <li><%= tr8n_help_link("Context Rules") %></li>
-              </ol>
-            </li>
-            <li><%= tr8n_help_link("Dashboard") %>
-              <ol class="tr8n_tertiary">
-                  <li><%= tr8n_help_link("Your Dashboard") %></li>
-                  <li><%= tr8n_help_link("Language Dashboard") %>
-                      <ol class="tr8n_quaternary">
-                          <li><%= tr8n_help_link("Language Statistics") %>
-                              <ol class="tr8n_quinternary">
-                                  <li><%= tr8n_help_link("Language Phrases") %></li>
-                                  <li><%= tr8n_help_link("Your Translations") %></li>
-                              </ol>
-                          </li>
-                          <li><%= tr8n_help_link("Recent Discussions") %></li>
-                          <li><%= tr8n_help_link("Recent Translations") %></li>
-                          <li><%= tr8n_help_link("Recent Translation Votes") %></li>
-                      </ol>
-                  </li>
-              </ol>
-            </li>
-            <li><%= tr8n_help_link("Site Map") %>
-              <ol class="tr8n_tertiary">
-                  <li><%= tr8n_help_link("Site Sections") %></li>
-                  <li><%= tr8n_help_link("Other Translatable Resources") %></li>
-              </ol>
-            </li>
-            <li><%= tr8n_help_link("Phrases") %></li>
-            <li><%= tr8n_help_link("Translations") %></li>
-            <li><%= tr8n_help_link("Awards") %></li>
-            <li><%= tr8n_help_link("Discussions") %></li>
-          </ol>
-      </li>
-    </ol>
-  </div>
+</div>
+<% end %>