css/dijit.less

   1 /* Tree */
   2
   3 .claro {
   4
   5         .dijitTreeRow .dijitCheckBox {
   6                 position: relative;
   7                 top: -2px;
   8         }
   9
  10         .dijitTreeLabel {
  11                 outline: 0;
  12         }
  13
  14         .dijitTree .feedParam {
  15                 color: #555;
  16                 float: right;
  17                 margin-right: 1em;
  18         }
  19
  20         .dijitTree .filterRules {
  21                 display: block;
  22                 color: #ccc;
  23                 font-size: 10px;
  24                 margin-left: 100px;
  25         }
  26
  27         .dijitTree .filterRules span {
  28                 display: block;
  29                 color: green;
  30         }
  31
  32         #filterDlg_Matches span.filterRule {
  33                 color: green;
  34         }
  35
  36         .dijitTree .filterRules span.inverse,
  37         #filterDlg_Matches span.filterRule.inverse {
  38                 color: red;
  39         }
  40
  41         .dijitTree .labelParam {
  42                 float: right;
  43                 margin-right: 1em;
  44         }
  45
  46         .dijitTree .dijitTreeLabel.filterDisabled,
  47         .dijitTree .labelParam.filterDisabled {
  48                 color: #555;
  49                 text-decoration: line-through;
  50         }
  51
  52         .dijitTreeRow.Error {
  53                 color: red;
  54         }
  55
  56         .dijitTreeRow.Hidden {
  57                 display: none;
  58         }
  59
  60         .dijitTreeNode .loadingNode {
  61                 margin-left: 3px;
  62                 height: 9px;
  63         }
  64
  65         .dijitFolderClosed,
  66         .dijitFolderOpened {
  67                 display: none;
  68         }
  69
  70         .dijitTreeNode .dijitCheckBox {
  71                 margin-left: 4px;
  72         }
  73
  74         .dijitTreeIsRoot > .dijitTreeRow > .dijitTreeExpando {
  75                 margin-left: 5px;
  76         }
  77
  78         .dijitTree .dijitTreeExpando {
  79                 margin-top: 0px;
  80                 opacity: 0.6;
  81         }
  82
  83         .dijitTree .dijitTreeNode {
  84                 padding: 0px;
  85                 border-width: 0px;
  86         }
  87
  88         /*.dijitTree .dijitTreeRow {
  89         max-width: 100%;
  90         overflow: hidden;
  91         text-overflow: ellipsis;
  92     }*/
  93
  94         .dijitTree .dijitTreeRowSelected {
  95                 background: white;
  96         }
  97
  98         .dijitTree .dijitTreeRowHover {
  99                 background: #f0f0f0;
 100                 border-color: #ddd;
 101         }
 102
 103         .dijitTree .dijitTreeRowSelected {
 104                 background: white;
 105                 border-color: #ddd;
 106         }
 107
 108         .dijitTreeRowSelected .dijitTreeLabel {
 109                 text-shadow: 1px 1px 2px #fff;
 110         }
 111
 112         .dijitTreeRow .dijitTreeExpando {
 113                 background-image: url("../images/treeExpandImages.png");
 114                 position: relative;
 115                 top: -1px;
 116         }
 117
 118         .dijitTreeRow .dijitTreeExpandoLeaf {
 119                 background: none;
 120         }
 121
 122         /* Toolbar */
 123
 124         .dijitToolbar {
 125                 background: #f5f5f5;
 126                 border-color: #ddd;
 127                 /* text-rendering: optimizelegibility;
 128         font-family : "Segoe WP Semibold", "Segoe UI Semibold",
 129             "Segoe UI Web Semibold", "Segoe UI", "Helvetica Neue",
 130             Helvetica, Arial, sans-serif; */
 131         }
 132
 133         /* .dijitToolbar {
 134         text-shadow : 1px 1px 2px #fff;
 135     } */
 136
 137         .dijitDialog .dijitToolbar {
 138                 border: 1px solid #ddd;
 139         }
 140
 141         /* Dialog */
 142
 143         .dijitDialog h2 {
 144                 margin-top: 0px;
 145                 margin-bottom: 4px;
 146                 border-width: 0px;
 147         }
 148
 149         .dijitMenu .dijitMenuItem .dijitMenuItemLabel {
 150                 font-size: 13px;
 151                 padding-top: 3px;
 152                 padding-bottom: 3px;
 153         }
 154
 155         /* Checkbox */
 156
 157         .dijitCheckBox {
 158                 background-image: url("../images/untick.png");
 159                 background-color: transparent;
 160                 width: 15px;
 161                 height: 15px;
 162                 margin: 1px;
 163                 opacity: 0.7;
 164                 background-position: center center;
 165                 transition: opacity 0.25s;
 166                 -webkit-transition: opacity 0.25s;
 167                 /* border : 1px solid #b5bcc7; */
 168                 padding: 1px;
 169         }
 170
 171         .dijitCheckBox:hover {
 172                 opacity: 1;
 173         }
 174
 175         .dijitCheckBox.dijitCheckBoxDisabled:hover {
 176                 opacity: 0.7;
 177         }
 178
 179         .dijitCheckBox.dijitCheckBoxChecked {
 180                 border-color: #69C671;
 181                 background-image: url("../images/tick.png");
 182                 opacity: 1;
 183         }
 184
 185         /* Various buttons */
 186
 187         .dijitButton.danger .dijitButtonText {
 188                 color: #ffffff;
 189         }
 190
 191         .dijitButton.danger {
 192                 text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
 193                 background-color: #da4f49;
 194                 *background-color: #bd362f;
 195                 background-image: -moz-linear-gradient(top, #ee5f5b, #bd362f);
 196                 background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ee5f5b), to(#bd362f));
 197                 background-image: -webkit-linear-gradient(top, #ee5f5b, #bd362f);
 198                 background-image: -o-linear-gradient(top, #ee5f5b, #bd362f);
 199                 background-image: linear-gradient(to bottom, #ee5f5b, #bd362f);
 200                 background-repeat: repeat-x;
 201                 border-color: #bd362f #bd362f #802420;
 202                 border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
 203                 filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffee5f5b', endColorstr='#ffbd362f', GradientType=0);
 204                 filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
 205         }
 206
 207         .dijitButton.dijitButtonDisabled.danger,
 208         .dijitButton.dijitButtonActive.danger,
 209         .dijitButton.dijitButtonHover.danger,
 210         .dijitButton.dijitFocused.danger {
 211                 color: #ffffff;
 212                 background-color: #bd362f;
 213                 *background-color: #a9302a;
 214         }
 215
 216         .dijitButton.dijitButtonActive.danger {
 217                 background-color: #942a25 \9;
 218         }
 219
 220         .dijitDropDownButton {
 221                 margin: 0px;
 222         }
 223
 224         .dijitDropDownButton .dijitButtonNode {
 225                 padding: 0px;
 226         }
 227
 228         .dijitButton.dijitButtonActive.danger {
 229                 color: rgba(255, 255, 255, 0.75);
 230         }
 231
 232         .dijitButton .dijitButtonNode,
 233         .dijitDropDownButton .dijitButtonNode,
 234         .dijitComboButton .dijitButtonNode,
 235         .dijitToolbar .dijitDropDownButton .dijitButtonNode,
 236         .dijitToolbar .dijitComboButton,
 237         .dijitToolbar .dijitSelect.dijitDownArrowButton .dijitButtonNode,
 238         .dijitToolbar .dijitComboButton .dijitButtonNode {
 239                 background: none;
 240                 border-color: transparent;
 241                 box-shadow: none;
 242         }
 243
 244         button,
 245         input[type="submit"] {
 246                 font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
 247                 font-size: 14px;
 248         }
 249
 250         button,
 251         input[type="submit"],
 252         .dijitButton,
 253         .dijitDropDownButton .dijitDownArrowButton,
 254         .dijitComboButton {
 255                 display: inline-block;
 256                 padding: 4px 12px;
 257                 margin-bottom: 0;
 258                 font-size: 14px;
 259                 line-height: 20px;
 260                 color: #333333;
 261                 text-align: center;
 262                 text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
 263                 vertical-align: middle;
 264                 cursor: pointer;
 265                 background-color: #f5f5f5;
 266                 background-image: -moz-linear-gradient(top, #ffffff, #e6e6e6);
 267                 background-image: -webkit-linear-gradient(top, #ffffff, #e6e6e6);
 268                 background-image: linear-gradient(to bottom, #ffffff, #e6e6e6);
 269                 background-repeat: repeat-x;
 270                 border: 1px solid #cccccc;
 271                 border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
 272                 border-bottom-color: #b3b3b3;
 273                 -webkit-border-radius: 4px;
 274                 border-radius: 4px;
 275                 -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
 276                 box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
 277         }
 278
 279         button:hover,
 280         button:focus,
 281         button:active,
 282         input[type="submit"]:hover,
 283         input[type="submit"]:focus,
 284         input[type="submit"]:active,
 285         .dijitButton:hover,
 286         .dijitButton:focus,
 287         .dijitButton:active,
 288         .dijitDropDownButton .dijitDownArrowButton:hover,
 289         .dijitDropDownButton .dijitDownArrowButton:focus,
 290         .dijitDropDownButton .dijitDownArrowButton:active,
 291         .dijitComboButton:hover,
 292         .dijitComboButton:focus,
 293         .dijitComboButton:active,
 294         .dijitButton.dijitButtonDisabled {
 295                 color: #333333;
 296                 background-color: #e6e6e6;
 297         }
 298
 299         button:active,
 300         input[type="submit"]:active,
 301         .dijitButton:active,
 302         .dijitDropDownButton .dijitDownArrowButton:active,
 303         .dijitComboButton:active {
 304                 background-color: #cccccc \9;
 305         }
 306
 307         .dijitToolbar .dijitButton,
 308         .dijitToolbar .dijitButton.dijitHover,
 309         .dijitToolbar .dijitComboButton,
 310         .dijitToolbar .dijitDropDownButton .dijitDownArrowButton,
 311         .dijitToolbar .dijitComboButton.dijitHover {
 312                 background: none;
 313                 border-color: transparent;
 314                 box-shadow: none;
 315                 padding: 0px;
 316                 margin: 0px;
 317                 line-height: auto;
 318                 text-shadow: none;
 319         }
 320
 321         .dijitToolbar .dijitDropDownButton .dijitButtonText,
 322         .dijitToolbar .dijitDownArrowButton .dijitButtonText,
 323         .dijitToolbar .dijitComboButton .dijitButtonText {
 324                 padding: 0px;
 325         }
 326
 327         .dijitToolbar .dijitDropDownButton .dijitButtonNode {
 328                 border-radius: 4px;
 329         }
 330
 331         .dijitToolbar .dijitButton.dijitHover,
 332         .dijitToolbar .dijitDropDownButton.dijitHover .dijitButtonNode,
 333         .dijitToolbar .dijitComboButton.dijitHover {
 334                 border-color: #ccc;
 335         }
 336
 337         .dijitToolbar .dijitButton.dijitHover .dijitButtonNode,
 338         .dijitToolbar .dijitButton.dijitButtonActive .dijitButtonNode {
 339                 background: none;
 340         }
 341
 342         .dijitToolbar .dijitButton .dijitButtonContents,
 343         .dijitToolbar .dijitDropDownButton .dijitButtonContents,
 344         .dijitToolbar .dijitComboButton .dijitButtonContents {
 345                 font-size: 13px;
 346         }
 347
 348         button:hover,
 349         button:focus,
 350         input[type="submit"]:hover,
 351         input[type="submit"]:focus,
 352         .dijitButton:hover,
 353         .dijitDropDownButton .dijitDownArrowButton:hover,
 354         .dijitToolbar .dijitButton:hover .dijitButtonNode,
 355         .dijitToolbar .dijitButton.dijitHover .dijitButtonNode,
 356         .dijitButton:focus,
 357         .dijitComboButton:hover,
 358         .dijitComboButton:focus {
 359                 color: #333333;
 360                 text-decoration: none;
 361                 background-position: 0 -15px;
 362                 -webkit-transition: background-position 0.1s linear;
 363                 transition: background-position 0.1s linear;
 364         }
 365
 366         button:focus,
 367         input[type="submit"]:focus,
 368         .dijitButton:focus,
 369         .dijitDropDownButton .dijitDownArrowButton:focus,
 370         .dijitComboButton:focus {
 371                 outline: thin dotted #333;
 372                 outline: 5px auto -webkit-focus-ring-color;
 373                 outline-offset: -2px;
 374         }
 375
 376         button:active,
 377         input[type="submit"]:active,
 378         .dijitButton:active,
 379         .dijitComboButton:active,
 380         .dijitToolbar .dijitDropDownButton.dijitOpened,
 381         .dijitToolbar .dijitComboButton.dijitOpened,
 382         .dijitToolbar .dijitButton.dijitButtonActive .dijitButtonNode {
 383                 background-image: none;
 384                 outline: 0;
 385                 -webkit-box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05);
 386                 box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05);
 387         }
 388
 389         input[type="submit"][disabled],
 390         button[disabled],
 391         .dijitButton[disabled],
 392         .dijitDropDownButton .dijitDownArrowButton[disabled],
 393         .dijitButton.dijitButtonDisabled,
 394         .dijitComboButton.dijitButtonDisabled {
 395                 cursor: default;
 396                 background-image: none;
 397                 opacity: 0.65;
 398                 filter: alpha(opacity=65);
 399                 -webkit-box-shadow: none;
 400                 box-shadow: none;
 401         }
 402
 403         .dijitButton .dijitButtonContents,
 404         .dijitDropDownButton .dijitButtonContents,
 405         .dijitComboButton .dijitButtonContents {
 406                 font-size: 14px;
 407                 font-weight: normal;
 408                 line-height: 20px;
 409         }
 410
 411         .dijitButton.small .dijitButtonText {
 412                 font-size: 11px;
 413         }
 414
 415         .dijitMenu {
 416                 border-color: rgba(82, 168, 236, 0.8);
 417         }
 418
 419         .dijitMenu .dijitMenuItemSelected,
 420         .dijitMenu .dijitMenuItemSelected td {
 421                 background: rgb(82, 168, 236);
 422                 color: white;
 423                 border-color: rgba(82, 168, 236, 0.8);
 424         }
 425
 426         .dijitButton .dijitButtonNode,
 427         .dijitComboButton .dijitButtonNode {
 428                 padding: 0px;
 429         }
 430
 431         /* Other stuff */
 432
 433         /* .dijitAccordionTitleFocus {
 434         text-shadow : 1px 1px 2px #fff;
 435     }
 436
 437     .dijitAccordionTitle {
 438         text-rendering: optimizelegibility;
 439         font-family : "Segoe WP Semibold", "Segoe UI Semibold",
 440             "Segoe UI Web Semibold", "Segoe UI", "Helvetica Neue",
 441             Helvetica, Arial, sans-serif;
 442     } */
 443
 444         .dijitAccordionTitle.dijitAccordionTitleHover,
 445         .dijitAccordionTitle.dijitAccordionTitleFocused {
 446                 background: white;
 447                 transition: background 0.25s;
 448         }
 449         .dijitAccordionTitle {
 450                 background: #f0f0f0;
 451                 transition: background 0.25s;
 452         }
 453
 454         .dijitAccordionInnerContainer.dijitAccordionInnerContainerSelected,
 455         .dijitAccordionTitle.dijitAccordionTitleSelected {
 456                 background: #0088cc;
 457                 transition: background 0.25s;
 458         }
 459
 460         .dijitAccordionTitle.dijitAccordionTitleSelected .dijitAccordionText {
 461                 color: white;
 462         }
 463
 464         .dijitAccordionInnerContainer.dijitAccordionInnerContainerSelected {
 465                 border-color: #0088cc;
 466         }
 467
 468         .dijitAccordionContainer .dijitAccordionChildWrapper {
 469                 border-color: #ddd;
 470         }
 471
 472         /* Tabs */
 473
 474         .dijitTabInner.dijitTab {
 475                 background: #f0f0f0;
 476         }
 477
 478         .dijitTabContent {
 479                 background: #eee;
 480         }
 481
 482         .dijitTabContent.dijitTabChecked,
 483         .dijitTabContent.dijitTabHover,
 484         .dijitTabContent.dijitFocused {
 485                 background: white;
 486         }
 487
 488         .dijitTabPaneWrapper,
 489         .dijitTabContainerTop-tabs,
 490         .dijitTab,
 491         .dijitAccordionInnerContainer {
 492                 border-color: #ddd;
 493         }
 494
 495         /* Text fields & selects */
 496
 497         .dijitComboBox .dijitArrowButton,
 498         .dijitSelect .dijitArrowButton {
 499                 background: transparent;
 500                 border-color: transparent;
 501         }
 502
 503         .dijitSelect .dijitArrowButton .dijitArrowButtonInner {
 504                 margin-right: 5px;
 505                 float: right;
 506         }
 507
 508         select,
 509         .dijitDownArrowButton.dijitSelect {
 510                 -webkit-border-radius: 4px;
 511                 -moz-border-radius: 4px;
 512                 border-radius: 4px;
 513                 margin-bottom: 4px;
 514
 515         }
 516
 517         .dijitSelect .dijitButtonContents {
 518                 display: inline-block;
 519                 height: 20px;
 520                 padding: 4px 6px;
 521                 font-size: 14px;
 522                 line-height: 20px;
 523                 color: #555555;
 524                 vertical-align: middle;
 525                 border-width: 0px;
 526         }
 527
 528         select,
 529         textarea,
 530         .input.input-text,
 531         .dijitTextBox {
 532                 display: inline-block;
 533                 height: 20px;
 534                 padding: 4px 6px;
 535                 font-size: 14px;
 536                 line-height: 20px;
 537                 color: #555555;
 538                 vertical-align: middle;
 539                 -webkit-border-radius: 4px;
 540                 -moz-border-radius: 4px;
 541                 border-radius: 4px;
 542                 margin-bottom: 4px;
 543         }
 544         textarea {
 545                 height: auto;
 546         }
 547
 548         select,
 549         .input.input-text {
 550                 height: 30px;
 551         }
 552
 553         textarea,
 554         select,
 555         .input.input-text,
 556         .dijitTextBox,
 557         .dijitSelect {
 558                 background-color: #ffffff;
 559                 border: 1px solid #cccccc;
 560                 -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
 561                 -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
 562                 box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
 563                 -webkit-transition: border linear 0.2s, box-shadow linear 0.2s;
 564                 -moz-transition: border linear 0.2s, box-shadow linear 0.2s;
 565                 -o-transition: border linear 0.2s, box-shadow linear 0.2s;
 566                 transition: border linear 0.2s, box-shadow linear 0.2s;
 567         }
 568
 569         select:focus,
 570         .input.input-text:focus,
 571         .dijitTextBox.dijitFocused,
 572         .dijitSelect.dijitFocused {
 573                 border-color: rgba(82, 168, 236, 0.8);
 574                 outline: 0;
 575                 outline: thin dotted \9;
 576                 /* IE6-9 */
 577
 578                 -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6);
 579                 -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6);
 580                 box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6);
 581         }
 582
 583         .dijitError .dijitValidationContainer {
 584                 padding: 0px;
 585                 width: 13px;
 586                 border-width: 1px;
 587                 display: none;
 588         }
 589
 590         .dijitSelect.dijitSelectDisabled {
 591                 background-color: #eeeeee;
 592         }
 593
 594         .dijitSelect.dijitSelectDisabled .dijitSelectLabel {
 595                 cursor: not-allowed;
 596         }
 597
 598         .dijitTextBox.dijitTextBoxDisabled,
 599         .dijitTextBox.dijitTextBoxDisabled .dijitInputInner,
 600         .dijitTextBox.dijitReadOnly,
 601         .dijitTextBox.dijitReadOnly .dijitInputInner {
 602                 cursor: not-allowed;
 603                 background-color: #eeeeee;
 604         }
 605
 606         .dijitToolbar .dijitDownArrowButton.dijitSelect {
 607                 border-color: rgba(0, 0, 0, 0.1);
 608         }
 609
 610         .dijitToolbar .dijitDownArrowButton.dijitSelect .dijitButtonContents {
 611                 padding: 2px 2px 0px 4px;
 612         }
 613
 614         .dijitToolbar .dijitDownArrowButton.dijitSelect {
 615                 margin: 0px;
 616         }
 617
 618         .dijitToolbar .dijitTextBox {
 619                 padding: 0px;
 620                 margin-bottom: 0px;
 621                 border-radius: 0px;
 622         }
 623
 624         /* dialog */
 625
 626         .dijitDialog {
 627                 border-radius: 6px;
 628
 629         }
 630
 631         .dijitDialog .dijitDialogCloseIcon {
 632                 margin-top: 5px;
 633         }
 634
 635         .dijitDialog .dijitDialogTitleBar {
 636                 background: white;
 637                 padding: 8px;
 638                 font-weight: 600;
 639                 color: #555;
 640                 font-size: 16px;
 641                 text-rendering: optimizelegibility;
 642                 font-family: @fonts-ui-bold;
 643         }
 644
 645         .dijitDialog .dijitDialogPaneContent {
 646                 border-color: #ddd;
 647                 padding: 10px;
 648         }
 649
 650         .dijitProgressBar.dijitProgressBarEmpty {
 651                 background: #ddd;
 652                 border-color: #0088cc;
 653         }
 654
 655         .dijitProgressBar.dijitProgressBarEmpty .dijitProgressBarFull .dijitProgressBarTile {
 656                 background: rgb(82, 168, 236);
 657
 658         }
 659
 660         .dijitProgressBar .dijitProgressBarLabel {
 661                 color: white;
 662         }
 663
 664 }