diff --git a/one/static/style.css b/one/static/style.css index 4668e6e..f400d39 100644 --- a/one/static/style.css +++ b/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; diff --git a/one/templates/base.html b/one/templates/base.html index ce020db..dce30f6 100644 --- a/one/templates/base.html +++ b/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(); }); } } diff --git a/one/templates/home.html b/one/templates/home.html index 76b155c..09723b8 100644 --- a/one/templates/home.html +++ b/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 %} diff --git a/one/templates/new-template-flow.html b/one/templates/new-template-flow.html index 0639c63..ff0be3b 100644 --- a/one/templates/new-template-flow.html +++ b/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>