diff --git a/app/views/admin/designs/_tab_form.html.erb b/app/views/admin/designs/_tab_form.html.erb
index e46428aba..e13f8fee8 100644
--- a/app/views/admin/designs/_tab_form.html.erb
+++ b/app/views/admin/designs/_tab_form.html.erb
@@ -1,6 +1,6 @@
 <%= form_for :file, :url => update_file_admin_design_path(:type => type, :object_id => object.id), :remote => true, :method => :post do |f| %>
   <div id='post-body-content'>
-    <%= f.text_area :content, :class => 'middle', :value => object.file.read.force_encoding('UTF-8') %>
+    <%= f.text_area :content, :class => 'code middle', :value => object.file.read.force_encoding('UTF-8'), :name=>"html_code"%>
   </div>
   <div class="form-actions form-fixed pagination-right">
     <button class="btn btn-primary"><%= t(:save) %></button>
diff --git a/app/views/admin/designs/edit.html.erb b/app/views/admin/designs/edit.html.erb
index 9b0ef7fad..8a5b8187d 100644
--- a/app/views/admin/designs/edit.html.erb
+++ b/app/views/admin/designs/edit.html.erb
@@ -4,60 +4,98 @@
 
 <head>
     <%= stylesheet_link_tag "lib/wrap-nav"%>
-    <%= stylesheet_link_tag "lib/main-list"%>
-    <%= stylesheet_link_tag "lib/mt-list"%>
     <%= stylesheet_link_tag "lib/filter"%>
+    <%= stylesheet_link_tag "lib/code_editor"%>
+    <%= stylesheet_link_tag "lib/codemirror/codemirror"%>
     <%= stylesheet_link_tag "lib/codemirror/theme/theme"%>
   
-    <%= javascript_include_tag 'codemirror/codemirror' %>
-    <%= javascript_include_tag 'codemirror/jquery.codemirror' %>  
-    <%= javascript_include_tag 'codemirror/mode/css' %> 
-    <%= javascript_include_tag 'codemirror/mode/xml' %> 
-    <%= javascript_include_tag 'codemirror/mode/vbscript' %> 
-    <%= javascript_include_tag 'codemirror/mode/javascript' %> 
-    <%= javascript_include_tag 'codemirror/mode/htmlmixed' %> 
-    <%= javascript_include_tag 'codemirror/addon/edit/closetag' %> 
-    <%= javascript_include_tag 'codemirror/addon/edit/closebrackets' %> 
-    <%= javascript_include_tag 'codemirror/util/formatting' %> 
-    <%= javascript_include_tag 'lib/templates_code' %>   
+    <%= javascript_include_tag "codemirror/codemirror" %>
+    <%= javascript_include_tag "codemirror/jquery.codemirror" %>  
+    <%= javascript_include_tag "codemirror/mode/css" %> 
+    <%= javascript_include_tag "codemirror/mode/xml" %> 
+    <%= javascript_include_tag "codemirror/mode/vbscript" %> 
+    <%= javascript_include_tag "codemirror/mode/javascript" %> 
+    <%= javascript_include_tag "codemirror/mode/htmlmixed" %> 
+    <%= javascript_include_tag "codemirror/addon/edit/closetag" %> 
+    <%= javascript_include_tag "codemirror/addon/edit/closebrackets" %> 
+    <%= javascript_include_tag "codemirror/util/formatting" %> 
+    <%= javascript_include_tag "lib/templates_code" %>   
 </head>
 
-<h1><%= @design.title %></h1>
+        <!-- Main -->
+        <h3><%= @design.title %></h3>
+        <div class="pull-right btn-group">
+          <a class="btn dropdown-toggle" data-toggle="dropdown" href="#">
+            Theme
+            <span class="caret"></span>
+          </a>
+          <ul id="code-theme" class="dropdown-menu">
+            <li><a href="default">Default</a></li>
+            <li><a href="ambiance-mobile">Ambiance Mobile</a></li>
+            <li><a href="ambiance">Ambiance</a></li>
+            <li><a href="blackboard">Blackboard</a></li>
+            <li><a href="cobalt">Cobalt</a></li>
+            <li><a href="eclipse">Eclipse</a></li>
+            <li><a href="elegant">Elegant</a></li>
+            <li><a href="erlang-dark">Erlang Dark</a></li>
+            <li><a href="midnight">Midnight</a></li>
+            <li><a href="monokai">Monokai</a></li>
+            <li><a href="neat">Neat</a></li>
+            <li><a href="night">Night</a></li>
+            <li><a href="rubyblue">Rubyblue</a></li>
+            <li><a href="solarized">Solarized</a></li>
+            <li><a href="theme">Theme</a></li>
+            <li><a href="twilight">Twilight</a></li>
+            <li><a href="vibrant-ink">Vibrant Ink</a></li>
+            <li><a href="xq-dark">Xq Dark</a></li>
+            <li><a href="xq-light">Xq Light</a></li>
+          </ul>
+        </div>
+        <ul id="code-tab" class="nav nav-pills">
+          <li class="dropdown active">
+            <a href="#" class="dropdown-toggle" data-toggle="dropdown">HTML <b class="caret"></b></a>
+            <ul class="dropdown-menu">
+              <li class="active"><a href="#html_0" data-toggle="tab"><%= @design.layout.name %></a></li>
+              <% @design.themes.each do |theme| %>
+              <li><a href="#<%= dom_id theme %>" data-toggle="tab"><%= theme.name %></a></li>
+              <%end%>
+            </ul>
+          </li>
+          <li class="dropdown">
+            <a href="#" class="dropdown-toggle" data-toggle="dropdown">CSS <b class="caret"></b></a>
+            <ul class="dropdown-menu">
+              <li><a href="#css_0" data-toggle="tab"><%= @design.css_default.name %></a></li>
+              <li><a href="#css_1" data-toggle="tab"><%= @design.css_reset.name %></a></li>
+            </ul>
+          </li>
+          <li class="dropdown">
+            <a href="#" class="dropdown-toggle" data-toggle="dropdown">Javascript <b class="caret"></b></a>
+            <ul class="dropdown-menu">
+              <% @design.javascripts.each do |js| %>
+               <li><a href="#<%= dom_id js %>" data-toggle="tab"><%= js.name %></a></li>
+              <% end %>
+            </ul>
+          </li>
+        </ul>
+        <div id="code-groups" class="tab-content">
+          <div class="clearfix tab-pane fade active in" id="html_0">
+            <%= render :partial => 'tab_form', :locals => {:type => :layout, :object => @design.layout} %>
+          </div>
+          <% @design.themes.each do |theme| %>
+          <div class="clearfix tab-pane fade active in" id="<%= dom_id theme %>">
+           <%= render :partial => 'tab_form', :locals => {:type => :themes, :object => theme} %>
+          </div>
+          <% end %>
+          <div class="clearfix tab-pane fade active in" id="css_0">
+            <%= render :partial => 'tab_form', :locals => {:type => :css_default, :object => @design.css_default} %>
+          </div>
+          <div class="clearfix tab-pane fade active in" id="css_1">
+            <%= render :partial => 'tab_form', :locals => {:type => :css_reset, :object => @design.css_reset} %>
+          </div>
 
-<ul class="nav nav-tabs" id="myTab">
-  <li class="active"><a href="#info" data-toggle="tab"><%= t(:info) %></a></li>
-  <li><a href="#layout" data-toggle="tab"><%= @design.layout.name %></a></li>
-  <li><a href="#css_default" data-toggle="tab"><%= @design.css_default.name %></a></li>
-  <li><a href="#css_reset" data-toggle="tab"><%= @design.css_reset.name %></a></li>
-  <li class="dropdown">
-    <a href="#" class="dropdown-toggle" data-toggle="dropdown"><%= t(:themes) %> <b class="caret"></b></a>
-    <ul class="dropdown-menu">
-      <% @design.themes.each do |theme| %>
-        <li><a href="#<%= dom_id theme %>" data-toggle="tab"><%= theme.name %></a></li>
-      <% end %>
-    </ul>
-  </li>
-  <li class="dropdown">
-    <a href="#" class="dropdown-toggle" data-toggle="dropdown"><%= t(:javascripts) %> <b class="caret"></b></a>
-    <ul class="dropdown-menu">
-      <% @design.javascripts.each do |js| %>
-        <li><a href="#<%= dom_id js %>" data-toggle="tab"><%= js.name %></a></li>
-      <% end %>
-    </ul>
-  </li>
-  <li><a href="#images" data-toggle="tab"><%= t(:images) %></a></li>
-</ul>
- 
-<div class="tab-content">
-  <div class="tab-pane active" id="info"><%= render :partial => 'form' %></div>
-  <div class="tab-pane" id="layout"><%= render :partial => 'tab_form', :locals => {:type => :layout, :object => @design.layout} %></div>
-  <div class="tab-pane" id="css_default"><%= render :partial => 'tab_form', :locals => {:type => :css_default, :object => @design.css_default} %></div>
-  <div class="tab-pane" id="css_reset"><%= render :partial => 'tab_form', :locals => {:type => :css_reset, :object => @design.css_reset} %></div>
-  <% @design.themes.each do |theme| %>
-    <div class="tab-pane" id="<%= dom_id theme %>"><%= render :partial => 'tab_form', :locals => {:type => :themes, :object => theme} %></div>
-  <% end %>
-  <% @design.javascripts.each do |js| %>
-    <div class="tab-pane" id="<%= dom_id js %>"><%= render :partial => 'tab_form', :locals => {:type => :javascripts, :object => js} %></div>
-  <% end %>
-  <div class="tab-pane" id="images"><%= render :partial => 'images' %></div>
-</div>
+        <% @design.javascripts.each do |js| %>
+          <div class="clearfix tab-pane fade active in" id="#<%= dom_id js %>">
+            <%= render :partial => 'tab_form', :locals => {:type => :javascripts, :object => js} %>
+          </div>
+        <% end %>
+        </div>
\ No newline at end of file
