scrivito_resourcebrowser 0.0.1

Sign up to get free protection for your applications and to get access to all the features.
@@ -0,0 +1,1010 @@
1
+ /*
2
+ A resource browser modal window to add, edit, delete, select and search CMS resources. Each resource
3
+ type like Image or BlogPost has its own item representation and custom edit view. All styles are
4
+ bootstrap independent. You are free to customize the resource browser to your likings.
5
+ */
6
+
7
+ .editing-overlay {
8
+ background: rgba(0, 0, 0, 0.8);
9
+ opacity: 0;
10
+ filter: alpha(opacity=0);
11
+ -webkit-transition: opacity 0.5s linear;
12
+ -moz-transition: opacity 0.5s linear;
13
+ -o-transition: opacity 0.5s linear;
14
+ transition: opacity 0.5s linear;
15
+ position: fixed;
16
+ z-index: 222222;
17
+ }
18
+
19
+ .editing-overlay.show {
20
+ opacity: 0.85;
21
+ filter: alpha(opacity=85);
22
+ -webkit-transition: opacity 0.3s linear;
23
+ -moz-transition: opacity 0.3s linear;
24
+ -o-transition: opacity 0.3s linear;
25
+ transition: opacity 0.3s linear;
26
+ bottom: 0;
27
+ left: 0;
28
+ right: 0;
29
+ top: 0;
30
+ z-index: 222222;
31
+ }
32
+
33
+ .editing-resourcebrowser {
34
+ -webkit-border-radius: 5px;
35
+ -moz-border-radius: 5px;
36
+ border-radius: 5px;
37
+ -webkit-box-shadow: 0 5px 30px #000000;
38
+ -moz-box-shadow: 0 5px 30px #000000;
39
+ box-shadow: 0 5px 30px #000000;
40
+ opacity: 0;
41
+ filter: alpha(opacity=0);
42
+ -webkit-transition: opacity 0.5s linear;
43
+ -moz-transition: opacity 0.5s linear;
44
+ -o-transition: opacity 0.5s linear;
45
+ transition: opacity 0.5s linear;
46
+ background: #fff;
47
+ font-family: Arial, sans-serif;
48
+ height: 90%;
49
+ left: 50%;
50
+ margin: -250px 0 0 -40%;
51
+ overflow: hidden;
52
+ position: fixed;
53
+ top: 50%;
54
+ visibility: hidden;
55
+ width: 90%;
56
+ z-index: 3333333;
57
+ }
58
+
59
+ .editing-resourcebrowser.show {
60
+ opacity: 1;
61
+ filter: alpha(opacity=100);
62
+ -webkit-transition: opacity 0.3s linear;
63
+ -moz-transition: opacity 0.3s linear;
64
+ -o-transition: opacity 0.3s linear;
65
+ transition: opacity 0.3s linear;
66
+ top: 50%;
67
+ visibility: visible;
68
+ z-index: 3333333;
69
+ }
70
+
71
+ .editing-resourcebrowser .editing-resourcebrowser-footer .editing-button {
72
+ float: right;
73
+ margin: 0 10px 0 0;
74
+ }
75
+
76
+ .editing-resourcebrowser .editing-resourcebrowser-body {
77
+ -webkit-box-sizing: border-box;
78
+ -moz-box-sizing: border-box;
79
+ box-sizing: border-box;
80
+ background:#eee;
81
+ clear: both;
82
+ height: 100%;
83
+ margin: 0;
84
+ padding: 0 0 50px 0;
85
+ position: relative;
86
+ }
87
+
88
+ .editing-resourcebrowser .editing-resourcebrowser-wrapper {
89
+ -webkit-box-sizing: border-box;
90
+ -moz-box-sizing: border-box;
91
+ box-sizing: border-box;
92
+ float: left;
93
+ height: 100%;
94
+ padding-top: 50px;
95
+ position: relative;
96
+ width: 70%;
97
+ }
98
+
99
+ .editing-resourcebrowser .editing-resourcebrowser-topbar {
100
+ background: #666;
101
+ color:#fff;
102
+ -webkit-box-shadow: -3px 0 5px -3px #333 inset;
103
+ -moz-box-shadow: -3px 0 5px -3px #333 inset;
104
+ box-shadow: -3px 0 5px -3px #333 inset;
105
+ -webkit-box-sizing: border-box;
106
+ -moz-box-sizing: border-box;
107
+ box-sizing: border-box;
108
+ height: 50px;
109
+ left: 0;
110
+ padding: 11px 10px 9px 10px;
111
+ position: absolute;
112
+ top: 0;
113
+ width: 100%;
114
+ }
115
+
116
+ .editing-resourcebrowser .editing-resourcebrowser-search {
117
+ float: left;
118
+ position: relative;
119
+ width: 65%;
120
+ }
121
+
122
+ .editing-resourcebrowser .editing-resourcebrowser-search .search-field {
123
+ border:0px;
124
+ color:#333;
125
+ -webkit-border-radius: 15px 0 0 15px;
126
+ -moz-border-radius: 15px 0 0 15px;
127
+ border-radius: 15px 0 0 15px;
128
+ -webkit-box-shadow: 0 0 3px #ccc inset,0 0 8px rgba(109, 131, 166, .0);
129
+ -moz-box-shadow: 0 0 3px #ccc inset,0 0 8px rgba(109, 131, 166, .0);
130
+ box-shadow: 0 0 3px #ccc inset,0 0 8px rgba(109, 131, 166, .0);
131
+ -webkit-box-sizing: border-box;
132
+ -moz-box-sizing: border-box;
133
+ box-sizing: border-box;
134
+ -webkit-transition: border linear .5s, box-shadow linear .5s;
135
+ -moz-transition: border linear .5s, box-shadow linear .5s;
136
+ -o-transition: border linear .5s, box-shadow linear .5s;
137
+ transition: border linear .5s, box-shadow linear .5s;
138
+ display: block;
139
+ float: left;
140
+ font-size: 14px;
141
+ height: 30px;
142
+ line-height: 30px;
143
+ margin: 0;
144
+ padding: 4px 14px;
145
+ width: 300px;
146
+ }
147
+
148
+ .editing-resourcebrowser .editing-resourcebrowser-search .search-field:focus {
149
+ -webkit-box-shadow: 0 0 1px #aaa inset,0 0 8px rgba(109, 131, 166, .6);
150
+ -moz-box-shadow: 0 0 1px #aaa inset,0 0 8px rgba(109, 131, 166, .6);
151
+ box-shadow: 0 0 1px #aaa inset,0 0 8px rgba(109, 131, 166, .6);
152
+ -webkit-transition: box-shadow linear .5s;
153
+ -moz-transition: box-shadow linear .5s;
154
+ -o-transition: box-shadow linear .5s;
155
+ transition: box-shadow linear .5s;
156
+ outline: 0;
157
+ }
158
+
159
+ .editing-resourcebrowser .editing-resourcebrowser-search .search-field-button {
160
+ background: #7EA46A;
161
+ -webkit-border-radius: 0 15px 15px 0;
162
+ -moz-border-radius: 0 15px 15px 0;
163
+ border-radius: 0 15px 15px 0;
164
+ -webkit-box-sizing: border-box;
165
+ -moz-box-sizing: border-box;
166
+ box-sizing: border-box;
167
+ -webkit-user-select: none;
168
+ -moz-user-select: none;
169
+ -ms-user-select: none;
170
+ -o-user-select: none;
171
+ user-select: none;
172
+ border: 0px;
173
+ border-left: none;
174
+ color: #fff;
175
+ cursor: pointer;
176
+ display: block;
177
+ float: left;
178
+ font-size: 14px;
179
+ font-weight: normal;
180
+ height: 30px;
181
+ margin: 0;
182
+ padding: 0;
183
+ text-align: center;
184
+ width: 80px;
185
+ }
186
+
187
+ .editing-resourcebrowser .editing-resourcebrowser-search .search-field-button:hover {
188
+ background: #94BA80;
189
+ color: #fff;
190
+ cursor: pointer;
191
+ }
192
+
193
+ .editing-resourcebrowser .editing-resourcebrowser-search .search-field-button:active {
194
+ background: #7EA46A;
195
+ color: #fff;
196
+ cursor: pointer;
197
+ }
198
+
199
+ .editing-resourcebrowser .editing-resourcebrowser-topbar .editing-button-view {
200
+ display: block;
201
+ float: right;
202
+ height: 32px;
203
+ line-height: 32px;
204
+ padding: 0 7px;
205
+ }
206
+
207
+ .editing-resourcebrowser .editing-resourcebrowser-topbar .editing-button-view:hover {
208
+ cursor: pointer;
209
+ }
210
+
211
+ .editing-resourcebrowser .editing-resourcebrowser-topbar .editing-button-view .editing-icon {
212
+ -webkit-transition: all 0.3s ease-in-out;
213
+ -moz-transition: all 0.3s ease-in-out;
214
+ -o-transition: all 0.3s ease-in-out;
215
+ transition: all 0.3s ease-in-out;
216
+ color: #fff;
217
+ font-size: 9px;
218
+ line-height: 32px;
219
+ text-shadow: 0 0 2px #333;
220
+ }
221
+
222
+ .editing-resourcebrowser .editing-resourcebrowser-topbar .editing-button-view:hover .editing-icon,
223
+ .editing-resourcebrowser .editing-resourcebrowser-topbar .editing-button-view.active .editing-icon {
224
+ -webkit-transition: all 0.3s ease-in-out;
225
+ -moz-transition: all 0.3s ease-in-out;
226
+ -o-transition: all 0.3s ease-in-out;
227
+ transition: all 0.3s ease-in-out;
228
+ color: #7EA46A;
229
+ }
230
+
231
+ .editing-resourcebrowser .editing-resourcebrowser-filter,
232
+ .editing-resourcebrowser .editing-resourcebrowser-items,
233
+ .editing-resourcebrowser .editing-resourcebrowser-inspector {
234
+ -webkit-box-sizing: border-box;
235
+ -moz-box-sizing: border-box;
236
+ box-sizing: border-box;
237
+ background: #eee;
238
+ float: left;
239
+ height: 100%;
240
+ overflow: auto;
241
+ position: relative;
242
+ -webkit-overflow-scrolling: touch;
243
+ }
244
+
245
+ .editing-resourcebrowser .editing-resourcebrowser-filter {
246
+ background-color: #fafafa;
247
+ -webkit-box-shadow: 0 -3px 4px -3px #bbb inset,0 3px 4px -3px #bbb inset;
248
+ -moz-box-shadow: 0 -3px 4px -3px #bbb inset,0 3px 4px -3px #bbb inset;
249
+ box-shadow: 0 -3px 4px -3px #bbb inset,0 3px 4px -3px #bbb inset;
250
+ padding: 0;
251
+ width: 17%;
252
+ }
253
+
254
+ .editing-resourcebrowser .editing-resourcebrowser-items {
255
+ background: #CCCCCC;
256
+ -webkit-box-shadow: 0 0 4px #666 inset;
257
+ -moz-box-shadow: 0 0 4px #666 inset;
258
+ box-shadow: 0 0 4px #666 inset;
259
+ padding: 0;
260
+ width: 83%;
261
+ }
262
+
263
+ .editing-resourcebrowser .editing-resourcebrowser-inspector {
264
+ -webkit-box-shadow: 0 -3px 4px -3px #bbbbbb inset;
265
+ -moz-box-shadow: 0 -3px 4px -3px #bbbbbb inset;
266
+ box-shadow: 0 -3px 4px -3px #bbbbbb inset;
267
+ padding: 0 15px;
268
+ width: 30%;
269
+ }
270
+
271
+ .editing-resourcebrowser .editing-resourcebrowser-footer {
272
+ background: #eee;
273
+ -webkit-box-sizing: border-box;
274
+ -moz-box-sizing: border-box;
275
+ box-sizing: border-box;
276
+ *zoom: 1;
277
+ bottom: 0;
278
+ left: 0;
279
+ height: 50px;
280
+ margin: 0;
281
+ padding: 10px 0;
282
+ position: absolute;
283
+ text-align: right;
284
+ width: 100%;
285
+ }
286
+
287
+ .editing-resourcebrowser .editing-resourcebrowser-footer:before,
288
+ .editing-resourcebrowser .editing-resourcebrowser-footer:after {
289
+ display: table;
290
+ content: "";
291
+ line-height: 0;
292
+ }
293
+
294
+ .editing-resourcebrowser .editing-resourcebrowser-footer:after {
295
+ clear: both;
296
+ }
297
+
298
+ .editing-resourcebrowser ul.editing-resourcebrowser-filter-items {
299
+ display: block;
300
+ list-style-type: none;
301
+ margin: 0;
302
+ padding: 0;
303
+ }
304
+
305
+ .editing-resourcebrowser ul.editing-resourcebrowser-filter-items li {
306
+ *zoom: 1;
307
+ border-bottom: 1px solid #eee;
308
+ border-top: 1px solid #fff;
309
+ display: block;
310
+ margin: 0;
311
+ padding: 8px 5px 8px 8px;
312
+ }
313
+
314
+ .editing-resourcebrowser ul.editing-resourcebrowser-filter-items li:before,
315
+ .editing-resourcebrowser ul.editing-resourcebrowser-filter-items li:after {
316
+ display: table;
317
+ content: "";
318
+ line-height: 0;
319
+ }
320
+
321
+ .editing-resourcebrowser ul.editing-resourcebrowser-filter-items li:after {
322
+ clear: both;
323
+ }
324
+
325
+ .editing-resourcebrowser ul.editing-resourcebrowser-filter-items li:first-child {
326
+ border-top: 1px solid transparent;
327
+ }
328
+
329
+ .editing-resourcebrowser ul.editing-resourcebrowser-filter-items li:hover,
330
+ .editing-resourcebrowser ul.editing-resourcebrowser-filter-items li.active {
331
+ background: #7EA46A;
332
+ border-bottom: 1px solid #658B51;
333
+ border-top: 1px solid #658B51;
334
+ cursor: pointer;
335
+ position: relative;
336
+ z-index: 2;
337
+ }
338
+
339
+ .editing-resourcebrowser ul.editing-resourcebrowser-filter-items li:hover .editing-icon,
340
+ .editing-resourcebrowser ul.editing-resourcebrowser-filter-items li.active .editing-icon,
341
+ .editing-resourcebrowser ul.editing-resourcebrowser-filter-items li:hover .editing-resourcebrowser-filter-name,
342
+ .editing-resourcebrowser ul.editing-resourcebrowser-filter-items li.active .editing-resourcebrowser-filter-name {
343
+ color: #fff;
344
+ text-shadow: 0 1px 1px #888;
345
+ }
346
+
347
+ .editing-resourcebrowser ul.editing-resourcebrowser-filter-items li.separator {
348
+ background-color: #f8f8f8;
349
+ background-image: -moz-linear-gradient(top, #ffffff, #eeeeee);
350
+ background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), to(#eeeeee));
351
+ background-image: -webkit-linear-gradient(top, #ffffff, #eeeeee);
352
+ background-image: -o-linear-gradient(top, #ffffff, #eeeeee);
353
+ background-image: linear-gradient(to bottom, #ffffff, #eeeeee);
354
+ background-repeat: repeat-x;
355
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#ffeeeeee', GradientType=0);
356
+ -webkit-box-shadow: 0 0 1px #aaaaaa;
357
+ -moz-box-shadow: 0 0 1px #aaaaaa;
358
+ box-shadow: 0 0 1px #aaaaaa;
359
+ border: none;
360
+ height: 4px;
361
+ padding: 0;
362
+ position: relative;
363
+ z-index: 2;
364
+ }
365
+
366
+ .editing-resourcebrowser ul.editing-resourcebrowser-filter-items li.selected-items {
367
+ -webkit-box-shadow: 0 0 3px #cccccc inset;
368
+ -moz-box-shadow: 0 0 3px #cccccc inset;
369
+ box-shadow: 0 0 3px #cccccc inset;
370
+ background: #eee;
371
+ }
372
+
373
+ .editing-resourcebrowser ul.editing-resourcebrowser-filter-items li.selected-items:hover,
374
+ .editing-resourcebrowser ul.editing-resourcebrowser-filter-items li.selected-items.active {
375
+ -webkit-box-shadow: 0 0 3px #333333 inset;
376
+ -moz-box-shadow: 0 0 3px #333333 inset;
377
+ box-shadow: 0 0 3px #333333 inset;
378
+ background: #5A8BD1;
379
+ }
380
+
381
+ .editing-resourcebrowser .editing-resourcebrowser-counter {
382
+ -webkit-border-radius: 15px;
383
+ -moz-border-radius: 15px;
384
+ border-radius: 15px;
385
+ background: #444;
386
+ color: #fff;
387
+ display: inline-block;
388
+ font-size: 10px;
389
+ font-weight: bold;
390
+ line-height: 11px;
391
+ margin: 1px -5px 0 7px;
392
+ padding: 1px 6px;
393
+ }
394
+
395
+ .editing-resourcebrowser ul.editing-resourcebrowser-filter-items .editing-icon {
396
+ color: #666;
397
+ display: inline-block;
398
+ font-size: 12px;
399
+ line-height: 20px;
400
+ padding: 0 7px 0 0;
401
+ text-shadow: 0 1px 1px #fff;
402
+ }
403
+
404
+ .editing-resourcebrowser ul.editing-resourcebrowser-filter-items .editing-resourcebrowser-filter-name {
405
+ color: #666;
406
+ display: inline-block;
407
+ font-size: 11px;
408
+ font-weight: bold;
409
+ line-height: 20px;
410
+ }
411
+
412
+ .editing-resourcebrowser ul.editing-resourcebrowser-filter-items li:hover .editing-resourcebrowser-counter,
413
+ .editing-resourcebrowser ul.editing-resourcebrowser-filter-items li.active .editing-resourcebrowser-counter {
414
+ background: #fff;
415
+ color: #5a8bd1;
416
+ text-shadow: 0 0 0 #fff;
417
+ }
418
+
419
+ .editing-resourcebrowser .editing-resourcebrowser-items.uploader-drag-over {
420
+ background: #658b51;
421
+ -webkit-box-shadow: 0 0 4px #333333 inset;
422
+ -moz-box-shadow: 0 0 4px #333333 inset;
423
+ box-shadow: 0 0 4px #333333 inset;
424
+ }
425
+
426
+ .editing-resourcebrowser .editing-resourcebrowser-items.uploader-drag-over:before {
427
+ -webkit-user-select: none;
428
+ -moz-user-select: none;
429
+ -ms-user-select: none;
430
+ -o-user-select: none;
431
+ user-select: none;
432
+ color: #fff;
433
+ content: '\F044';
434
+ display: block;
435
+ text-align: center;
436
+ font-family: 'editing_iconsregular';
437
+ font-size: 83px;
438
+ font-style: normal;
439
+ font-weight: normal;
440
+ position: absolute;
441
+ top: 50%;
442
+ vertical-align: middle;
443
+ width: 83%;
444
+ }
445
+
446
+ .editing-resourcebrowser .editing-resourcebrowser-items.uploader-drag-over ul.editing-resourcebrowser-thumbnails {
447
+ opacity: 0.3;
448
+ filter: alpha(opacity=30);
449
+ }
450
+
451
+ .editing-resourcebrowser ul.editing-resourcebrowser-thumbnails {
452
+ display: block;
453
+ list-style-type: none;
454
+ margin: 0;
455
+ overflow: hidden;
456
+ padding: 15px 0 0 15px;
457
+ }
458
+
459
+ .editing-resourcebrowser ul.editing-resourcebrowser-thumbnails li {
460
+ -webkit-border-radius: 4px;
461
+ -moz-border-radius: 4px;
462
+ border-radius: 4px;
463
+ -webkit-box-shadow: 0 0 4px #888888;
464
+ -moz-box-shadow: 0 0 4px #888888;
465
+ box-shadow: 0 0 4px #888888;
466
+ -webkit-transition: all 0.3s ease-in-out;
467
+ -moz-transition: all 0.3s ease-in-out;
468
+ -o-transition: all 0.3s ease-in-out;
469
+ transition: all 0.3s ease-in-out;
470
+ background: #fff;
471
+ display: block;
472
+ float: left;
473
+ height: 200px;
474
+ line-height: normal;
475
+ margin: 0 15px 15px 0;
476
+ overflow: hidden;
477
+ padding: 0;
478
+ width: 200px;
479
+ }
480
+
481
+ .editing-resourcebrowser ul.editing-resourcebrowser-thumbnails li:hover {
482
+ -webkit-box-shadow: 0 0 7px 0px #555555;
483
+ -moz-box-shadow: 0 0 7px 0px #555555;
484
+ box-shadow: 0 0 7px 0px #555555;
485
+ -webkit-transition: all 0.3s ease-in-out;
486
+ -moz-transition: all 0.3s ease-in-out;
487
+ -o-transition: all 0.3s ease-in-out;
488
+ transition: all 0.3s ease-in-out;
489
+ cursor: pointer;
490
+ }
491
+
492
+ .editing-resourcebrowser ul.editing-resourcebrowser-thumbnails li.active {
493
+ -webkit-box-shadow: 0 0 3px 4px #658B51;
494
+ -moz-box-shadow: 0 0 3px 4px #658B51;
495
+ box-shadow: 0 0 3px 4px #658B51;
496
+ }
497
+
498
+ .editing-resourcebrowser ul.editing-resourcebrowser-thumbnails li .editing-resourcebrowser-preview {
499
+ background: #eee;
500
+ height: 160px;
501
+ overflow: hidden;
502
+ position: relative;
503
+ }
504
+
505
+ .editing-resourcebrowser ul.editing-resourcebrowser-thumbnails li .editing-resourcebrowser-preview img {
506
+ display: block;
507
+ height: 100%;
508
+ margin: 0 auto;
509
+ }
510
+
511
+ .editing-resourcebrowser ul.editing-resourcebrowser-thumbnails li .editing-resourcebrowser-preview .editing-icon {
512
+ color: #bfbfbf;
513
+ display: block;
514
+ float: none;
515
+ font-size: 50px;
516
+ line-height: 160px;
517
+ text-align: center;
518
+ text-shadow: 0 1px 1px #fff;
519
+ }
520
+
521
+ .editing-resourcebrowser ul.editing-resourcebrowser-thumbnails li .editing-resourcebrowser-meta {
522
+ -webkit-box-sizing: border-box;
523
+ -moz-box-sizing: border-box;
524
+ box-sizing: border-box;
525
+ height: 40px;
526
+ padding: 5px 35px 5px 5px;
527
+ position: relative;
528
+ }
529
+
530
+ .editing-resourcebrowser ul.editing-resourcebrowser-thumbnails li .editing-resourcebrowser-thumbnails-name {
531
+ color: #555;
532
+ display: block;
533
+ font-size: 11px;
534
+ font-weight: bold;
535
+ line-height: 30px;
536
+ overflow: hidden;
537
+ text-overflow: ellipsis;
538
+ white-space: nowrap;
539
+ }
540
+
541
+ .editing-resourcebrowser ul.editing-resourcebrowser-thumbnails li .editing-resourcebrowser-thumbnails-size {
542
+ color: #aaa;
543
+ display: block;
544
+ font-size: 10px;
545
+ font-weight: bold;
546
+ line-height: 15px;
547
+ overflow: hidden;
548
+ text-overflow: ellipsis;
549
+ white-space: nowrap;
550
+ }
551
+
552
+ .editing-resourcebrowser ul.editing-resourcebrowser-thumbnails li .editing-resourcebrowser-inspect:before {
553
+ -webkit-user-select: none;
554
+ -moz-user-select: none;
555
+ -ms-user-select: none;
556
+ -o-user-select: none;
557
+ user-select: none;
558
+ background: #7EA46A;
559
+ top: 0;
560
+ color: #fff;
561
+ content: '\F043';
562
+ display: block;
563
+ font-family: 'editing_iconsregular';
564
+ font-style: normal;
565
+ font-weight: normal;
566
+ height: 40px;
567
+ line-height: 42px;
568
+ margin: 0;
569
+ padding: 0;
570
+ position: absolute;
571
+ right: 0;
572
+ text-align: center;
573
+ text-decoration: none;
574
+ vertical-align: middle;
575
+ width: 40px;
576
+ font-size: 11px;
577
+ }
578
+
579
+ .editing-resourcebrowser ul.editing-resourcebrowser-thumbnails li .editing-resourcebrowser-thumbnails-select:before {
580
+ -webkit-user-select: none;
581
+ -moz-user-select: none;
582
+ -ms-user-select: none;
583
+ -o-user-select: none;
584
+ user-select: none;
585
+ background: #fff;
586
+ bottom: 0;
587
+ color: #ddd;
588
+ content: '\F02A';
589
+ display: block;
590
+ font-family: 'editing_iconsregular';
591
+ font-style: normal;
592
+ font-weight: normal;
593
+ height: 40px;
594
+ line-height: 42px;
595
+ margin: 0;
596
+ padding: 0;
597
+ position: absolute;
598
+ right: 0;
599
+ text-align: center;
600
+ text-decoration: none;
601
+ vertical-align: middle;
602
+ width: 40px;
603
+ font-size: 11px;
604
+ }
605
+
606
+ .editing-resourcebrowser ul.editing-resourcebrowser-thumbnails li .editing-resourcebrowser-thumbnails-select.active:before {
607
+ background: #7EA46A;
608
+ color: #fff;
609
+ content: '\F02B';
610
+ }
611
+
612
+ .editing-resourcebrowser ul.editing-resourcebrowser-thumbnails.small li {
613
+ height: 100px;
614
+ width: 130px;
615
+ }
616
+
617
+ .editing-resourcebrowser ul.editing-resourcebrowser-thumbnails.small li .editing-resourcebrowser-preview {
618
+ height: 70px;
619
+ }
620
+
621
+ .editing-resourcebrowser ul.editing-resourcebrowser-thumbnails.small li .editing-resourcebrowser-preview .editing-icon {
622
+ font-size: 20px;
623
+ line-height: 70px;
624
+ }
625
+
626
+ .editing-resourcebrowser ul.editing-resourcebrowser-thumbnails.small li .editing-resourcebrowser-meta {
627
+ height: 30px;
628
+ padding: 2px 25px 0px 5px;
629
+ }
630
+
631
+ .editing-resourcebrowser ul.editing-resourcebrowser-thumbnails.small li .editing-resourcebrowser-thumbnails-name {
632
+ font-size: 10px;
633
+ line-height: 28px;
634
+ }
635
+
636
+ .editing-resourcebrowser ul.editing-resourcebrowser-thumbnails.small li .editing-resourcebrowser-thumbnails-size {
637
+ font-size: 9px;
638
+ line-height: 13px;
639
+ }
640
+
641
+ .editing-resourcebrowser ul.editing-resourcebrowser-thumbnails.small li .editing-resourcebrowser-thumbnails-select:before {
642
+ font-size: 9px;
643
+ height: 30px;
644
+ line-height: 32px;
645
+ width: 30px;
646
+ }
647
+
648
+ .editing-resourcebrowser ul.editing-resourcebrowser-thumbnails.big li {
649
+ height: 300px;
650
+ width: 300px;
651
+ }
652
+
653
+ .editing-resourcebrowser ul.editing-resourcebrowser-thumbnails.big li .editing-resourcebrowser-preview {
654
+ height: 260px;
655
+ }
656
+
657
+ .editing-resourcebrowser ul.editing-resourcebrowser-thumbnails.big li .editing-resourcebrowser-preview .editing-icon {
658
+ font-size: 60px;
659
+ line-height: 260px;
660
+ }
661
+
662
+ .editing-resourcebrowser ul.editing-resourcebrowser-thumbnails.large li {
663
+ height: 400px;
664
+ width: 400px;
665
+ }
666
+
667
+ .editing-resourcebrowser ul.editing-resourcebrowser-thumbnails.large li .editing-resourcebrowser-preview {
668
+ height: 360px;
669
+ }
670
+
671
+ .editing-resourcebrowser ul.editing-resourcebrowser-thumbnails.large li .editing-resourcebrowser-preview .editing-icon {
672
+ line-height: 360px;
673
+ font-size: 70px;
674
+ }
675
+
676
+ .editing-resourcebrowser .editing-resourcebrowser-inspector h3 {
677
+ color: #666;
678
+ font-size: 14px;
679
+ line-height: 32px;
680
+ }
681
+
682
+ .editing-resourcebrowser .editing-resourcebrowser-inspector h3 .editing-icon {
683
+ color: #666;
684
+ font-size: 12px;
685
+ line-height: 32px;
686
+ padding: 0 5px 0;
687
+ }
688
+
689
+ .editing-resourcebrowser .editing-resourcebrowser-inspector h3 .editing-button {
690
+ background-color: #f8f8f8;
691
+ background-image: -moz-linear-gradient(top, #ffffff, #eeeeee);
692
+ background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), to(#eeeeee));
693
+ background-image: -webkit-linear-gradient(top, #ffffff, #eeeeee);
694
+ background-image: -o-linear-gradient(top, #ffffff, #eeeeee);
695
+ background-image: linear-gradient(to bottom, #ffffff, #eeeeee);
696
+ background-repeat: repeat-x;
697
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#ffeeeeee', GradientType=0);
698
+ -webkit-border-radius: 5px;
699
+ -moz-border-radius: 5px;
700
+ border-radius: 5px;
701
+ -webkit-box-shadow: 0 0 3px #ffffff;
702
+ -moz-box-shadow: 0 0 3px #ffffff;
703
+ box-shadow: 0 0 3px #ffffff;
704
+ -webkit-user-select: none;
705
+ -moz-user-select: none;
706
+ -ms-user-select: none;
707
+ -o-user-select: none;
708
+ user-select: none;
709
+ border: 1px solid #e3e3e3;
710
+ color: #333;
711
+ cursor: pointer;
712
+ display: block;
713
+ float: left;
714
+ font-family: Helvetica, Arial, sans-serif;
715
+ font-size: 13px;
716
+ font-weight: bold;
717
+ line-height: 14px;
718
+ margin: 3px 10px 0 0;
719
+ min-width: 25px;
720
+ min-height: 14px;
721
+ padding: 2px 5px;
722
+ text-align: center;
723
+ text-shadow: 0 1px 0 #fff;
724
+ vertical-align: middle;
725
+ }
726
+
727
+ .editing-resourcebrowser .editing-resourcebrowser-inspector h3 .editing-button:hover {
728
+ background-color: #fbfbfb;
729
+ background-image: -moz-linear-gradient(top, #ffffff, #f6f6f6);
730
+ background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), to(#f6f6f6));
731
+ background-image: -webkit-linear-gradient(top, #ffffff, #f6f6f6);
732
+ background-image: -o-linear-gradient(top, #ffffff, #f6f6f6);
733
+ background-image: linear-gradient(to bottom, #ffffff, #f6f6f6);
734
+ background-repeat: repeat-x;
735
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#fff6f6f6', GradientType=0);
736
+ border: 1px solid #ccc;
737
+ color: #333;
738
+ cursor: pointer;
739
+ }
740
+
741
+ .editing-resourcebrowser .editing-resourcebrowser-inspector h3 .editing-button:active {
742
+ background-color: #e0e0e0;
743
+ background-image: -moz-linear-gradient(top, #eeeeee, #cccccc);
744
+ background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#eeeeee), to(#cccccc));
745
+ background-image: -webkit-linear-gradient(top, #eeeeee, #cccccc);
746
+ background-image: -o-linear-gradient(top, #eeeeee, #cccccc);
747
+ background-image: linear-gradient(to bottom, #eeeeee, #cccccc);
748
+ background-repeat: repeat-x;
749
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffeeeeee', endColorstr='#ffcccccc', GradientType=0);
750
+ border: 1px solid #bbb;
751
+ color: #333;
752
+ cursor: pointer;
753
+ }
754
+
755
+ .editing-resourcebrowser .editing-resourcebrowser-inspector h3 .editing-button .editing-icon {
756
+ color: #888;
757
+ font-size: 8px;
758
+ line-height: 20px;
759
+ margin: 0;
760
+ padding: 0;
761
+ }
762
+
763
+ .no-editing-available {
764
+ color: #d3d3d3;
765
+ font-size: 15px;
766
+ font-weight: bold;
767
+ text-align: center;
768
+ }
769
+
770
+ .no-editing-available .editing-icon {
771
+ color: #e3e3e3;
772
+ display: block;
773
+ font-size: 85px;
774
+ line-height: 200px;
775
+ text-align: center;
776
+ text-shadow: 0 1px 0 #ddd;
777
+ }
778
+
779
+ .editing-resourcebrowser-loading {
780
+ clear: both;
781
+ height: 100%;
782
+ overflow: hidden;
783
+ position: relative;
784
+ }
785
+
786
+ .editing-resourcebrowser-loading .editing-icon {
787
+ color: #666;
788
+ display: block;
789
+ font-size: 25px;
790
+ left: 0;
791
+ margin: 0 auto;
792
+ position: absolute;
793
+ text-align: center;
794
+ top: 46%;
795
+ width: 100%;
796
+ -webkit-animation: editing-rotation 5s infinite linear;
797
+ -moz-animation: editing-rotation 5s infinite linear;
798
+ -o-animation: editing-rotation 5s infinite linear;
799
+ animation: editing-rotation 5s infinite linear;
800
+ }
801
+
802
+ .editing-resourcebrowser ul.editing-resourcebrowser-thumbnails .editing-resourcebrowser-loading .editing-icon {
803
+ color: #ddd;
804
+ font-size: 25px;
805
+ top: 38%;
806
+ }
807
+
808
+ .editing-resourcebrowser ul.editing-resourcebrowser-thumbnails.small .editing-resourcebrowser-loading .editing-icon {
809
+ font-size: 15px;
810
+ top: 35%;
811
+ }
812
+
813
+ .editing-resourcebrowser ul.editing-resourcebrowser-thumbnails.big .editing-resourcebrowser-loading .editing-icon {
814
+ font-size: 40px;
815
+ }
816
+
817
+ .editing-resourcebrowser ul.editing-resourcebrowser-thumbnails.large .editing-resourcebrowser-loading .editing-icon {
818
+ font-size: 50px;
819
+ }
820
+
821
+ .editing-resourcebrowser-progress-wrapper {
822
+ -webkit-box-shadow: 0 0 3px #bbbbbb;
823
+ -moz-box-shadow: 0 0 3px #bbbbbb;
824
+ box-shadow: 0 0 3px #bbbbbb;
825
+ background: rgba(255, 255, 255, 0.6);
826
+ border-radius: 3px;
827
+ left: 0;
828
+ margin: 2% 10%;
829
+ padding: 0;
830
+ position: absolute;
831
+ top: 0;
832
+ width: 80%;
833
+ }
834
+
835
+ .editing-resourcebrowser-progress-wrapper .editing-resourcebrowser-progress-file {
836
+ border-top: 1px solid #ccc;
837
+ margin: 2px 0 0 0;
838
+ padding: 5px;
839
+ }
840
+
841
+ .editing-resourcebrowser-progress-wrapper .editing-resourcebrowser-progress-file:first-child {
842
+ border: none;
843
+ margin: 0;
844
+ }
845
+
846
+ .editing-resourcebrowser-progress-wrapper .editing-resourcebrowser-progress-file p {
847
+ color: #555;
848
+ font-size: 13px;
849
+ font-weight: bold;
850
+ margin: 0 3px 6px 3px;
851
+ overflow: hidden;
852
+ text-overflow: ellipsis;
853
+ }
854
+
855
+ .editing-resourcebrowser-progress-wrapper .editing-resourcebrowser-progress {
856
+ -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
857
+ -moz-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
858
+ box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
859
+ background-color: #bbb;
860
+ border-radius: 3px;
861
+ height: 10px;
862
+ margin: 0;
863
+ overflow: hidden;
864
+ }
865
+
866
+ .editing-resourcebrowser-progress-wrapper .editing-resourcebrowser-progress .editing-resourcebrowser-progress-bar {
867
+ background-color: #658b51;
868
+ background-image: -webkit-gradient(linear, 0 100%, 100% 0, color-stop(0.25, rgba(255, 255, 255, 0.7)), color-stop(0.25, transparent), color-stop(0.5, transparent), color-stop(0.5, rgba(255, 255, 255, 0.7)), color-stop(0.75, rgba(255, 255, 255, 0.7)), color-stop(0.75, transparent), to(transparent));
869
+ background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.7) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.7) 50%, rgba(255, 255, 255, 0.7) 75%, transparent 75%, transparent);
870
+ background-image: -moz-linear-gradient(45deg, rgba(255, 255, 255, 0.7) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.7) 50%, rgba(255, 255, 255, 0.7) 75%, transparent 75%, transparent);
871
+ background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.7) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.7) 50%, rgba(255, 255, 255, 0.5) 75%, transparent 75%, transparent);
872
+ background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.7) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.7) 50%, rgba(255, 255, 255, 0.7) 75%, transparent 75%, transparent);
873
+ -webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
874
+ -moz-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
875
+ box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
876
+ -webkit-transition: width 0.6s ease;
877
+ -moz-transition: width 0.6s ease;
878
+ -o-transition: width 0.6s ease;
879
+ transition: width 0.6s ease;
880
+ background-color: #658b51;
881
+ background-size: 15px 15px;
882
+ float: left;
883
+ font-size: 12px;
884
+ height: 100%;
885
+ line-height: 10px;
886
+ text-align: center;
887
+ width: 0%;
888
+ -webkit-animation: progress-bar-stripes 3s linear infinite;
889
+ -moz-animation: progress-bar-stripes 3s linear infinite;
890
+ -ms-animation: progress-bar-stripes 3s linear infinite;
891
+ -o-animation: progress-bar-stripes 3s linear infinite;
892
+ animation: progress-bar-stripes 3s linear infinite;
893
+ }
894
+
895
+ /*
896
+ Styles for an animated loading spinner.
897
+ */
898
+
899
+ @-webkit-keyframes editing-rotation {
900
+ 0% {
901
+ -webkit-transform: rotate(0deg);
902
+ }
903
+
904
+ 100% {
905
+ -webkit-transform: rotate(359deg);
906
+ }
907
+ }
908
+
909
+ @-moz-keyframes editing-rotation {
910
+ from {
911
+ -moz-transform: rotate(0deg);
912
+ }
913
+
914
+ to {
915
+ -moz-transform: rotate(359deg);
916
+ }
917
+ }
918
+
919
+ @-o-keyframes editing-rotation {
920
+ from {
921
+ -o-transform: rotate(0deg);
922
+ }
923
+
924
+ to {
925
+ -o-transform: rotate(359deg);
926
+ }
927
+ }
928
+
929
+ @keyframes editing-rotation {
930
+ 0% {
931
+ transform: rotate(0deg);
932
+ }
933
+
934
+ 100% {
935
+ transform: rotate(359deg);
936
+ }
937
+ }
938
+
939
+ /*
940
+ Styles for an animated progress bar
941
+ */
942
+
943
+ @-webkit-keyframes progress-bar-stripes {
944
+ from {
945
+ background-position: 40px 0;
946
+ }
947
+
948
+ to {
949
+ background-position: 0 0;
950
+ }
951
+ }
952
+
953
+ @-moz-keyframes progress-bar-stripes {
954
+ from {
955
+ background-position: 40px 0;
956
+ }
957
+
958
+ to {
959
+ background-position: 0 0;
960
+ }
961
+ }
962
+
963
+ @-ms-keyframes progress-bar-stripes {
964
+ from {
965
+ background-position: 40px 0;
966
+ }
967
+
968
+ to {
969
+ background-position: 0 0;
970
+ }
971
+ }
972
+
973
+ @-o-keyframes progress-bar-stripes {
974
+ from {
975
+ background-position: 0 0;
976
+ }
977
+
978
+ to {
979
+ background-position: 40px 0;
980
+ }
981
+ }
982
+
983
+ @keyframes progress-bar-stripes {
984
+ from {
985
+ background-position: 40px 0;
986
+ }
987
+
988
+ to {
989
+ background-position: 0 0;
990
+ }
991
+ }
992
+
993
+
994
+ @resource (min-width: 769px) and (max-width: 979px) {
995
+ .editing-resourcebrowser {
996
+ height: 90%;
997
+ width: 90%;
998
+ }
999
+ }
1000
+
1001
+ @resource (max-width: 768px) {
1002
+
1003
+ }
1004
+
1005
+ @resource (max-width: 480px) {
1006
+ .editing-resourcebrowser {
1007
+ height: 95%;
1008
+ width: 95%;
1009
+ }
1010
+ }