code.grnet.gr Git - pithos-web-client/blob - src/gr/grnet/pithos/web/public/pithos.css

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