commit 45d9d31556e34097bd1298ca2861afc3be7e2337
Author: Athina Bekakou <athinabek@grnet.gr>
Date:   Fri Oct 18 11:43:47 2013 +0300

    new ui: fix bug and style on network wizard
    
    * Change input field style
    * Add simple style on focused elements
    * Modify reset function

diff --git a/snf-cyclades-app/synnefo/ui/new_ui/ui/javascripts/network-wizard.js b/snf-cyclades-app/synnefo/ui/new_ui/ui/javascripts/network-wizard.js
index 0428488..0731331 100644
--- a/snf-cyclades-app/synnefo/ui/new_ui/ui/javascripts/network-wizard.js
+++ b/snf-cyclades-app/synnefo/ui/new_ui/ui/javascripts/network-wizard.js
@@ -10,7 +10,18 @@ ui.wizard.network = {
         $('body').removeClass('with-overlay');
         $('.overlay-area').fadeOut(400, function() {
             $('.overlay-div').hide();
+        ui.wizard.network.reset('#network-wizard');
         });
+    },
+
+    reset: function(area) {
+        $(area).find('input').val('');
+        $(area).find('.snf-radio-checked').not('.prechecked').toggleClass('snf-radio-checked snf-radio-unchecked');
+        $(area).find('.snf-radio-unchecked.prechecked').toggleClass('snf-radio-checked snf-radio-unchecked');
+        $(area).find('.snf-checkbox-checked').not('.prechecked').toggleClass('snf-checkbox-checked snf-checkbox-unchecked');
+        $(area).find('.snf-checkbox-unchecked.prechecked').toggleClass('snf-checkbox-checked snf-checkbox-unchecked');
+        $(area).find('li .manual .input').hide();
+        $(area).find('ul.subnet_options').parent('li').show();
     }
 }
 
@@ -25,11 +36,9 @@ $(document).ready(function(){
     ui.wizard.network.btns.cancel = ui.wizard.network.btns.new_network.find('.bottom .nav.prev');
     ui.wizard.network.btns.create = ui.wizard.network.btns.new_network.find('.bottom .nav.next');
 
-
-     // create network
     $('.network_options .check').click(function(e){
-    e.preventDefault();
-    $(this).parents('li').siblings().find('ul.subnet_options').parent('li').toggle();
+        e.preventDefault();
+        $(this).parents('li').siblings().find('ul.subnet_options').parent('li').toggle();
     });
 
     $('.network_options .radio_btn').click(function(e){
@@ -40,10 +49,10 @@ $(document).ready(function(){
             ui.changeRadiobuttonState(this);
 
             if($(this).hasClass('manual')) {
-                $(this).siblings('.manual_sub').toggle();
+                $(this).siblings('.input').toggle();
             }
             else {
-                $(this).closest('li').siblings().find('.manual_sub').hide();
+                $(this).closest('li').siblings('.manual').find('.input').hide();
             }
         }
        
diff --git a/snf-cyclades-app/synnefo/ui/new_ui/ui/javascripts/vm-wizard.js b/snf-cyclades-app/synnefo/ui/new_ui/ui/javascripts/vm-wizard.js
index 37ebeed..4650c99 100644
--- a/snf-cyclades-app/synnefo/ui/new_ui/ui/javascripts/vm-wizard.js
+++ b/snf-cyclades-app/synnefo/ui/new_ui/ui/javascripts/vm-wizard.js
@@ -206,10 +206,10 @@ ui.wizard = {
 		$('.overlay-area').fadeOut(400, function() {
 			$('.overlay-div').hide();
 		});
-		ui.wizard.resetWizard();
+		ui.wizard.reset();
 	},
 	// manually sets elements to a initial state
-	resetWizard: function() {
+	reset: function() {
 		ui.wizard.current_step = 1;
 		$('.step').removeAttr('style');
 		$('.bottom').show();
diff --git a/snf-cyclades-app/synnefo/ui/new_ui/ui/network_list.html b/snf-cyclades-app/synnefo/ui/new_ui/ui/network_list.html
index 7abcadd..7f90297 100644
--- a/snf-cyclades-app/synnefo/ui/new_ui/ui/network_list.html
+++ b/snf-cyclades-app/synnefo/ui/new_ui/ui/network_list.html
@@ -39,8 +39,9 @@
 
 	<!-- overlays start -->
 	<div class="overlay-area">
-		<a href="" class="close"><span class="snf-close"></span></a>
+		
 		<div id="overlay1" class="overlay-div">
+			<a href="" class="close"><span class="snf-close"></span></a>
 			<p>Are you sure you want to reboot your machine?</p>
 			<p class="buttons"><a href="" class="btn4">YES</a><a href="" class="btn4">NO</a></p>
 		</div>
@@ -79,7 +80,7 @@
 									</li>
 									<li class="dhcp_option"><span>Assign IP addresses automatically:</span>
 										<a href="" class="check">
-											<span class="snf-checkbox-checked"></span>
+											<span class="snf-checkbox-checked prechecked"></span>
 										</a>
 										<p>
 											If you enable DHCP on the private network, connected virtual machines will automatically be assigned an IP address based on the given subnet. You may disable this option if you want to assign IP addresses to the connected virtual machines manually.
@@ -91,7 +92,7 @@
 											<li>
 												<span>Auto 
 													<a href="" class="radio_btn">
-														<span class="snf-radio-checked"></span>
+														<span class="snf-radio-checked prechecked"></span>
 													</a>
 												</span>
 											</li>
@@ -101,7 +102,7 @@
 														<a href="" class="radio_btn manual">
 															<span class="snf-radio-unchecked"></span>
 														</a>
-														<input class="manual_sub hidden" type="text" name="network_name">
+														<span class="input"><input type="text" placeholder=""></span>
 													</span>
 												</form>
 											</li>
diff --git a/snf-cyclades-app/synnefo/ui/new_ui/ui/sass/_networks.scss b/snf-cyclades-app/synnefo/ui/new_ui/ui/sass/_networks.scss
index 65fefb2..5cb0916 100644
--- a/snf-cyclades-app/synnefo/ui/new_ui/ui/sass/_networks.scss
+++ b/snf-cyclades-app/synnefo/ui/new_ui/ui/sass/_networks.scss
@@ -18,6 +18,16 @@
 
 
 #network-wizard {
+
+	a {
+		&.nav:focus {
+			border: none;
+		}
+		&:focus {
+			border: 1px solid $overlay-color-top;
+		}
+	}
+
 	li {
 		list-style: none outside none;
 	}
@@ -68,27 +78,16 @@
 		li {
 			display: block;
 			margin-bottom: 13px;
-		
-			form {
-				margin: 0;
-				
-				input {
+			&.manual{
+				position: relative;
+				.input {
 					position: absolute;
-					display: inline-block;
-					right: 0;
-					width: 200px;
-					height: 20px;
-					font-size: 0.9em;
-					
-					&.hidden {
-						display: none;
-					}
+					right: -170px;
+					width: 150px;
+					bottom: 5px;
+					display: none;
 				}
 			}
-			&.manual form input {
-				right: -160px;
-				width: 150px;
-			}
 		}		
 		span.sub_title {
 			float:left;
diff --git a/snf-cyclades-app/synnefo/ui/new_ui/ui/stylesheets/app.css b/snf-cyclades-app/synnefo/ui/new_ui/ui/stylesheets/app.css
index 53cbbef..48e8105 100644
--- a/snf-cyclades-app/synnefo/ui/new_ui/ui/stylesheets/app.css
+++ b/snf-cyclades-app/synnefo/ui/new_ui/ui/stylesheets/app.css
@@ -8040,84 +8040,82 @@ body {
   overflow: hidden;
 }
 
-/* line 21, ../sass/_networks.scss */
+/* line 23, ../sass/_networks.scss */
+#network-wizard a.nav:focus {
+  border: none;
+}
+/* line 26, ../sass/_networks.scss */
+#network-wizard a:focus {
+  border: 1px solid #636a70;
+}
+/* line 31, ../sass/_networks.scss */
 #network-wizard li {
   list-style: none outside none;
 }
-/* line 25, ../sass/_networks.scss */
+/* line 35, ../sass/_networks.scss */
 #network-wizard .net_wiz_main {
   padding: 40px;
   width: 390px;
 }
-/* line 31, ../sass/_networks.scss */
+/* line 41, ../sass/_networks.scss */
 #network-wizard .snf-checkbox-checked, #network-wizard .snf-checkbox-unchecked {
   font-size: 1.3em;
 }
-/* line 34, ../sass/_networks.scss */
+/* line 44, ../sass/_networks.scss */
 #network-wizard .subnet_options {
   margin: 0;
 }
-/* line 36, ../sass/_networks.scss */
+/* line 46, ../sass/_networks.scss */
 #network-wizard .subnet_options li {
   margin-bottom: 6px;
   padding-left: 155px;
 }
-/* line 44, ../sass/_networks.scss */
+/* line 54, ../sass/_networks.scss */
 #network-wizard .main {
   padding: 40px;
 }
-/* line 46, ../sass/_networks.scss */
+/* line 56, ../sass/_networks.scss */
 #network-wizard .main a {
   color: white;
 }
-/* line 47, ../sass/_networks.scss */
+/* line 57, ../sass/_networks.scss */
 #network-wizard .main .network_options {
   position: relative;
   width: 36.25em;
   margin: 0 auto;
 }
-/* line 49, ../sass/_networks.scss */
+/* line 59, ../sass/_networks.scss */
 #network-wizard .main .network_options .dhcp_option p {
   font-size: 0.75em;
 }
-/* line 56, ../sass/_networks.scss */
+/* line 66, ../sass/_networks.scss */
 #network-wizard .main .network_options .check, #network-wizard .main .network_options .radio_btn {
   position: absolute;
   right: 0;
 }
-/* line 61, ../sass/_networks.scss */
+/* line 71, ../sass/_networks.scss */
 #network-wizard .main .network_options .network-name h2 {
   color: white;
   font-size: 1em;
 }
-/* line 68, ../sass/_networks.scss */
+/* line 78, ../sass/_networks.scss */
 #network-wizard .main .network_options li {
   display: block;
   margin-bottom: 13px;
 }
-/* line 72, ../sass/_networks.scss */
-#network-wizard .main .network_options li form {
-  margin: 0;
-}
-/* line 75, ../sass/_networks.scss */
-#network-wizard .main .network_options li form input {
-  position: absolute;
-  display: inline-block;
-  right: 0;
-  width: 200px;
-  height: 20px;
-  font-size: 0.9em;
+/* line 81, ../sass/_networks.scss */
+#network-wizard .main .network_options li.manual {
+  position: relative;
 }
 /* line 83, ../sass/_networks.scss */
-#network-wizard .main .network_options li form input.hidden {
-  display: none;
-}
-/* line 88, ../sass/_networks.scss */
-#network-wizard .main .network_options li.manual form input {
-  right: -160px;
+#network-wizard .main .network_options li.manual .input {
+  position: absolute;
+  right: -170px;
   width: 150px;
+  bottom: 5px;
+  display: none;
 }
-/* line 93, ../sass/_networks.scss */
+/* line 92, ../sass/_networks.scss */
 #network-wizard .main .network_options span.sub_title {
   float: left;
 }
