css/dijit.css

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