commit d572ccc6da588912531f72410aae1743816eb7dd
Author: Athina Bekakou <athinabek@grnet.gr>
Date:   Thu Nov 7 15:51:53 2013 +0200

    new ui: update the icons in header and actions-bar

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 c85106a..aa37ffa 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
@@ -21,10 +21,13 @@
 		<header class="header">
 		<nav>
 			<ul class="icons-nav">
-				<li><a href="vm_list.html" data-tooltip class="has-tip" title="Machines"><span class="snf-PC"></span></a></li>
+				<li><a href="vm_list.html" data-tooltip class="has-tip current" title="Machines"><span class="snf-PC_fill"></span></a></li>
 				<li><a href="network_list.html" data-tooltip class="has-tip current" title="Networks"><span class="snf-network_full"></span></a></li>
 				<li><a href="" data-tooltip class="has-tip" title="Disks"><span class="snf-HDD"></span></a></li>
 				<li><a href="pithos_list.html" data-tooltip class="has-tip" title="Storage" ><span class="snf-Pithos"></span></a></li>
+				<li><a href="" data-tooltip class="has-tip" title="Images" ><span class="snf-images"></span></a></li>
+				<li><a href="" data-tooltip class="has-tip" title="Snapshots" ><span class="snf-snapshot"></span></a></li>
+				<li><a href="" data-tooltip class="has-tip" title="More" ><span class="snf-plus"></span></a></li>
 			</ul>
 		</nav>
 		<div class="login">
@@ -155,11 +158,11 @@
 	</div>
 	<!-- overlays end -->
 	
-		<section class="actions-bar clearfix">
-			<h2>Networks</h2>
+				<section class="actions-bar clearfix">
+			<h2>Virtual Machines</h2>
 			<div class="view-type">
-				<a href="" class="list"><span class="snf-list"></span></a>
-				<a href="" class="grid"><span class="snf-layout current"></span></a>
+				<a href="" class="list"><span class="snf-listview "></span></a>
+				<a href="" class="grid"><span class="snf-gridview current"></span></a>
 			</div>
 			<div class="filter-menu">
 				<a class="filter" href="">Filter</a>
diff --git a/snf-cyclades-app/synnefo/ui/new_ui/ui/sass/_common.scss b/snf-cyclades-app/synnefo/ui/new_ui/ui/sass/_common.scss
index 3056e15..9627c8e 100644
--- a/snf-cyclades-app/synnefo/ui/new_ui/ui/sass/_common.scss
+++ b/snf-cyclades-app/synnefo/ui/new_ui/ui/sass/_common.scss
@@ -427,6 +427,7 @@ body {
 		position:relative;
 		float: right;
 		height: $bar-height;
+		margin-right: -6px;
 		-webkit-transition: width 0.3s;
 	    -moz-transition: width 0.3s;
 	    transition: width 0.3s;
@@ -467,60 +468,23 @@ body {
 			width: 190px;
 		}
 	}
-
-	.sb-search {
-		$icon-dim :24px;
-		float: right;
-		margin-top:3px;
-		min-width: $icon-dim;
-		height: $icon-dim;
-		.sb-icon-search {
-			height: $icon-dim;
-			width: $icon-dim;
-			color: $primary-color;
-		}
-		form {
-			display: inline-block;
-			margin:0;
-			.input-wrap {
-				width:180px;
-				overflow: hidden;
-			}
-			input {
-				border: transparent;
-				background-color: white;
-				color: $overlay-color;
-				padding: 0 10px;
-				width: 160px;
-				font-size: emCalc(10px);
-				box-shadow: none;
-				height:0.7* $bar-height;
-				line-height: 0.7* $bar-height;
-				position: relative;
-				top:-3px;
-				@include placeholder {
-					color:$overlay-color;
-				}
-			}
-		}
-		&.sb-search-open {
-			width:220px;
-		}
-	}
-
 	.view-type {
 		float: right;
 		margin-right:15px;
-		.current,
-		a:hover {
+		.current, a:hover {
 			color: $secondary-color;
 		}
-		.snf-list {
-				margin-right: 6px;
-				font-size: 17px;
+		.snf-listview {
+			position: relative;
+			top: 3px;
+			margin-right: 3px;
+			font-size: 22px;
 		}
-		.snf-layout {
-				font-size: 1.1em;
+		.snf-gridview {
+				font-size: 22px;
+				position: relative;
+				top: 3px;
+				margin-right: 3px;
 		}
 		
 	}
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 37dddd5..76c8cf3 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
@@ -7209,12 +7209,13 @@ body {
   position: relative;
   float: right;
   height: 30px;
+  margin-right: -6px;
   -webkit-transition: width 0.3s;
   -moz-transition: width 0.3s;
   transition: width 0.3s;
   -webkit-backface-visibility: hidden;
 }
-/* line 434, ../sass/_common.scss */
+/* line 435, ../sass/_common.scss */
 .actions-bar .hd-search .hd-icon-search {
   color: #919194;
   display: block;
@@ -7226,12 +7227,12 @@ body {
   position: relative;
   background: #ebebec;
 }
-/* line 441, ../sass/_common.scss */
+/* line 442, ../sass/_common.scss */
 .actions-bar .hd-search .hd-icon-search:hover {
   cursor: pointer;
   color: #30c79e;
 }
-/* line 449, ../sass/_common.scss */
+/* line 450, ../sass/_common.scss */
 .actions-bar .hd-search .hd-search-input {
   border: transparent;
   background-color: white;
@@ -7262,106 +7263,53 @@ body {
 .actions-bar .hd-search .hd-search-input::-webkit-input-placeholder {
   color: #485057;
 }
-/* line 466, ../sass/_common.scss */
+/* line 467, ../sass/_common.scss */
 .actions-bar .hd-search.hd-open {
   width: 190px;
 }
 /* line 471, ../sass/_common.scss */
-.actions-bar .sb-search {
-  float: right;
-  margin-top: 3px;
-  min-width: 24px;
-  height: 24px;
-}
-/* line 477, ../sass/_common.scss */
-.actions-bar .sb-search .sb-icon-search {
-  height: 24px;
-  width: 24px;
-  color: #919194;
-}
-/* line 482, ../sass/_common.scss */
-.actions-bar .sb-search form {
-  display: inline-block;
-  margin: 0;
-}
-/* line 485, ../sass/_common.scss */
-.actions-bar .sb-search form .input-wrap {
-  width: 180px;
-  overflow: hidden;
-}
-/* line 489, ../sass/_common.scss */
-.actions-bar .sb-search form input {
-  border: transparent;
-  background-color: white;
-  color: #485057;
-  padding: 0 10px;
-  width: 160px;
-  font-size: 0.625em;
-  box-shadow: none;
-  height: 21px;
-  line-height: 21px;
-  position: relative;
-  top: -3px;
-}
-/* line 74, ../sass/_common.scss */
-.actions-bar .sb-search form input.placeholder {
-  color: #485057;
-}
-/* line 75, ../sass/_common.scss */
-.actions-bar .sb-search form input:-moz-placeholder {
-  color: #485057;
-}
-/* line 76, ../sass/_common.scss */
-.actions-bar .sb-search form input::-moz-placeholder {
-  color: #485057;
-}
-/* line 77, ../sass/_common.scss */
-.actions-bar .sb-search form input::-webkit-input-placeholder {
-  color: #485057;
-}
-/* line 506, ../sass/_common.scss */
-.actions-bar .sb-search.sb-search-open {
-  width: 220px;
-}
-/* line 511, ../sass/_common.scss */
 .actions-bar .view-type {
   float: right;
   margin-right: 15px;
 }
-/* line 515, ../sass/_common.scss */
-.actions-bar .view-type .current,
-.actions-bar .view-type a:hover {
+/* line 474, ../sass/_common.scss */
+.actions-bar .view-type .current, .actions-bar .view-type a:hover {
   color: #30c79e;
 }
-/* line 518, ../sass/_common.scss */
-.actions-bar .view-type .snf-list {
-  margin-right: 6px;
-  font-size: 17px;
+/* line 477, ../sass/_common.scss */
+.actions-bar .view-type .snf-listview {
+  position: relative;
+  top: 3px;
+  margin-right: 3px;
+  font-size: 22px;
 }
-/* line 522, ../sass/_common.scss */
-.actions-bar .view-type .snf-layout {
-  font-size: 1.1em;
+/* line 483, ../sass/_common.scss */
+.actions-bar .view-type .snf-gridview {
+  font-size: 22px;
+  position: relative;
+  top: 3px;
+  margin-right: 3px;
 }
 
-/* line 528, ../sass/_common.scss */
+/* line 492, ../sass/_common.scss */
 .new-btn {
   position: absolute;
   left: 15px;
   bottom: 0;
   height: 30px;
 }
-/* line 535, ../sass/_common.scss */
+/* line 499, ../sass/_common.scss */
 .new-btn a span {
   font-size: 1.25em;
 }
 
 /* Icons Navigation ----------------------------------------------- */
-/* line 543, ../sass/_common.scss */
+/* line 507, ../sass/_common.scss */
 .icons-nav {
   margin: 0;
   padding: 0;
 }
-/* line 545, ../sass/_common.scss */
+/* line 509, ../sass/_common.scss */
 .icons-nav li {
   display: inline-block;
   margin: 0 5px;
@@ -7372,24 +7320,24 @@ body {
   text-align: center;
   overflow: hidden;
 }
-/* line 554, ../sass/_common.scss */
+/* line 518, ../sass/_common.scss */
 .icons-nav li a {
   color: #1a1a1a;
 }
-/* line 556, ../sass/_common.scss */
+/* line 520, ../sass/_common.scss */
 .icons-nav li a:hover, .icons-nav li a.current {
   color: #30c79e;
 }
 
 /* Top info  ----------------------------------------------- */
-/* line 569, ../sass/_common.scss */
+/* line 533, ../sass/_common.scss */
 .top-info {
   padding: 50px 100px;
   position: relative;
   z-index: 10;
   display: none;
 }
-/* line 574, ../sass/_common.scss */
+/* line 538, ../sass/_common.scss */
 .top-info .close {
   position: absolute;
   right: 15px;
@@ -7402,31 +7350,31 @@ body {
   overflow: hidden;
 }
 
-/* line 583, ../sass/_common.scss */
+/* line 547, ../sass/_common.scss */
 .info.error {
   background: #ff5c58;
   color: #fff;
 }
 
-/* line 589, ../sass/_common.scss */
+/* line 553, ../sass/_common.scss */
 .info.alert {
   background: #30c79e;
   color: #fff;
 }
 
-/* line 594, ../sass/_common.scss */
+/* line 558, ../sass/_common.scss */
 .info.warning {
   background: #919194;
   color: #fff;
 }
 
-/* line 599, ../sass/_common.scss */
+/* line 563, ../sass/_common.scss */
 .info.success {
   background: #00a551;
   color: #fff;
 }
 
-/* line 604, ../sass/_common.scss */
+/* line 568, ../sass/_common.scss */
 .border-bottom-style1 {
   padding-bottom: 20px;
   margin-bottom: 20px;
@@ -7434,7 +7382,7 @@ body {
 }
 
 /* Progress Bar ----------------------------------------------- */
-/* line 613, ../sass/_common.scss */
+/* line 577, ../sass/_common.scss */
 .progress-bar {
   position: fixed;
   bottom: 0;
@@ -7445,53 +7393,53 @@ body {
   padding: 20px 0 20px 310px;
   color: #919194;
 }
-/* line 622, ../sass/_common.scss */
+/* line 586, ../sass/_common.scss */
 .progress-bar span.counter {
   display: inline-block;
   margin-right: 20px;
   float: left;
 }
-/* line 627, ../sass/_common.scss */
+/* line 591, ../sass/_common.scss */
 .progress-bar div.progress-wrap {
   display: inline-block;
   float: left;
   width: 40%;
   margin-right: 60px;
 }
-/* line 632, ../sass/_common.scss */
+/* line 596, ../sass/_common.scss */
 .progress-bar div.progress-wrap .progress {
   position: relative;
   top: 2px;
 }
-/* line 637, ../sass/_common.scss */
+/* line 601, ../sass/_common.scss */
 .progress-bar span.more {
   display: inline-block;
 }
 
 /* Responive ------------------------------------------------ */
 @media only screen and (max-width: 768px) {
-  /* line 648, ../sass/_common.scss */
+  /* line 612, ../sass/_common.scss */
   body {
     padding-top: 0;
   }
 
-  /* line 651, ../sass/_common.scss */
+  /* line 615, ../sass/_common.scss */
   .header, .actions-bar {
     position: static;
     z-index: auto;
   }
 
-  /* line 655, ../sass/_common.scss */
+  /* line 619, ../sass/_common.scss */
   .actions-bar {
     top: 160px;
   }
 
-  /* line 658, ../sass/_common.scss */
+  /* line 622, ../sass/_common.scss */
   .header {
     height: 120px;
     line-height: 50px;
   }
-  /* line 661, ../sass/_common.scss */
+  /* line 625, ../sass/_common.scss */
   .header .icons-nav {
     position: static;
   }
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 8b59fed..d571e5c 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
@@ -26,6 +26,9 @@
 				<li><a href="network_list.html" data-tooltip class="has-tip" title="Networks"><span class="snf-network"></span></a></li>
 				<li><a href="" data-tooltip class="has-tip" title="Disks"><span class="snf-HDD"></span></a></li>
 				<li><a href="pithos_list.html" data-tooltip class="has-tip" title="Storage" ><span class="snf-Pithos"></span></a></li>
+				<li><a href="" data-tooltip class="has-tip" title="Images" ><span class="snf-images"></span></a></li>
+				<li><a href="" data-tooltip class="has-tip" title="Snapshots" ><span class="snf-snapshot"></span></a></li>
+				<li><a href="" data-tooltip class="has-tip" title="More" ><span class="snf-plus"></span></a></li>
 			</ul>
 		</nav>
 		<div class="login">
@@ -726,8 +729,8 @@ Confirm that the options you have selected are correct</p>
 		<section class="actions-bar clearfix">
 			<h2>Virtual Machines</h2>
 			<div class="view-type">
-				<a href="" class="list"><span class="snf-list"></span></a>
-				<a href="" class="grid"><span class="snf-layout current"></span></a>
+				<a href="" class="list"><span class="snf-listview "></span></a>
+				<a href="" class="grid"><span class="snf-gridview current"></span></a>
 			</div>
 			<div class="filter-menu">
 				<a class="filter" href="">Filter</a>
