Updated copyright
[pithos-web-client] / src / gr / grnet / pithos / web / public / pithos.css
1 /*
2  * Copyright 2011-2012 GRNET S.A. All rights reserved.
3  *
4  * Redistribution and use in source and binary forms, with or
5  * without modification, are permitted provided that the following
6  * conditions are met:
7  *
8  *   1. Redistributions of source code must retain the above
9  *      copyright notice, this list of conditions and the following
10  *      disclaimer.
11  *
12  *   2. Redistributions in binary form must reproduce the above
13  *      copyright notice, this list of conditions and the following
14  *      disclaimer in the documentation and/or other materials
15  *      provided with the distribution.
16  *
17  * THIS SOFTWARE IS PROVIDED BY GRNET S.A. ``AS IS'' AND ANY EXPRESS
18  * OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED
19  * WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR
20  * PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL GRNET S.A OR
21  * CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
22  * SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
23  * LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF
24  * USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED
25  * AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT
26  * LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN
27  * ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE
28  * POSSIBILITY OF SUCH DAMAGE.
29  *
30  * The views and conclusions contained in the software and
31  * documentation are those of the authors and should not be
32  * interpreted as representing official policies, either expressed
33  * or implied, of GRNET S.A.
34  */
35 body {
36         color: black;
37         font: 13px Verdana, 'PT Sans', sans-serif;
38         margin: 8px;
39         margin-top: 3px;
40         background-color: transparent;
41 }
42
43 table td {
44         font: 13px Verdana, 'PT Sans', sans-serif;
45 }
46
47 .pithos-outer {
48         background: url(images/background.png) repeat-x;
49 }
50
51 a {
52         color: white;
53         text-decoration: none;
54 }
55
56 a:hover {
57         color: white;
58 }
59
60 a:visited {
61         color: white;
62 }
63
64 a.info {
65         position: relative; /*this is the key*/
66         z-index: 24;
67         color: black;
68         text-decoration: none
69 }
70
71 a.info:hover {
72         z-index: 25;
73         background-color: yellow;
74 }
75
76 a.info div {
77         display: none
78 }
79
80 a.info:hover span {
81         cursor: pointer;
82 }
83
84 /* The span will only display on :hover state. */
85 a.info:hover div {
86         display: block;
87         position: absolute;
88         bottom: 2em;
89         right: 1em;
90         width: 10em;
91         border: 1px solid lightblue;
92         background-color: #D0E4F6;
93         color: black;
94         text-align: center
95 }
96
97 .pithos-DialogBox .inner form {
98         margin: 0px;
99         clip: 
100 }
101
102 .pithos-dialogbox .inner form input,
103 .pithos-dialogbox .inner form textarea
104 {
105     border: 1px solid #aaa;
106     padding:4px;
107 }
108
109 .pithos-DialogBox .button {
110         background: none;
111         background-color: #4085A5;
112         color: white;
113         padding: 5px 6px;
114         white-space: nowrap;
115 }
116
117 .pithos-DialogBox .Caption {
118         color: white;
119         background-color: #4085a5;
120         padding: 20px;
121         border-bottom: 1px solid white;
122 }
123
124 .pithos-DialogBox .close {
125         background: url(images/close-popup.png) no-repeat;
126         cursor: pointer;
127         position: absolute;
128         width: 13px;
129         height: 13px;
130         top: 12px;
131         right: 7px;
132 }
133
134 .pithos-DialogBox .dialogMiddleCenter {
135         background: url(images/popup-bg.png) repeat-x;
136         background-color: white;
137         padding: 3px;
138 }
139
140 .pithos-DialogBox .dialogBottomCenter {
141         border-bottom: 5px solid #4085A5;
142 }
143
144 .gwt-DecoratedTabBar .gwt-TabBarItem-selected .tabTopLeft {
145   background-position: 0px -55px;
146 }
147 .gwt-DecoratedTabBar .gwt-TabBarItem-selected .tabTopRight {
148   background-position: -6px -55px;
149 }
150 .gwt-DecoratedTabBar .gwt-TabBarItem-selected .tabTopCenter {
151         background: #D0E4F6;
152 }
153 .gwt-DecoratedTabBar .gwt-TabBarItem-selected .tabMiddleLeft,
154 .gwt-DecoratedTabBar .gwt-TabBarItem-selected .tabMiddleCenter,
155 .gwt-DecoratedTabBar .gwt-TabBarItem-selected .tabMiddleRight {
156         background: #D0E4F6;
157         color:#d45500;
158 }
159 .pithos-TabPanelBottom {
160         border: none;
161 }
162
163 table.pithos-permList {
164         border-spacing: 3px;
165         border-collapse: collapse;
166
167 }
168
169 table.pithos-permList td {
170         padding: 5px 5px 5px 5px;
171         font-size:80%;
172 }
173
174 table.pithos-permList.props-labels {
175         font-weight: bold;
176 }
177
178 .props-labels {
179         font-size: 80%;
180         font-weight: bold;
181 }
182
183 .props-toplabels {
184         font-size: 80%;
185         font-weight: bold;
186         font-style: italic;
187 }
188
189 .props-values {
190         font-size: 80%;
191 }
192
193 .hidden-link {
194         text-decoration: none !important;
195         color: black !important;
196 }
197
198 .hidden-link:visited {
199         text-decoration: none !important;
200         color: black !important;
201 }
202
203 .pithos-topPanel {
204         background-color: #4085a5;
205         font-size: 75%;
206         height: 59px;
207         border-bottom: 1px solid white;
208 }
209
210 .pithos-usernameMenu {
211     cursor: pointer;
212 }
213
214 .pithos-usernameMenuItem {
215         background: url(images/down-arrow-light.png) no-repeat scroll right 8px transparent;
216         padding-right: 13px;
217         cursor: pointer;
218     color: white;
219 }
220
221 .pithos-usernameMenuItem:HOVER {
222         background: url(images/down-arrow-lighter.png) no-repeat scroll right 8px transparent;
223         background-color: #599EBD;
224 }
225
226 .pithos-usernameMenuItem:ACTIVE {
227         background: url(images/down-arrow-lighter.png) no-repeat scroll right 8px transparent;
228         background-color: #BED5E0;
229 }
230
231 .pithos-langMenuItem {
232         cursor: pointer;
233     color: #72ADC8;
234 }
235
236 .gwt-MenuBar-vertical {
237         background: #D0E3ED;
238 }
239
240 .gwt-MenuBarPopup .menuPopupTopLeft {
241         background: none;
242         background-color: #D0E3ED;
243 }
244
245 .gwt-MenuBarPopup .menuPopupTopCenter {
246         background: none;
247         background-color: #D0E3ED;
248 }
249
250 .gwt-MenuBarPopup .menuPopupTopRight {
251         background: none;
252         background-color: #D0E3ED;
253 }
254
255 .gwt-MenuBarPopup .menuPopupMiddleLeft {
256         background: none;
257         background-color: #D0E3ED;
258 }
259
260 .gwt-MenuBarPopup .menuPopupMiddleRight {
261         background: none;
262         background-color: #D0E3ED;
263 }
264
265 .pithos-userItemMenu {
266         background-color: #D0E3ED;
267 }
268
269 .gwt-popuppanel {
270     border: 3px solid #D0E3ED;
271     padding: 3px;
272     background: #D0E3ED;
273     border-image: initial;
274 }
275
276 .gwt-MenuBar .gwt-MenuItem {
277         border-bottom: 1px solid #EFEFEF;
278 }
279
280 .gwt-MenuBar .gwt-MenuItem-selected {
281         background-color: #E1EFF6;
282 }
283
284 .gwt-MenuBarPopup .menuPopupBottomLeft {
285         background: none;
286         background-color: #D0E3ED;
287 }
288
289 .gwt-MenuBarPopup .menuPopupBottomCenter {
290         background: none;
291         background-color: #D0E3ED;
292 }
293
294 .gwt-MenuBarPopup .menuPopupBottomRight {
295         background: none;
296         background-color: #D0E3ED;
297 }
298
299 .pithos-sessionExpired {
300         width: 24em;
301         /* Restore the padding we remove when overriding the gwt-DialogBox style */
302         padding: 3px;
303 }
304
305 .pithos-statusbar {
306         background-color: #4085a5;
307         border: none;
308         font-size: 90%;
309         vertical-align: middle;
310         font-weight: normal;
311         height:119px;
312         color: white;
313 }
314
315 .pithos-FileListContainer {
316     padding-left: 10px;
317 }
318
319 .pithos-List {
320         cursor: default;
321         border-collapse: collapse;
322         /* prevents selecting text in table with shift and ctrl*/
323         -moz-user-select: none;
324 }
325
326 .pithos-errorMessage {
327         font-size: 90%;
328         background-color: #880000;
329         color: #fff;
330         cursor: pointer;
331 }
332
333 .pithos-errorMessage td {
334         font-size: 90%;
335 }
336
337 .pithos-warnMessage {
338         font-size: 90%;
339         background-color: #eeee99;
340         cursor: pointer;
341 }
342
343 .pithos-infoMessage {
344         font-size: 90%;
345         background-color: #ccffcc;
346         cursor: pointer;
347 }
348
349 .pithos-clearMessage {
350         font-size: 90%;
351         font-weight: bold;
352         text-decoration: none;
353         color: black;
354         padding-left: 5px;
355 }
356
357 .pithos-clearMessage:visited {
358         font-size: 90%;
359         font-weight: bold;
360         text-decoration: none;
361         color: black;
362 }
363
364 .pithos-readForAllNote {
365         width: 240px;
366         text-align: justify;
367         font-style: italic;
368         font-size: 12px;
369         padding-left: 4;
370 }
371
372 .pithos-treeHeader {
373         background-color: #74aec9;
374         height: 25px;
375     width: 100%;
376 }
377
378 .pithos-statistics {
379         color: white;
380         padding: 5px;
381 }
382
383 .pithos-splitPanel {
384         background: url(images/white50.png) transparent;
385         margin-bottom: 34px;
386 }
387
388 .pithos-splitPanel-noframe {
389         margin-bottom: 0;
390 }
391
392 /* Use the background color for the splitter. */
393 .gwt-HorizontalSplitPanel .hsplitter {
394         cursor: move;
395         border: 0px;
396         background: url(images/background.png) repeat-x;
397 }
398
399 .pithos-tag {
400         display:inline;
401 }
402
403 .pithos-uploadButton {
404     background: none;
405     background-color: #ff7f2a;
406     font-size: 120%;
407     text-align: center;
408     height: auto;
409     padding: 8px;
410     width: 146px;
411     border: none;
412 }
413
414 .pithos-uploadButton:HOVER {
415     background-color: #f95;
416 }
417
418 .pithos-rightSide {
419     vertical-align: middle;
420     width: 100%;
421     padding-left: 7px;
422 }
423 .pithos-parentButton {
424     background: none;
425     background-color: #a1c8da;
426 }
427
428 .pithos-folderStatistics {
429     background-color: #a1c8da;
430     text-align: center;
431     color: white;
432     height: 32px;
433         padding: 5px 15px;
434         margin-right: 10px;
435         margin-left: 10px;
436 }
437
438 .grnet-sign {
439         color: #72ADC8;
440 }
441
442 .pithos-logo {
443         position: absolute;
444         top: 29px;
445 }
446
447 .pithos-header {
448         background: url(images/white50.png);
449         margin-top: 34;
450         height: 60px;
451 }
452
453 .pithos-header-noframe {
454         margin-top: 0;
455 }
456
457 /*.cellTreeWidget-selectedTree {
458     background-color: #BCD7E3;
459 }*/
460
461 .pithos-list thead th img {
462     top: 5px !important;
463 }
464
465 .effectPanel-inner {
466         background-color: #4085A5;
467         margin: 10px;
468 }
469
470 .clearfix {
471         display: block;
472         width: auto;
473         zoom: 1;
474 }
475
476 div#toolbar {
477         clear: both;
478         color: white;
479         float: right;
480 /*      position: absolute;
481         right: 15px;
482         top: 15px;*/
483 }
484
485 div#toolbar a {
486         display: block;
487         float: left;
488 }
489
490 .pithos-toolbarItem {
491         text-decoration: none;
492         font-size: 0.8em;
493         padding: 4px;
494         padding-right: 8px;
495         color: white;
496         margin-left: 5px;
497         background-repeat: no-repeat;
498         background-color: #A1C8DB;
499 }
500
501 .pithos-toolbarItem:HOVER {
502         background-color: #74aec9;
503 }
504
505
506 .pithos-toolbarItem span {
507         float: left;
508         padding-top: 2px;
509 }
510
511 .pithos-toolbarItem span.ico {
512         width: 16px;
513         height: 16px;
514         margin-right: 5px;
515         background-repeat: no-repeat;
516 /*      background-position: -36px 0;*/
517 }
518
519 #tools-button span.ico {
520         background-image: url(images/advancedsettings.png);
521 }
522
523 #refresh-button span.ico {
524         background-image: url(images/refresh.png);
525 }
526
527 #newFolder-button span.ico {
528         background-image: url(images/folder_new.png);
529 }
530
531 #shareFolder-button span.ico {
532         background-image: url(images/myshared22.png);
533 }
534
535 /*move background from inner to centerinner to wrap action buttons too*/
536 .dialogMiddleCenterInner.dialogContent  {
537     background: url(images/white50.png); 
538     margin: 7px;
539     padding: 15px;
540     /*border: 1px solid #aaa;*/
541     -moz-box-shadow: 0 0 1px 1px #888;
542     -webkit-box-shadow: 0 0 1px 1px #888;
543     box-shadow: 0 0 1px 1px #888;
544 }
545
546 .pithos-dialogbox .outer {
547     width: 600px;
548 }
549
550 /*remove background/padding from .inner*/
551 .pithos-dialogbox .inner {
552     background: none;
553     padding:0;
554     width: 100%;
555 }
556
557 /*button styles*/
558 .pithos-dialogbox .button {
559 }
560
561 /*button position within the overlay content*/
562 .dialogMiddleCenterInner .button {
563     margin-left: 2px;
564     border: none;
565     padding: 7px 20px;
566     margin-top: 10px;
567     float: right;
568     margin-right: 4px;
569 }
570
571 /* fix placement of overlay paragraphs */
572 .pithos-credentialstext {
573     padding: 0 0 10px 0;
574 }
575
576 /* overlay styles */
577 .pithos-dialogbox {
578     background-color: white;
579     border: 2px solid #444;
580     text-align: left;
581     -moz-box-shadow: 0 0 90px 5px #000;
582     -webkit-box-shadow: 0 0 90px 5px #000;
583     box-shadow: 0 0 90px 5px #000;
584         clip: inherit !important;
585 }
586
587 /* hide overlay dialogue unneeded side elements */
588 .dialogMiddleRight, .dialogBottomRight, .dialogTopRight,
589 .dialogMiddleLeft, .dialogBottomLeft, .dialogTopLeft,
590 .dialogBottomCenter {
591     display: none;
592 }
593
594 /* fix dialogbox caption padding and font-size */
595 .pithos-dialogbox .caption {
596     padding: 10px !important;
597     font-size: 1.1em;
598 }
599
600
601 /* form input styling */
602 .dialogMiddleCenterInner input {
603     border: 1px solid #aaa;
604     padding: 4px;
605 }
606
607 /* fix tag color */
608 a.pithos-tag {
609     color: #4085a5;
610 }
611
612 .pithos-invitationsLeft {
613     padding: 0 0 10px 0;
614         border-bottom: 1px solid #4085A5;
615 }
616
617 .pithos-leftInvitationsNumber {
618         background-color: #4085A5;
619         padding: 3px;
620         color: white;
621         font-weight: bold;
622 }
623
624 .pithos-sendInvitationsPanel {
625         margin-top: 10px;
626         border-right: 1px solid #4085A5;
627         padding-right: 5px;
628 }
629
630 .pithos-sendInvitationsTitle {
631         font-weight: bold;
632         color: #4085A5;
633         margin-right: 10px;
634 }
635
636 .pithos-addInvitationImg {
637         background-color: #4085A5;
638         padding: 5px;
639         cursor: pointer;
640 }
641
642 .pithos-invitationResponse {
643         background-color: green;
644         color: white;
645         padding: 5px;
646 }
647
648 .pithos-invitationResponseError {
649         background-color: #880000;
650         color: #fff;
651         padding: 5px;
652 }
653
654 .pithos-invitationResponse .user {
655         font-weight: bold;
656 }
657
658 .props-labels .eg {
659         font-weight: normal;
660         color: gray;
661 }
662
663 .pithos-invitationsSplitPanel {
664         width:100%;
665 }
666
667 .pithos-invitationDeleteImg {
668         cursor: pointer;
669 }
670
671 .pithos-invitationFormRow {
672         border-top: 1px solid gray;
673 }
674
675 .pithos-sendInvitationButton {
676     background: none;
677     background-color: #ff7f2a;
678     text-align: center;
679     height: auto;
680     padding: 8px;
681     border: none;
682     color: white;
683 }
684
685 .pithos-sentInvitationsPanel {
686         margin-top: 10px;
687         padding-left: 5px;
688         width: 100%;
689 }
690
691 .pithos-sentInvitationsTitle {
692         font-weight: bold;
693         color: #4085A5;
694 }
695
696 .pithos-sentInvitationsTable {
697         width: 100%;
698 }
699
700 .pithos-invitedEmail {
701         color: #ff7f2a;
702         font-weight: bold;
703 }
704
705 .pithos-invitedEmailBorder {
706         border-bottom: 1px solid #4085A5;
707 }
708
709 .pithos-resendInvitation {
710         cursor: pointer;
711 }
712
713 .pithos-pagerButton {
714         background: none;
715         background-color: transparent;
716         border: 1px solid gray;
717         color: gray;
718         padding: 0px 2px 0px 2px;
719         font-size: 80%;
720 }
721
722 .pithos-pagerButton:HOVER {
723         background-color: #4085A5;
724         color: white;
725 }
726
727 .pithos-pagerButtonCurrent {
728         background-color: #4085A5;
729         color: white;
730 }
731
732 .pithos-metaTitle {
733         font-weight: bold;
734 }
735
736 .pithos-addMetaImg {
737         background-color: #4085A5;
738         padding: 5px;
739         cursor: pointer;
740 }
741
742 .pithos-metaDeleteImg {
743         cursor: pointer;
744 }
745
746 .pithos-metaName {
747         width: 7em;
748 }
749
750 .pithos-metaValue {
751         width: 7em;
752 }