Statistics
| Branch: | Tag: | Revision:

root / snf-cyclades-app / synnefo / ui / new_ui / ui / sass / _storage.scss @ eda4930e

History | View | Annotate | Download (4.9 kB)

1 15948f00 Olga Brani
/* Storage (pithos) related styles  */
2 15948f00 Olga Brani
3 c9d873e8 Olga Brani
.storage {
4 aafda5ef Athina Bekakou
	height: 100%;
5 9b0b486b Olga Brani
	.rect-plus {
6 9b0b486b Olga Brani
		display: inline-block;
7 9b0b486b Olga Brani
		background-color: #fff;
8 9b0b486b Olga Brani
		color: $link-color-hover;
9 9b0b486b Olga Brani
		padding: 0 6px;
10 9b0b486b Olga Brani
		font-size: emCalc(26px);
11 9b0b486b Olga Brani
		&:hover {
12 9b0b486b Olga Brani
			color: $link-color;
13 c9d873e8 Olga Brani
		}
14 9b0b486b Olga Brani
	}
15 0ef95fe4 Olga Brani
	.items-list {
16 0ef95fe4 Olga Brani
		height: 100%;
17 0ef95fe4 Olga Brani
		&>li {
18 0ef95fe4 Olga Brani
			.img-wrap {
19 0ef95fe4 Olga Brani
				top: 0;
20 9b0b486b Olga Brani
				height: $list-icon-height;
21 9b0b486b Olga Brani
				line-height: $list-icon-height;
22 c9d873e8 Olga Brani
			}
23 0b14cfb4 Olga Brani
			h4 {
24 0b14cfb4 Olga Brani
				width: $storage-h4-w;
25 0b14cfb4 Olga Brani
			}
26 c9d873e8 Olga Brani
		}
27 c4728006 Olga Brani
		.folder {
28 c4728006 Olga Brani
			.img-wrap {
29 c4728006 Olga Brani
				background: url(../images/folder-closed.png) no-repeat center center;
30 c4728006 Olga Brani
			}
31 c4728006 Olga Brani
			&.draghover {
32 c4728006 Olga Brani
				.img-wrap {
33 c4728006 Olga Brani
					background-image: url(../images/folder-open.png);
34 c4728006 Olga Brani
				}
35 c4728006 Olga Brani
			}
36 3fd0db82 Athina Bekakou
			&.updating {
37 3fd0db82 Athina Bekakou
				.img-wrap {
38 3fd0db82 Athina Bekakou
					background-image: url(../images/folder-updating.png);
39 3fd0db82 Athina Bekakou
				}
40 3fd0db82 Athina Bekakou
			}
41 3fd0db82 Athina Bekakou
			&.updated {
42 3fd0db82 Athina Bekakou
				.img-wrap {
43 3fd0db82 Athina Bekakou
					background-image: url(../images/folder-updated.png);
44 3fd0db82 Athina Bekakou
				}
45 3fd0db82 Athina Bekakou
			}
46 c4728006 Olga Brani
		}
47 0ef95fe4 Olga Brani
		li:hover {
48 0ef95fe4 Olga Brani
			.actions-col {
49 0ef95fe4 Olga Brani
				visibility: visible;
50 c9d873e8 Olga Brani
			}
51 0ef95fe4 Olga Brani
		}
52 0ef95fe4 Olga Brani
		.add-new {
53 0ef95fe4 Olga Brani
			position: relative;
54 0ef95fe4 Olga Brani
			input[type="file"] {
55 0ef95fe4 Olga Brani
				position: absolute;
56 0ef95fe4 Olga Brani
				left:$lt-bar-width;
57 0ef95fe4 Olga Brani
				top:0;
58 0ef95fe4 Olga Brani
				right: 0;
59 0ef95fe4 Olga Brani
				bottom: 0;
60 0ef95fe4 Olga Brani
				opacity: 0;
61 a5461c52 Athina Bekakou
				margin: 0;
62 c9d873e8 Olga Brani
			}
63 292a32ef Olga Brani
			h4 {
64 292a32ef Olga Brani
				color: #fff;
65 292a32ef Olga Brani
			}
66 292a32ef Olga Brani
			&:hover {
67 292a32ef Olga Brani
				.rect-plus	{
68 292a32ef Olga Brani
					color: $link-color;
69 292a32ef Olga Brani
				}
70 292a32ef Olga Brani
			}
71 292a32ef Olga Brani
		}
72 292a32ef Olga Brani
		&.drag {
73 292a32ef Olga Brani
			background-color: $light-bg;
74 c9d873e8 Olga Brani
		}
75 c9d873e8 Olga Brani
	}
76 bfdaac22 Athina Bekakou
}
77 bfdaac22 Athina Bekakou
.containers {
78 bfdaac22 Athina Bekakou
	.items-list {
79 bfdaac22 Athina Bekakou
		overflow: visible;
80 bfdaac22 Athina Bekakou
		&>li {
81 bfdaac22 Athina Bekakou
			text-align: left;
82 97cd255d Olga Brani
			padding-right: 50px;
83 97cd255d Olga Brani
			padding-left: 50px;
84 bfdaac22 Athina Bekakou
			.col {
85 bfdaac22 Athina Bekakou
				float: left;
86 bfdaac22 Athina Bekakou
			}
87 bfdaac22 Athina Bekakou
			h4 {
88 bfdaac22 Athina Bekakou
				font-size: emCalc(14px);
89 bfdaac22 Athina Bekakou
				width: auto;
90 bfdaac22 Athina Bekakou
			}
91 bfdaac22 Athina Bekakou
			.basic-data {
92 97cd255d Olga Brani
				width: 180px;
93 97cd255d Olga Brani
				padding-right: 20px;
94 97cd255d Olga Brani
				.img-wrap {
95 97cd255d Olga Brani
					a {
96 97cd255d Olga Brani
						display: block;
97 97cd255d Olga Brani
					}
98 97cd255d Olga Brani
				}
99 97cd255d Olga Brani
				&:hover {
100 97cd255d Olga Brani
					a {
101 97cd255d Olga Brani
						color: $link-color-hover;
102 97cd255d Olga Brani
					}
103 97cd255d Olga Brani
				}
104 bfdaac22 Athina Bekakou
			}
105 bfdaac22 Athina Bekakou
			.size-data{
106 97cd255d Olga Brani
				width: 360px;
107 97cd255d Olga Brani
				padding-right: 20px;
108 bfdaac22 Athina Bekakou
				.progress-col {
109 97cd255d Olga Brani
					width: $progress-col-w;
110 bfdaac22 Athina Bekakou
					padding-top: 7px;
111 bfdaac22 Athina Bekakou
					.progress {
112 bfdaac22 Athina Bekakou
						border-color: $gray-2;
113 bfdaac22 Athina Bekakou
						height: 20px;
114 bfdaac22 Athina Bekakou
						.meter {
115 bfdaac22 Athina Bekakou
							text-align: right;
116 bfdaac22 Athina Bekakou
							font-size: 10px;
117 bfdaac22 Athina Bekakou
							padding: 2px;
118 bfdaac22 Athina Bekakou
							background-color: $gray-2;
119 bfdaac22 Athina Bekakou
							color: white;
120 bfdaac22 Athina Bekakou
							font-size: emCalc(14px);
121 bfdaac22 Athina Bekakou
							line-height: 100%;
122 3a0726aa Athina Bekakou
						}
123 3a0726aa Athina Bekakou
					}
124 3a0726aa Athina Bekakou
				}
125 bfdaac22 Athina Bekakou
				.size {
126 bfdaac22 Athina Bekakou
					width: auto;
127 fad1549a Olga Brani
					font-size: emCalc(14px);
128 fad1549a Olga Brani
				}
129 bfdaac22 Athina Bekakou
			}
130 bfdaac22 Athina Bekakou
			h5 {
131 bfdaac22 Athina Bekakou
				float: left;
132 97cd255d Olga Brani
				width: 220px;
133 bfdaac22 Athina Bekakou
				font-size: emCalc(14px);
134 bfdaac22 Athina Bekakou
				font-weight: normal;
135 bfdaac22 Athina Bekakou
				line-height: $list-icon-height;
136 bfdaac22 Athina Bekakou
				height: $list-icon-height;
137 bfdaac22 Athina Bekakou
				margin: 0;
138 97cd255d Olga Brani
				margin:0 20px 0 0 ;
139 4f3fc1ed Olga Brani
				overflow: hidden;
140 4f3fc1ed Olga Brani
				white-space: nowrap;
141 bfdaac22 Athina Bekakou
			}
142 bfdaac22 Athina Bekakou
			.project {
143 bfdaac22 Athina Bekakou
				line-height: $list-icon-height;
144 bfdaac22 Athina Bekakou
				height: $list-icon-height;
145 97cd255d Olga Brani
				width: 100px;
146 bfdaac22 Athina Bekakou
				font-size: emCalc(14px);
147 bfdaac22 Athina Bekakou
				position: relative;
148 bfdaac22 Athina Bekakou
				right: 0;
149 bfdaac22 Athina Bekakou
				ul {
150 bfdaac22 Athina Bekakou
					position: absolute;
151 fad1549a Olga Brani
					right: 0;
152 bfdaac22 Athina Bekakou
					top: $list-icon-height + 2px;
153 bfdaac22 Athina Bekakou
					list-style: none outside none;
154 bfdaac22 Athina Bekakou
					border: 1px solid $gray-2;
155 bfdaac22 Athina Bekakou
					padding: 5px 15px;
156 bfdaac22 Athina Bekakou
					display: none;
157 bfdaac22 Athina Bekakou
					z-index: 1;
158 bfdaac22 Athina Bekakou
					background: #fff;
159 97cd255d Olga Brani
					min-width: 100px + 240px;
160 bfdaac22 Athina Bekakou
					li {
161 4f3fc1ed Olga Brani
						padding: 6px 5px;
162 bfdaac22 Athina Bekakou
					}
163 bfdaac22 Athina Bekakou
				}
164 bfdaac22 Athina Bekakou
				.btn-more {
165 bfdaac22 Athina Bekakou
					border: 1px solid $gray-2;
166 d6d06450 Athina Bekakou
					position: relative;
167 d6d06450 Athina Bekakou
					min-width: $list-icon-height;
168 97cd255d Olga Brani
					padding: 0 10px;
169 bfdaac22 Athina Bekakou
					float: right;
170 bfdaac22 Athina Bekakou
					em {
171 914e6fb5 Athina Bekakou
						// display: none;
172 914e6fb5 Athina Bekakou
						// opacity: 0;
173 bfdaac22 Athina Bekakou
						font-style: normal;
174 bfdaac22 Athina Bekakou
						color: $body-font-color;
175 bfdaac22 Athina Bekakou
						@include transition(opacity, 300ms, linear);
176 d6d06450 Athina Bekakou
						margin-right: 7px;
177 bfdaac22 Athina Bekakou
					}
178 bfdaac22 Athina Bekakou
					&:hover {
179 bfdaac22 Athina Bekakou
						color: $link-color;
180 bfdaac22 Athina Bekakou
						em {
181 d6d06450 Athina Bekakou
							// display: inline-block;
182 d6d06450 Athina Bekakou
							// opacity: 1;
183 2eef02ae Athina Bekakou
						}
184 3a0726aa Athina Bekakou
					}
185 bfdaac22 Athina Bekakou
					&.clicked {
186 bfdaac22 Athina Bekakou
						background-color: $link-color;
187 bfdaac22 Athina Bekakou
						color: #fff;
188 d6d06450 Athina Bekakou
						.arrow-down:after {
189 d6d06450 Athina Bekakou
							border-color: white transparent transparent transparent;
190 d6d06450 Athina Bekakou
						}
191 fad1549a Olga Brani
						em {
192 fad1549a Olga Brani
							@include transition(opacity, 300ms, linear);
193 bfdaac22 Athina Bekakou
							display: inline-block;
194 bfdaac22 Athina Bekakou
							opacity: 1;
195 fad1549a Olga Brani
							color: #fff;
196 3a0726aa Athina Bekakou
						}
197 3a0726aa Athina Bekakou
					}
198 bfdaac22 Athina Bekakou
				}
199 d6d06450 Athina Bekakou
				.arrow-down:after {
200 d6d06450 Athina Bekakou
					content: "";
201 d6d06450 Athina Bekakou
					display: inline-block;
202 d6d06450 Athina Bekakou
					width: 0;
203 d6d06450 Athina Bekakou
					height: 0;
204 d6d06450 Athina Bekakou
					border: inset 5px;
205 d6d06450 Athina Bekakou
					border-color: black transparent transparent transparent;
206 d6d06450 Athina Bekakou
					border-top-style: solid;
207 d6d06450 Athina Bekakou
					position: relative;
208 d6d06450 Athina Bekakou
					top: 3px;
209 d6d06450 Athina Bekakou
				}
210 3a0726aa Athina Bekakou
211 bfdaac22 Athina Bekakou
			}
212 bd83612d Olga Brani
			&.folder {
213 bd83612d Olga Brani
				.img-wrap {
214 bd83612d Olga Brani
					background-position: left center;
215 bd83612d Olga Brani
					text-align: left;
216 bd83612d Olga Brani
					span {
217 bd83612d Olga Brani
						color: $gray-2;
218 bd83612d Olga Brani
						font-size: emCalc(16px);
219 bd83612d Olga Brani
						position: relative;
220 3fd0db82 Athina Bekakou
						top: 2px;
221 3fd0db82 Athina Bekakou
						left: 18px;
222 bd83612d Olga Brani
					}
223 3a0726aa Athina Bekakou
				}
224 3a0726aa Athina Bekakou
			}
225 3a0726aa Athina Bekakou
		}
226 3a0726aa Athina Bekakou
	}
227 c9d873e8 Olga Brani
}
228 292a32ef Olga Brani
.storage-progress{
229 0ef95fe4 Olga Brani
	.items-list {
230 71acaee4 Olga Brani
		margin-bottom: 0;
231 c9d873e8 Olga Brani
		li {
232 0ef95fe4 Olga Brani
			padding-left: $lt-bar-width + $check-w;
233 0ef95fe4 Olga Brani
			color: #fff;
234 0ef95fe4 Olga Brani
			.img-wrap {
235 0ef95fe4 Olga Brani
				top: 0;
236 0ef95fe4 Olga Brani
				height: $list-icon-height;
237 0ef95fe4 Olga Brani
				line-height: $list-icon-height;
238 c9d873e8 Olga Brani
			}
239 0ef95fe4 Olga Brani
			h4 {
240 0ef95fe4 Olga Brani
				width: $h4-w;
241 0ef95fe4 Olga Brani
				height: $list-icon-height;
242 0ef95fe4 Olga Brani
				line-height: $list-icon-height;
243 c9d873e8 Olga Brani
			}
244 0ef95fe4 Olga Brani
			.remove {
245 0ef95fe4 Olga Brani
				text-align: right;
246 0ef95fe4 Olga Brani
				font-weight: bold;
247 0ef95fe4 Olga Brani
				visibility: visible;
248 0ef95fe4 Olga Brani
				a {
249 0ef95fe4 Olga Brani
					color: #fff;
250 390a85eb Athina Bekakou
					&:hover {
251 d1366c8a Olga Brani
						color: $gray-0;
252 c9d873e8 Olga Brani
					}
253 c9d873e8 Olga Brani
				}
254 c9d873e8 Olga Brani
			}
255 0ef95fe4 Olga Brani
			.progress-col {
256 0ef95fe4 Olga Brani
				padding-top: 7px;
257 0ef95fe4 Olga Brani
			}
258 0ef95fe4 Olga Brani
			&:hover {
259 292a32ef Olga Brani
				background-color: transparent;
260 0ef95fe4 Olga Brani
			}
261 c9d873e8 Olga Brani
		}
262 c9d873e8 Olga Brani
	}
263 0ef95fe4 Olga Brani
	.progress {
264 0ef95fe4 Olga Brani
		height: 20px;
265 0ef95fe4 Olga Brani
		.meter {
266 0ef95fe4 Olga Brani
			background-color: #fff;
267 d6d06450 Athina Bekakou
			color: $turquoise-1;
268 0ef95fe4 Olga Brani
			text-align: right;
269 0ef95fe4 Olga Brani
			padding-right: 10px;
270 fad1549a Olga Brani
			line-height: 120%;
271 0ef95fe4 Olga Brani
		}
272 0ef95fe4 Olga Brani
	}
273 0ef95fe4 Olga Brani
	.details {
274 0ef95fe4 Olga Brani
		border: 0 none;
275 0ef95fe4 Olga Brani
	}
276 aafda5ef Athina Bekakou
}
277 aafda5ef Athina Bekakou
278 aafda5ef Athina Bekakou
.all-height {
279 3dc222e5 Olga Brani
	min-height: 100%
280 fad1549a Olga Brani
}