Revision 5b2f3030 snf-cyclades-app/synnefo/ui/new_ui/ui/sass/app.scss
b/snf-cyclades-app/synnefo/ui/new_ui/ui/sass/app.scss | ||
---|---|---|
198 | 198 |
} |
199 | 199 |
|
200 | 200 |
.main { |
201 |
padding:20px 40px;
|
|
201 |
padding:43px 40px;
|
|
202 | 202 |
} |
203 | 203 |
|
204 | 204 |
body.with-overlay { |
... | ... | |
327 | 327 |
color:$white; |
328 | 328 |
} |
329 | 329 |
|
330 |
|
|
330 | 331 |
.items-list { |
331 | 332 |
padding:25px 0; |
332 | 333 |
li { |
333 | 334 |
text-align:center; |
334 | 335 |
padding:20px; |
336 |
.add-new { |
|
337 |
a { |
|
338 |
margin:0 20px; |
|
339 |
display: block; |
|
340 |
font-weight: bold; |
|
341 |
height:190px; |
|
342 |
padding:65px 30px 15px; |
|
343 |
border:2px dashed $primary-color; |
|
344 |
&:hover { |
|
345 |
border-color:$secondary-color; |
|
346 |
color:$secondary-color; |
|
347 |
} |
|
348 |
} |
|
349 |
} |
|
350 |
.img { |
|
351 |
margin-bottom: 20px; |
|
352 |
position: relative; |
|
353 |
height:58px; |
|
354 |
} |
|
355 |
.container { |
|
356 |
&.set-bg { background:lighten($primary-color,30%); } |
|
357 |
&.set-border { border-color:$secondary-color; } |
|
358 |
border:1px solid transparent; |
|
359 |
margin: 0 20px; |
|
360 |
padding:25px 0; |
|
361 |
position: relative; |
|
362 |
.options { |
|
363 |
width:100%; |
|
364 |
text-align:center; |
|
365 |
position: absolute; |
|
366 |
top:-3px; |
|
367 |
left:0; |
|
368 |
display: none; |
|
369 |
z-index: 1; |
|
370 |
.wrap { |
|
371 |
height:100%; |
|
372 |
padding:25px; |
|
373 |
text-align: left; |
|
374 |
a { |
|
375 |
font-size:emCalc(27px); |
|
376 |
display: block; |
|
377 |
color:$primary-color; |
|
378 |
line-height: 1em; |
|
379 |
margin-bottom:10px; |
|
380 |
|
|
381 |
font-weight: bold; |
|
382 |
&:hover { |
|
383 |
color: $secondary-color; |
|
384 |
} |
|
385 |
} |
|
386 |
} |
|
387 |
} |
|
388 |
} |
|
389 |
.check { |
|
390 |
position:absolute; |
|
391 |
right:10px; |
|
392 |
top:5px; |
|
393 |
display: none; |
|
394 |
color:$secondary-color; |
|
395 |
font-weight: bold; |
|
396 |
font-size:emCalc(27px); |
|
397 |
cursor: pointer; |
|
398 |
z-index: 10; |
|
399 |
span { position:relative; z-index:10;} |
|
400 |
} |
|
335 | 401 |
.visible-info { |
336 | 402 |
margin: 0 25px; |
337 | 403 |
position:relative; |
338 | 404 |
color:$primary-color; |
405 |
overflow: hidden; |
|
339 | 406 |
span { |
407 |
&.title { |
|
408 |
white-space: nowrap; |
|
409 |
} |
|
340 | 410 |
display: block; |
341 | 411 |
position: relative; |
342 | 412 |
em { |
... | ... | |
345 | 415 |
} |
346 | 416 |
} |
347 | 417 |
} |
348 |
} |
|
349 |
} |
|
350 | 418 |
|
351 |
.vms { |
|
352 |
.items-list { |
|
353 |
li { |
|
354 |
.add-new { |
|
355 |
a { |
|
356 |
margin:0 20px; |
|
357 |
display: block; |
|
358 |
font-weight: bold; |
|
359 |
height:190px; |
|
360 |
padding:65px 30px 15px; |
|
361 |
border:2px dashed $primary-color; |
|
362 |
&:hover { |
|
363 |
border-color:$secondary-color; |
|
364 |
color:$secondary-color; |
|
365 |
} |
|
366 |
} |
|
367 |
} |
|
368 |
.img { |
|
369 |
@include sprite('../images/vm-on.png', 56px, 58px); |
|
370 |
margin-bottom: 20px; |
|
371 |
position: relative; |
|
372 |
&.stopped { |
|
373 |
background-image:url('../images/vm-stopped.png'); |
|
374 |
} |
|
375 |
.os { |
|
376 |
@include sprite('../images/os-unknown.png', 22px, 22px); |
|
377 |
position: absolute; |
|
378 |
top:8px; |
|
379 |
left:18px; |
|
380 |
&.windows { background-image:url('../images/os-windows.png'); } |
|
381 |
&.kubuntu { background-image:url('../images/os-kubuntu.png'); } |
|
382 |
&.fedora { background-image:url('../images/os-fedora.png'); } |
|
383 |
} |
|
384 |
|
|
385 |
} |
|
386 |
|
|
387 |
.container { |
|
388 |
&.set-bg { background:lighten($primary-color,30%); } |
|
389 |
&.set-border { border-color:$secondary-color; } |
|
390 |
border:1px solid transparent; |
|
391 |
margin: 0 20px; |
|
392 |
padding:25px 0; |
|
393 |
position: relative; |
|
394 |
.options { |
|
395 |
width:100%; |
|
396 |
text-align:center; |
|
397 |
position: absolute; |
|
398 |
top:-3px; |
|
399 |
left:0; |
|
400 |
display: none; |
|
401 |
z-index: 1; |
|
402 |
.wrap { |
|
403 |
height:100%; |
|
404 |
padding:25px; |
|
405 |
text-align: left; |
|
406 |
a { |
|
407 |
font-size:emCalc(27px); |
|
408 |
display: block; |
|
409 |
color:$primary-color; |
|
410 |
line-height: 1em; |
|
411 |
margin-bottom:10px; |
|
412 |
|
|
413 |
font-weight: bold; |
|
414 |
&:hover { |
|
415 |
color: $secondary-color; |
|
416 |
} |
|
417 |
} |
|
418 |
} |
|
419 |
} |
|
420 |
} |
|
421 |
.check { |
|
422 |
position:absolute; |
|
423 |
right:10px; |
|
424 |
top:5px; |
|
425 |
display: none; |
|
426 |
color:$secondary-color; |
|
427 |
font-weight: bold; |
|
428 |
font-size:emCalc(27px); |
|
429 |
cursor: pointer; |
|
430 |
z-index: 10; |
|
431 |
span { position:relative; z-index:10;} |
|
432 |
} |
|
433 |
|
|
434 |
} |
|
435 | 419 |
} |
436 | 420 |
} |
437 | 421 |
|
438 |
.lt-sidebar.vms { |
|
422 |
.lt-sidebar { |
|
423 |
margin-top:43px; |
|
439 | 424 |
overflow:scroll; |
440 | 425 |
height:300px; |
441 | 426 |
font-size:emCalc(12px); |
... | ... | |
457 | 442 |
|
458 | 443 |
} |
459 | 444 |
|
460 |
.vm { |
|
445 |
.vms .items-list {
|
|
461 | 446 |
.img { |
462 |
@include sprite('../images/vm-on.png', 56px, 58px); |
|
463 |
margin-bottom: 20px; |
|
464 |
position: relative; |
|
465 |
&.stopped { |
|
466 |
background-image:url('../images/vm-stopped.png'); |
|
467 |
} |
|
468 |
.os { |
|
469 |
@include sprite('../images/os-unknown.png', 22px, 22px); |
|
470 |
position: absolute; |
|
471 |
top:8px; |
|
472 |
left:18px; |
|
473 |
&.windows { background-image:url('../images/os-windows.png'); } |
|
474 |
&.kubuntu { background-image:url('../images/os-kubuntu.png'); } |
|
475 |
&.fedora { background-image:url('../images/os-fedora.png'); } |
|
476 |
} |
|
447 |
@include sprite('../images/vm-on.png', 56px, 58px); |
|
448 |
|
|
449 |
&.stopped { |
|
450 |
background-image:url('../images/vm-stopped.png'); |
|
477 | 451 |
} |
452 |
.os { |
|
453 |
@include sprite('../images/os-unknown.png', 22px, 22px); |
|
454 |
position: absolute; |
|
455 |
top:8px; |
|
456 |
left:18px; |
|
457 |
&.windows { background-image:url('../images/os-windows.png'); } |
|
458 |
&.kubuntu { background-image:url('../images/os-kubuntu.png'); } |
|
459 |
&.fedora { background-image:url('../images/os-fedora.png'); } |
|
460 |
} |
|
461 |
|
|
462 |
} |
|
478 | 463 |
} |
479 | 464 |
|
480 |
.details { |
|
481 |
position:relative; |
|
482 |
|
|
465 |
|
|
466 |
.vm { |
|
483 | 467 |
.top { |
484 |
padding:100px $header-padding-horizontal; |
|
485 |
text-align: center; |
|
486 | 468 |
.img { |
487 | 469 |
@include sprite('../images/vm-on.png', 112px, 116px); |
488 |
background-size:100%; |
|
470 |
} |
|
471 |
&.stopped { |
|
472 |
background-image:url('../images/vm-stopped.png'); |
|
489 | 473 |
} |
490 | 474 |
.os { |
475 |
@include sprite('../images/os-unknown.png', 22px, 22px); |
|
476 |
position: absolute; |
|
491 | 477 |
background-size:100%; |
492 | 478 |
width:44px; |
493 | 479 |
height:44px; |
494 | 480 |
left:36px; |
495 | 481 |
top:16px; |
482 |
&.windows { background-image:url('../images/os-windows.png'); } |
|
483 |
&.kubuntu { background-image:url('../images/os-kubuntu.png'); } |
|
484 |
&.fedora { background-image:url('../images/os-fedora.png'); } |
|
485 |
} |
|
486 |
} |
|
487 |
} |
|
488 |
|
|
489 |
.details { |
|
490 |
position:relative; |
|
491 |
|
|
492 |
.top { |
|
493 |
padding:100px $header-padding-horizontal; |
|
494 |
text-align: center; |
|
495 |
.img { |
|
496 |
background-size:100%; |
|
497 |
margin-bottom: 20px; |
|
498 |
position: relative; |
|
496 | 499 |
} |
497 | 500 |
.actions { |
498 | 501 |
ul { |
... | ... | |
530 | 533 |
} |
531 | 534 |
} |
532 | 535 |
|
536 |
|
|
537 |
|
|
538 |
|
|
539 |
|
|
533 | 540 |
.border-bottom-style1 { |
534 | 541 |
padding-bottom:20px; |
535 | 542 |
margin-bottom:20px; |
Also available in: Unified diff