commit b4c26e76f188e5c239f5689a950491b7f37be08d
Author: Athina Bekakou <athinabek@grnet.gr>
Date:   Tue Nov 5 12:05:43 2013 +0200

    new ui: modify the style of "new machine" button

diff --git a/snf-cyclades-app/synnefo/ui/new_ui/ui/vm_list.html b/snf-cyclades-app/synnefo/ui/new_ui/ui/vm_list.html
index 92b2d6b..da21874 100644
--- a/snf-cyclades-app/synnefo/ui/new_ui/ui/vm_list.html
+++ b/snf-cyclades-app/synnefo/ui/new_ui/ui/vm_list.html
@@ -748,10 +748,24 @@ Confirm that the options you have selected are correct</p>
 		<section class="main row">
 			<div class="vms entities">
 				<ul class="items-list sortable">
-					<li data-order="0">
-						<div class="add-new"><a href="vm_create_a.html" data-overlay-id="#vm-wizard">NEW<br>MACHINE</a></div>
+					<li data-status="add-new">
+						<div class="container">
+							<div class="img-wrap">
+								<div class="img">
+								<a href="" data-overlay-id="#vm-wizard">
+									<span class="snf-PC_fill"></span>
+									<span class="os symbol">+</span>
+									</a>
+								</div>
+							</div>
+							<p class="visible-info">
+								<span class="title">
+									<a><em>New Machine</em></a>
+								</span>
+							</p>
+						</div>
 					</li>
-					<li data-order="1" data-status="running">
+					<li data-status="building">
 						<div class="more">
 							<div class="clearfix">
 								<div class="col lt">
@@ -776,7 +790,7 @@ Confirm that the options you have selected are correct</p>
 							<div class="img-wrap">
 								<div class="img running">
 									<span class="snf-PC_fill" data-reveal-id="vm-connect"></span>
-									<span class="os fedora" data-reveal-id="vm-connect">fedora</span>
+									<span class="os" data-reveal-id="vm-connect">unknown</span>
 								</div>
 							</div>
 							<p class="visible-info">
@@ -787,10 +801,12 @@ Confirm that the options you have selected are correct</p>
 							<div class="tags">
 							</div>
 							<div class= "status">
+								<span class="state"><a href="">BUILDING</a></span>
+								<span class="logs">798.56 MB of 4.33 GB<br>(18%)</span>
 							</div>
 						</div>
 					</li>
-					<li data-order="2" data-status="building">
+					<li data-status="error">
 						<div class="more">
 							<div class="clearfix">
 								<div class="col lt">
@@ -809,7 +825,7 @@ Confirm that the options you have selected are correct</p>
 									</ul>
 								</div>
 							</div>
-							<div class="vm-name">vm name 1 really large name vm name vm 1 really large name vm</div>
+							<div class="vm-name">short name</div>
 						</div>
 						<div class="container">
 							<div class="img-wrap">
@@ -820,18 +836,18 @@ Confirm that the options you have selected are correct</p>
 							</div>
 							<p class="visible-info">
 								<span class="title">
-									<a href="vm_details.html"><em>vm name 1 really large name vm name vm 1 really large name vm</em></a>
+									<a href="vm_details.html"><em>short name</em></a>
 								</span>
 							</p>
 							<div class="tags">
 							</div>
 							<div class= "status">
-								<span class="state"><a href="">BUILDING</a></span>
-								<span class="logs">798.56 MB of 4.33 GB<br>(18%)</span>
+								<span class="state"><a href="">ERROR</a></span>
+								<span class="logs">Image customization failed.<br>Did not finish on time.</span>
 							</div>
 						</div>
 					</li>
-					<li  data-order="3" data-status="off">
+					<li data-status="running">
 						<div class="more">
 							<div class="clearfix">
 								<div class="col lt">
@@ -854,9 +870,9 @@ Confirm that the options you have selected are correct</p>
 						</div>
 						<div class="container">
 							<div class="img-wrap">
-								<div class="img off">
-									<span class="snf-PC_fill"></span>
-									<span class="os fedora">fedora</span>
+								<div class="img running">
+									<span class="snf-PC_fill" data-reveal-id="vm-connect"></span>
+									<span class="os fedora" data-reveal-id="vm-connect">fedora</span>
 								</div>
 							</div>
 							<p class="visible-info">
@@ -865,13 +881,12 @@ Confirm that the options you have selected are correct</p>
 								</span>
 							</p>
 							<div class="tags">
-								<a href="" class="tag1">&nbsp;</a>
-								<a href="" class="tag2">&nbsp;</a>
-								<a href="" class="tag3">&nbsp;</a>
+							</div>
+							<div class= "status">
 							</div>
 						</div>
 					</li>
-					<li  data-order="4" data-status="rebooting">
+					<li data-status="rebooting">
 						<div class="more">
 							<div class="clearfix">
 								<div class="col lt">
@@ -913,7 +928,7 @@ Confirm that the options you have selected are correct</p>
 							</div>
 						</div>
 					</li>
-					 <li  data-order="5" data-status="starting">
+					<li data-status="starting">
 						<div class="more">
 							<div class="clearfix">
 								<div class="col lt">
@@ -953,7 +968,7 @@ Confirm that the options you have selected are correct</p>
 							</div>
 						</div>
 					</li>
-					<li data-order="6" data-status="off">
+					<li  data-status="shutting">
 						<div class="more">
 							<div class="clearfix">
 								<div class="col lt">
@@ -978,7 +993,7 @@ Confirm that the options you have selected are correct</p>
 							<div class="img-wrap">
 								<div class="img running">
 									<span class="snf-PC_fill" data-reveal-id="vm-connect"></span>
-									<span class="os fedora" data-reveal-id="vm-connect">fedora</span>
+									<span class="os kubuntu" data-reveal-id="vm-connect">kubuntu</span>
 								</div>
 							</div>
 							<p class="visible-info">
@@ -986,13 +1001,16 @@ Confirm that the options you have selected are correct</p>
 									<a href="vm_details.html"><em>short name</em></a>
 								</span>
 							</p>
-							<div class="tags">
-							</div>
 							<div class= "status">
+								<span class="state"><a href="">SHUTTING DOWN</a></span>
+							</div>
+							<div class="tags">
+								<a href="" class="tag1">&nbsp;</a>
+								<a href="" class="tag2">&nbsp;</a>
 							</div>
 						</div>
 					</li>
-					<li data-order="7" data-status="error">
+					 <li data-status="running">
 						<div class="more">
 							<div class="clearfix">
 								<div class="col lt">
@@ -1017,7 +1035,7 @@ Confirm that the options you have selected are correct</p>
 							<div class="img-wrap">
 								<div class="img running">
 									<span class="snf-PC_fill" data-reveal-id="vm-connect"></span>
-									<span class="os" data-reveal-id="vm-connect">unknown</span>
+									<span class="os kubuntu" data-reveal-id="vm-connect">kubuntu</span>
 								</div>
 							</div>
 							<p class="visible-info">
@@ -1025,15 +1043,12 @@ Confirm that the options you have selected are correct</p>
 									<a href="vm_details.html"><em>short name</em></a>
 								</span>
 							</p>
-							<div class="tags">
-							</div>
 							<div class= "status">
-								<span class="state"><a href="">ERROR</a></span>
-								<span class="logs">Image customization failed.<br>Did not finish on time.</span>
+								<span class="state"><a href="">RUNNING</a></span>
 							</div>
 						</div>
 					</li>
-					<li  data-order="8" data-status="off">
+					<li data-status="off">
 						<div class="more">
 							<div class="clearfix">
 								<div class="col lt">
@@ -1056,9 +1071,9 @@ Confirm that the options you have selected are correct</p>
 						</div>
 						<div class="container">
 							<div class="img-wrap">
-								<div class="img">
-									<span class="snf-PC_fill"></span>
-									<span class="os fedora">fedora</span>
+								<div class="img running">
+									<span class="snf-PC_fill" data-reveal-id="vm-connect"></span>
+									<span class="os fedora" data-reveal-id="vm-connect">fedora</span>
 								</div>
 							</div>
 							<p class="visible-info">
@@ -1067,13 +1082,12 @@ Confirm that the options you have selected are correct</p>
 								</span>
 							</p>
 							<div class="tags">
-								<a href="" class="tag1">&nbsp;</a>
-								<a href="" class="tag2">&nbsp;</a>
-								<a href="" class="tag3">&nbsp;</a>
+							</div>
+							<div class= "status">
 							</div>
 						</div>
 					</li>
-					<li  data-order="9" data-status="shutting">
+					<li data-status="off">
 						<div class="more">
 							<div class="clearfix">
 								<div class="col lt">
@@ -1092,30 +1106,28 @@ Confirm that the options you have selected are correct</p>
 									</ul>
 								</div>
 							</div>
-							<div class="vm-name">short name</div>
+							<div class="vm-name">vm name 1 really large name vm name vm 1 really large name vm</div>
 						</div>
 						<div class="container">
 							<div class="img-wrap">
-								<div class="img running">
-									<span class="snf-PC_fill" data-reveal-id="vm-connect"></span>
-									<span class="os kubuntu" data-reveal-id="vm-connect">kubuntu</span>
+								<div class="img off">
+									<span class="snf-PC_fill"></span>
+									<span class="os fedora">fedora</span>
 								</div>
 							</div>
 							<p class="visible-info">
 								<span class="title">
-									<a href="vm_details.html"><em>short name</em></a>
+									<a href="vm_details.html"><em>vm name 1 really large name vm name vm 1 really large name vm</em></a>
 								</span>
 							</p>
-							<div class= "status">
-								<span class="state"><a href="">SHUTTING DOWN</a></span>
-							</div>
 							<div class="tags">
 								<a href="" class="tag1">&nbsp;</a>
 								<a href="" class="tag2">&nbsp;</a>
+								<a href="" class="tag3">&nbsp;</a>
 							</div>
 						</div>
 					</li>
-					 <li  data-order="10" data-status="running">
+					<li data-status="off">
 						<div class="more">
 							<div class="clearfix">
 								<div class="col lt">
@@ -1138,9 +1150,9 @@ Confirm that the options you have selected are correct</p>
 						</div>
 						<div class="container">
 							<div class="img-wrap">
-								<div class="img running">
-									<span class="snf-PC_fill" data-reveal-id="vm-connect"></span>
-									<span class="os kubuntu" data-reveal-id="vm-connect">kubuntu</span>
+								<div class="img">
+									<span class="snf-PC_fill"></span>
+									<span class="os fedora">fedora</span>
 								</div>
 							</div>
 							<p class="visible-info">
@@ -1148,8 +1160,10 @@ Confirm that the options you have selected are correct</p>
 									<a href="vm_details.html"><em>short name</em></a>
 								</span>
 							</p>
-							<div class= "status">
-								<span class="state"><a href="">RUNNING</a></span>
+							<div class="tags">
+								<a href="" class="tag1">&nbsp;</a>
+								<a href="" class="tag2">&nbsp;</a>
+								<a href="" class="tag3">&nbsp;</a>
 							</div>
 						</div>
 					</li>
