Wrap the project name in a div tag inside the h2 tag

When using inline editing of the project name, the extra stuff that's in
the template for a collapsible project adds a bunch of spaces to the
beginning of the project name due to how the editable plugin is getting
the text for the selector it's being asked to edit.

Using the div tag inside the header tag, and adjusting the javascript to
use the div#project_name selector fixes this behavior and fixes #1204

app/views/projects/_project.rhtml

@@ -1,9 +1,10 @@
 <div class="container">
-  <h2 id="project_name">
+  <h2 id="project_name_container">
     <% if collapsible -%>
       <a href="#" class="container_toggle" id="toggle_p<%= project.id %>"><%= image_tag("collapse.png") %></a>
     <% end -%>
-    <%= project.name -%></h2>
+    <div id="project_name" style="width: 100%;"><%= project.name -%></div>
+  </h2>
   <div id="<%= dom_id(project, "container")%>" class="list"><%-# list needs to be here for edit form to work -%>
     <%= render :partial => "projects/project_settings", :object => project, :locals => { :collapsible => collapsible } %>
   </div>

public/javascripts/application.js

@@ -734,8 +734,8 @@ var ProjectListPage = {
     },
     setup_behavior: function() {
         /* in-place edit of project name */
-        $('h2#project_name').editable(ProjectListPage.save_project_name, {
-            style: 'padding:0px',
+        $('div#project_name').editable(ProjectListPage.save_project_name, {
+            style: 'padding: 0px; width=100%;',
             submit: i18n['common.ok'],
             cancel: i18n['common.cancel']
         });