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