Create/Manage dialog UI changes for M22

chrome/browser/resources/options2/manage_profile_overlay.html

 <div id="manage-profile-overlay" class="page" hidden>
   <div class="close-button"></div>
   <!-- Dialog for managing profiles. -->
   <div id="manage-profile-overlay-manage" hidden>
     <h1 i18n-content="manageProfile"></h1>
     <div id="manage-profile-content" class="content-area">
       <div id="manage-profile-icon-label"
           i18n-content="manageProfilesIconLabel">
       </div>
       <grid id="manage-profile-icon-grid"></grid>
-      <div id="manage-profile-name-div">
+      <div class="profile-name-area">

[James Hawkins, 2012/07/31 17:01:07]

Optional nit: s/area/container/

[Halli, 2012/07/31 23:57:51]

Done.

         <span id="manage-profile-name-label"
           i18n-content="manageProfilesNameLabel"></span>
+      </div>
+      <div class="profile-name-area">
         <input id="manage-profile-name" type="text" required>
       </div>
       <div id="manage-profile-error-bubble" hidden>
       </div>
     </div>
+    <div id="manage-profile-separator"></div>

[James Hawkins, 2012/07/31 17:01:07]

What is this div about?

[Halli, 2012/07/31 17:37:05]

See comment on .css file. I added a separate div to get the grey divider line
above the button area, because I couldn't get a properly spaced line as a bottom
border for the content-area or top-border for the button area since I can't edit
the content-area or action-area css (right?) suggestions are more than welcome
(:

     <div class="action-area">
       <!-- TODO: (hallielaine) activate this checkbox, and add hooks for
            shortcut creation in M23
       <div class="action-area-checkbox-container">
         <div class="checkbox">
           <label>
             <input id="manage-shortcut" type="checkbox">
             <span for="manage-shortcut" 
                 i18n-content="createProfileShortcut">
             </span>
@@ skipping 20 matching lines @@
             i18n-content="deleteProfileOK"></button>
       </div>
     </div>
   </div>
   <!-- Dialog for creating profiles. -->
   <div id="manage-profile-overlay-create" hidden>
     <h1 i18n-content="createProfileTitle"></h1>
     <div id="create-profile-content" class="content-area">
       <div id="create-profile-instructions"></div>
       <grid id="create-profile-icon-grid"></grid>
-      <div id="create-profile-name-div">
+      <div class="profile-name-area">
         <span id="create-profile-name-label"
             i18n-content="manageProfilesNameLabel">
         </span>
+      </div>
+      <div class="profile-name-area">
         <input id="create-profile-name" type="text" required>
       </div>
       <div id="create-profile-error-bubble" hidden></div>
     </div>
+    <div id="create-profile-separator"></div>
     <div class="action-area">
       <!-- TODO: (hallielaine) activate this checkbox, and add hooks for
            shortcut creation in M23
       <div class="action-area-checkbox-container">
         <div class="checkbox">
           <label>
             <input id="create-shortcut" type="checkbox">
             <span for="create-shortcut"
                 i18n-content="createProfileShortcut">
             </span>
           </label>
         </div>
       </div>
       -->
       <div class="button-strip">
         <button id="create-profile-cancel" i18n-content="cancel"></button>
         <button id="create-profile-ok" i18n-content="createProfileConfirm">
         </button>
       </div>
     </div>
   </div>
 </div>