root / snf-cyclades-app / synnefo / ui / new_ui / ui / sass / _items-list.scss @ 026edcbc
History | View | Annotate | Download (1.5 kB)
1 |
/* List view for VMs, networks */ |
---|---|
2 |
|
3 |
.entities { |
4 |
padding-top:25px; |
5 |
} |
6 |
|
7 |
|
8 |
.items-list { |
9 |
li { |
10 |
text-align:center; |
11 |
padding:20px; |
12 |
list-style:none; |
13 |
.add-new { |
14 |
a { |
15 |
margin:0 20px; |
16 |
display: block; |
17 |
font-weight: bold; |
18 |
height:190px; |
19 |
padding:65px 30px 15px; |
20 |
border:1px dashed $primary-color; |
21 |
&:hover { |
22 |
border-color:$third-color; |
23 |
} |
24 |
} |
25 |
} |
26 |
.img-wrap { |
27 |
height: 78px; |
28 |
} |
29 |
.img { |
30 |
margin-bottom: 20px; |
31 |
position: relative; |
32 |
height:58px; |
33 |
display: inline-block; |
34 |
} |
35 |
.container { |
36 |
&.set-bg { background:lighten($primary-color,38%); } |
37 |
&.set-border { border-color:$secondary-color; } |
38 |
border:1px solid transparent; |
39 |
margin: 0 20px; |
40 |
padding:25px 0; |
41 |
position: relative; |
42 |
&:hover { |
43 |
@extend .set-border; |
44 |
.check { |
45 |
@extend .active; |
46 |
} |
47 |
} |
48 |
} |
49 |
.check { |
50 |
position:absolute; |
51 |
right:10px; |
52 |
top:5px; |
53 |
|
54 |
color:lighten($primary-color,35%); |
55 |
font-weight: bold; |
56 |
font-size:emCalc(27px); |
57 |
cursor: pointer; |
58 |
z-index: 10; |
59 |
span { position:relative; z-index:10;} |
60 |
&.active { |
61 |
color:$secondary-color; |
62 |
} |
63 |
} |
64 |
.visible-info { |
65 |
margin: 0 25px; |
66 |
position:relative; |
67 |
color:$primary-color; |
68 |
overflow: hidden; |
69 |
span { |
70 |
&.title { |
71 |
white-space: nowrap; |
72 |
} |
73 |
display: block; |
74 |
position: relative; |
75 |
em { |
76 |
font-style:normal; |
77 |
position: relative; |
78 |
} |
79 |
} |
80 |
} |
81 |
} |
82 |
&.list-view { |
83 |
li { |
84 |
width:100%; |
85 |
} |
86 |
} |
87 |
} |
88 |
|
89 |
@media #{$entities-large} { |
90 |
.entities { |
91 |
.items-list { |
92 |
@include block-grid(4, 20px, true); |
93 |
&.list-view { |
94 |
li { |
95 |
width:100%; |
96 |
} |
97 |
} |
98 |
} |
99 |
} |
100 |
} |