Statistics
| Branch: | Tag: | Revision:

root / snf-cyclades-app / synnefo / ui / new_ui / ui / sass / _machines.scss @ 96e399a4

History | View | Annotate | Download (2.7 kB)

1
/* Machines (VMs)  related styles  */
2

    
3
.vms .items-list {
4
	.img {
5
		width: 60px;
6
		span {
7
			&:hover {
8
				cursor: pointer;
9
			}
10
		}
11
		&:hover {
12
			.snf-PC_fill {
13
				color: darken($vm-active-color,10%);
14
			}
15
		}
16
		.snf-PC_fill {
17
			font-size: 60px;
18
			color: $vm-active-color;
19
		}
20
		&.stopped {
21
			.snf-PC_fill {
22
				color: $vm-stopped-color;
23
			}
24
		}
25
		&.stopped:hover {
26
			span {
27
				cursor: default;
28
			}
29
		}
30
		.os {
31
			@include sprite('../images/os-unknown.png', 22px, 22px);
32
			position: absolute;
33
			top:8px;
34
			left:19px;
35
			&.windows { background-image:url('../images/os-windows.png'); }
36
			&.kubuntu { background-image:url('../images/os-kubuntu.png'); }
37
			&.fedora { background-image:url('../images/os-fedora.png'); }
38
		}
39
	}
40
}
41

    
42
.vm {
43
	.top {
44
		.img {
45
			//@include sprite('../images/vm-on.png', 112px, 116px);
46
			display: inline-block;
47
			height: 112px;
48
			.snf-PC_fill {
49
				font-size: 112px;
50
				color: $vm-active-color;
51
			}
52
			&.stopped {
53
				.snf-PC_fill {
54
					color: $vm-stopped-color;
55
				}
56
			}
57
		}
58
		.os {
59
			@include sprite('../images/os-unknown.png', 44px, 44px);
60
			position: absolute;
61
			background-size:100%;
62
			
63
			left:34px;
64
			top:11px;
65
			&.windows { background-image:url('../images/os-windows.png'); }
66
			&.kubuntu { background-image:url('../images/os-kubuntu.png'); }
67
			&.fedora { background-image:url('../images/os-fedora.png'); }
68
		}
69
	}
70
}
71

    
72

    
73
.create-vm {
74
	.select-os {
75
		li {
76
			width:23%;
77
			padding:20px;
78
			list-style:none outside none;
79
			display: inline-block;
80
			float: left;
81
			height: 200px;
82
			margin:0 10px 10px 0;
83
			&:hover,
84
			&.selected {
85
				background:#fff;
86
				h2, p, a {
87
					color:$secondary-color;
88
				}
89
			}
90
			a {
91
				color:#fff;
92
			}
93
			.os {
94
				@include sprite('../images/os-unknown.png', 30px, 30px);
95
				background-size:100%;
96
				margin-bottom:2em;
97
				&.windows { background-image:url('../images/os-windows.png'); }
98
				&.kubuntu { background-image:url('../images/os-kubuntu.png'); }
99
				&.fedora { background-image:url('../images/os-fedora.png'); }
100
			}
101
			h2 {
102
				font-size:emCalc(16px);
103
				font-weight:normal;
104
				color:#fff;
105
			}
106
			.details {
107
				font-weight:bold;
108
				font-size:emCalc(14px);
109
			}
110
		}
111
	}
112
	.select-flavor {
113
		dl {
114
			color:#fff;
115
			font-size:emCalc(20px);
116
			margin-bottom:10px;
117
			dd {
118
				width:23%;
119
				display: inline-block;
120
			}
121
			dt {
122
				width:70%;
123
				display: inline-block;
124
				font-weight: normal;
125
				span {
126
					@extend .btn3;
127
					min-width: 90px;
128
					margin:0 10px;
129
					&:first-child {
130
						margin-left:0;
131
					}
132
				}
133
			}
134
		}
135
	}
136
}
137

    
138
#vm-connect {
139
	.info {
140
		font-style:italic;
141
		font-size:emCalc(13px);
142
		color: lighten($primary-color,5%);
143
	}
144
	.ssh {
145
		text-align: center;
146
		span {
147
			padding: 10px 30px;
148
			background:$secondary-color;
149
			color:#fff;
150
		}
151
	}
152
}
153

    
154

    
155

    
156