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