js ui fix

one/static/style.css

@@ -104,6 +104,13 @@ a:link,a:visited{
   margin: 10px 5px;
   width: 200px;
   text-align: right;
+  box-shadow: 0 0 10px rgba(0,0,0,0.3);
+  border: none;
+  border-radius: 4px;
+}
+#modal-container .wizard input:focus{
+  box-shadow: 0 0 12px rgb(128,128,255);
+  outline: none;
 }
 #modal-container .wizard textarea{
   float: right;
@@ -114,6 +121,17 @@ a:link,a:visited{
   font-family:'Metrophobic',sans-serif;
   font-size: 12px;
   text-align: right;
+    box-shadow: 0 0 10px rgba(0,0,0,0.3);
+  border: none;
+}
+.wizard nav a{
+  display: block;
+}
+.wizard nav .prev{
+  float: left;
+}
+.wizard nav .next{
+  float: right;
 }
 .wm .summary{
     padding: 15px 5px;

one/templates/base.html

@@ -18,6 +18,7 @@ $(function(){
     var toggleDetails=function(){
       if($(this).next('.details').is(':hidden')){
             $(this).next('.details')
+                .show()
                 .css('height',0)
                 .css('padding','0px 5px')
                 .animate({height:this.originalHeight,paddingTop:15,paddingBottom:15},700);
@@ -30,6 +31,7 @@ $(function(){
                 .css('padding','15px 5px')
                 .animate({height:0,paddingTop:0,paddingBottom:0},700,function(){
                 $(that).parent('.wm').removeClass('opened');
+                $(that).next('.details').hide();
             });
         }
     }

one/templates/home.html

@@ -97,9 +97,9 @@
                     <div class="clear"></div>
                 </div>
             </li>
-            <li id="new-template" style="display: none">
+            <script type="text/html" id="new-template" style="display: none">
                 {% include "new-template-flow.html" %}
-            </li>
+            </script>
         </ul>
     </div>
     {% for box in boxes %}

one/templates/new-template-flow.html

@@ -9,7 +9,7 @@
 		<ul>
 			<li>
 				<label for="new-template-name">Név</label>
-				<input placeholder="A sablon rövid neve" name="name" id="new-template-name"/>
+				<input placeholder="A sablon rövid neve" name="name" id="new-template-name" />
 				<div class="clear"></div>
 			</li>
 			<li>
@@ -35,11 +35,16 @@
 				<div class="clear"></div>
 			</li>
 		</ul>
+		<nav>
+			<a href="#" class="prev">Mégse</a>
+			<a href="#" class="next">Tovább</a>
+			<div class="clear"></div>
+		</nav>
 	</div>
-	<div id="new-template-step-2">
+	<div id="new-template-step-2" style="display: none">
 		
 	</div>
-	<div id="new-template-step-3">
+	<div id="new-template-step-3" style="display: none">
 		
 	</div>
 </form>