/snf-cyclades-app/synnefo/ui/new_ui/ui/sass/athina.scss - Diff - Synnefo - Greek Research and Technology Network's projects

Revision f46d245b snf-cyclades-app/synnefo/ui/new_ui/ui/sass/athina.scss

     // Global Foundation Settings
     @import "settings";
     /* create vm: choose flavor */
     //$primary-color: #919194; //grey
     //$secondary-color: #ff7bac; //pink
     .titles{
     	color: white;
     /* NOT IN USE! styles for selection window (used for vm_list_v1.html) */
     /*
     .vm_options {
     	display: none;
     	border: 1px solid #ff7bac;
     	position: absolute;
     	top: -20%;
     	width: 100%;
     	height: 100%;
     	font-size: 27px;
     	font-weight: bold;
     	text-align: left;
     	background-color: white;
     	line-height: 45px;
     	padding-left: 1em;
     	padding-top: 0.65em;
     	.custom_checkbox {
     		display: inline-block;
     		margin: 0;
     		padding-left: 1em;
     		color: #ff7bac;
+    	}
+    }
     .lt-sidebar ul li a.flavor_selection{
     	display: block;
     a.option:hover {
     	color: #ff7bac;
+    }
     .vm_container {
     	width: 200px;
     	display: inline-block;
     	height: 187px;
     	position: relative;
+    }
     */
     /* styles for the detailed info of each vm (used for vm_details.html) */
     .graph_container {
     	padding-bottom: 2em;
+    }
     .wrap {
     	position: relative;
+    }
     .section_header {
     	float: left;
     	width:22%;
     	margin-right: 2%;
     	font-weight: bold;
+    }
     .overlay .lt-sidebar ul li a.flavor_selection.chosen_flavor span{
     .right_side {
     	overflow: hidden;
     	width: 76%;
+    }
     .info_simple {
     	display: inline-block;
     	margin-right: 10px;
+    }
     .action_links {
     	display: inline-block;
     	a {
     		color:  $secondary-color;
     		margin-right: 5px;
     		&:hover {
     		text-decoration: underline;
+    	}
     	span:first-child {
     	margin-right: 5px;
+    }
+    }
+    }
     a.black {
     	color: black;
     	&:hover {
     		color:  $secondary-color;
+    	}
+    }
     .create-vm .main .select-flavor dl dt span{
     	&:hover{
      		color: white;
     		border-color: white;
     		background-color: $secondary-color;
+    	}
     	&.current {
     .btn_pinkb {
     	width: 11.5em;
     	height: 3.8em;
     	line-height: 3.8em;
     	border: 1px solid  $secondary-color;
     	position: absolute;
     	top: 0;
     	right: 0;
     	a {
     		display: block;
     		padding-left: 1em;
     		&:hover {
     			color: $secondary-color;
     			border-color: white;
     			background-color: white;
     			color:  $secondary-color;
+    		}
     		img {
     			position: absolute;
     			right: 0.6em;
     			top: 0.6em;
     			height: 2.5em;
+    		}
+    	}
+    }
     .row {
     	margin: 0 0 0.4em 0;
+    }
     .middle_side {
     	max-width: 70%;
+    }
     .txt_size {
     	height: 0.8em;
     	vertical-align: baseline;
+    }
      /* styles for network details */
      .big {
      	width: 60%;
+     }
      .small {
      	width: 170px;
+     }
     .wrapper .details .top {
     	padding: 70px 2.5em;
     	.actions ul li {
     		margin: 0 30px;
+    	}
+    }
     .height_up {
     	line-height: 1.3em;
+    }
     .set {
     	margin-bottom: 1em;
+    }
     /* main icon in details page */
     .network {
     	.top .img {
     	background: url("../images/network-green102x116.png") no-repeat center center;
     	width: 102px;
     	height: 116px;
     	display: inline-block;
     	text-indent: -2000px;
     	overflow: hidden;
     	background-size: 100%;
+    	}
     	.close-font{
     		position: absolute;
     		right: 0.8em;
     		top: 2em;
     		font-size: 2em;
     		color: #b3b3b3;
+    	}
+    }
     /* for scroll bar */
     .networks .items-list {
     	.img {
     		background: url("../images/network-green102x116.png") no-repeat center center;
     		height: 58px;
     		width: 51px;
     		display: inline-block;
     		text-indent: -2000px;
     		overflow: hidden;
     		background-size: 80%;
+    	}
     	/* for network list */
     	.container
+    	{
     		.img {
     			background-size: 100%
+    		}
     		.options .wrap a {
     			width: 50%;
+    		}
+    	}
+    }
     /* detailed pages: about the gaps that separate the area with the big img and the buttons from the rest of the page */
     .details .top .actions ul{
     	padding: 1em 1em 0;
     	margin-bottom: 0;
+    }
     .content {
     	position: relative;
     	.overlay-modal {
     		position: absolute;
     		left:0;
     		top:0;
     		width: 100%;
     		height: 100%;
     		z-index:98;
     		background:  $secondary-color;
+    	}
     	.overlay-div {
     		position:absolute; top:20%; left:25%; width:50%;
     		padding:25px;
     		background:white;
     		display:none; z-index:100;
     		.buttons {
     			margin-bottom:0;
     			a {
     				margin-right:20px;
+    			}
+    		}
+    	}
+    }
     .btn4 {
       color: white;
       border-color:  $secondary-color;
       background:  $secondary-color;
       &:hover, .current {
       	color: $secondary-color;
       	border-color:  $secondary-color;
       	background: white;
+      }
+    }
     .overlay .lt-sidebar.nav ul li:hover  {
     	background-color: transparent;
+    }
     .lt-sidebar.nav {
     	font-size: 1em
+    }
     .overlay {
     	.lt-sidebar.nav  {
     	overflow: auto;
+    	}
     	/* styles for close icons (created with fontIcon "snf-font") */
     	.close_char {
     		background: none;
     		text-indent: 0;
     		font-size: 1.8em; /* for the the character e (for d we can put 2em) */
     		color: white;
+    	}
+    }
     /* create network styles */
     .create-network {
     	color: white;
     	.check {
     		color: white;
+    	}
     	p {
     		font-size: 0.8em;
     		font-style: italic;
     		margin: 5px 0 0;
     		width: 545px;
+    	}
     	li {
     		list-style: none outside none;
+    	}
     	.custom_checkbox {
     		font-size: 1.3em;
+    	}
+    }
     .subnet_options {
     	margin: 0;
     	li {
     		margin-bottom: 6px;
     		padding-left: 155px;
+    	}
+    }
     .network_options {
     	position: relative;
     	width: 350px;
     	min-height: 285px;
     	.check {
     		position: absolute;
     		right: 0;
+    	}
     	li {
     		display: block;
     		margin-bottom: 13px;
     		form {
     			margin: 0;
     			input {
     				position: absolute;
     				display: inline-block;
     				right: 0;
     				width: 200px;
     				height: 20px;
     				font-size: 0.9em;
     				&.hidden {
     					display: none;
+    				}
+    			}
+    		}
     		&.manual form input {
     			right: -160px;
     			width: 150px;
+    		}
+    	}
+    }
     span.sub_title {
     	position: absolute;
+    }
     /* pithos: list of uploading files */
     .upload-widget {
     	.files {
     		color: white;
     		li {
     			padding: 10px 120px;
     			border: none;
     			position: relative;
     			.name-col {
     				width: 34%;
+    			}
     			.size-col {
     				text-align: left;
     				float: none;
+    			}
     			.dz-success-mark {
     				margin-left:10px;
+    			}
     			.dz-error-mark {
     				display: none;
+    			}
     			.cancel-col {
     				width: 100px;
     				position: absolute;
     				right: 50px;
     				top: 9px;
     				.cancel span {
     					display: block;
     					text-align: right;
+    				}
+    			}
+    		}
     		div {
     			display: inline-block;
+    		}
     		.progress-bar {
     			position: static;
     			padding: 0;
     			width: 25%;
     			border: none;
     			background-color: transparent;
     			.progress-wrap {
     				width: 100%;
     				margin: 0;
     				.progress {
     					display: block;
     					margin: 0;
     					border: 2px solid white;
     					padding: 0;
     					background-color:  $secondary-color;
     					.meter {
     						background-color: white;
+    					}
+    				}
+    			}
+    		}
+    	}
+    }

Also available in: Unified diff