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 .dijitButton .dijitButtonNode,
 188 .claro .dijitDropDownButton .dijitButtonNode,
 189 .claro .dijitComboButton .dijitButtonNode,
 190 .claro .dijitToolbar .dijitDropDownButton .dijitButtonNode,
 191 .claro .dijitToolbar .dijitComboButton,
 192 .claro .dijitToolbar .dijitSelect.dijitDownArrowButton .dijitButtonNode,
 193 .claro .dijitToolbar .dijitComboButton .dijitButtonNode {
 194         background : none;
 195         border-color : transparent;
 196         box-shadow : none;
 197 }
 198
 199 button,
 200 input[type="submit"] {
 201         font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
 202         font-size : 14px;
 203 }
 204
 205 button,
 206 input[type="submit"],
 207 .claro .dijitButton,
 208 .claro .dijitDropDownButton .dijitDownArrowButton,
 209 .claro .dijitComboButton {
 210   display: inline-block;
 211   padding: 4px 12px;
 212   margin-bottom: 0;
 213   font-size: 14px;
 214   line-height: 20px;
 215   color: #333333;
 216   text-align: center;
 217   text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
 218   vertical-align: middle;
 219   cursor: pointer;
 220   background-color: #f5f5f5;
 221   background-image: -moz-linear-gradient(top, #ffffff, #e6e6e6);
 222   background-image: -webkit-linear-gradient(top, #ffffff, #e6e6e6);
 223   background-image: linear-gradient(to bottom, #ffffff, #e6e6e6);
 224   background-repeat: repeat-x;
 225   border: 1px solid #cccccc;
 226   border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
 227   border-bottom-color: #b3b3b3;
 228   -webkit-border-radius: 4px;
 229   border-radius: 4px;
 230   -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
 231   box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
 232 }
 233
 234 button:hover,
 235 button:focus,
 236 button:active,
 237 input[type="submit"]:hover,
 238 input[type="submit"]:focus,
 239 input[type="submit"]:active,
 240 .claro .dijitButton:hover,
 241 .claro .dijitButton:focus,
 242 .claro .dijitButton:active,
 243 .claro .dijitDropDownButton .dijitDownArrowButton:hover,
 244 .claro .dijitDropDownButton .dijitDownArrowButton:focus,
 245 .claro .dijitDropDownButton .dijitDownArrowButton:active,
 246 .claro .dijitComboButton:hover,
 247 .claro .dijitComboButton:focus,
 248 .claro .dijitComboButton:active,
 249 .claro .dijitButton.dijitButtonDisabled {
 250   color: #333333;
 251   background-color: #e6e6e6;
 252 }
 253
 254 button:active,
 255 input[type="submit"]:active,
 256 .claro .dijitButton:active,
 257 .claro .dijitDropDownButton .dijitDownArrowButton:active,
 258 .claro .dijitComboButton:active {
 259         background-color: #cccccc \9;
 260 }
 261
 262 .claro .dijitToolbar .dijitButton,
 263 .claro .dijitToolbar .dijitButton.dijitHover,
 264 .claro .dijitToolbar .dijitComboButton,
 265 .claro .dijitToolbar .dijitDropDownButton .dijitDownArrowButton,
 266 .claro .dijitToolbar .dijitComboButton.dijitHover {
 267         background : none;
 268         border-color : transparent;
 269         box-shadow : none;
 270         padding : 0px;
 271         margin : 0px;
 272         line-height : auto;
 273         text-shadow : none;
 274 }
 275
 276 .claro .dijitToolbar .dijitDropDownButton .dijitButtonText,
 277 .claro .dijitToolbar .dijitDownArrowButton .dijitButtonText,
 278 .claro .dijitToolbar .dijitComboButton .dijitButtonText {
 279         padding : 0px;
 280 }
 281
 282 .claro .dijitToolbar .dijitDropDownButton .dijitButtonNode {
 283         border-radius : 4px;
 284 }
 285
 286 .claro .dijitToolbar .dijitButton.dijitHover,
 287 .claro .dijitToolbar .dijitDropDownButton.dijitHover .dijitButtonNode,
 288 .claro .dijitToolbar .dijitComboButton.dijitHover {
 289         border-color : #ccc;
 290 }
 291
 292 .claro .dijitToolbar .dijitButton.dijitHover .dijitButtonNode,
 293 .claro .dijitToolbar .dijitButton.dijitButtonActive .dijitButtonNode {
 294         background : none;
 295 }
 296
 297 .claro .dijitToolbar .dijitButton .dijitButtonContents,
 298 .claro .dijitToolbar .dijitDropDownButton .dijitButtonContents,
 299 .claro .dijitToolbar .dijitComboButton .dijitButtonContents {
 300         font-size : 13px;
 301 }
 302
 303 button:hover,
 304 button:focus,
 305 input[type="submit"]:hover,
 306 input[type="submit"]:focus,
 307 .claro .dijitButton:hover,
 308 .claro .dijitDropDownButton .dijitDownArrowButton:hover,
 309 .claro .dijitToolbar .dijitButton:hover .dijitButtonNode,
 310 .claro .dijitToolbar .dijitButton.dijitHover .dijitButtonNode,
 311 .claro .dijitButton:focus,
 312 .claro .dijitComboButton:hover,
 313 .claro .dijitComboButton:focus {
 314   color: #333333;
 315   text-decoration: none;
 316   background-position: 0 -15px;
 317   -webkit-transition: background-position 0.1s linear;
 318   transition: background-position 0.1s linear;
 319 }
 320
 321 button:focus,
 322 input[type="submit"]:focus,
 323 .claro .dijitButton:focus,
 324 .claro .dijitDropDownButton .dijitDownArrowButton:focus,
 325 .claro .dijitComboButton:focus {
 326   outline: thin dotted #333;
 327   outline: 5px auto -webkit-focus-ring-color;
 328   outline-offset: -2px;
 329 }
 330
 331 button:active,
 332 input[type="submit"]:active,
 333 .claro .dijitButton:active,
 334 .claro .dijitComboButton:active,
 335 .claro .dijitToolbar .dijitDropDownButton.dijitOpened,
 336 .claro .dijitToolbar .dijitComboButton.dijitOpened,
 337 .claro .dijitToolbar .dijitButton.dijitButtonActive .dijitButtonNode {
 338   background-image: none;
 339   outline: 0;
 340   -webkit-box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05);
 341   box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05);
 342 }
 343
 344 input[type="submit"][disabled],
 345 button[disabled],
 346 .claro .dijitButton[disabled],
 347 .claro .dijitDropDownButton .dijitDownArrowButton[disabled],
 348 .claro .dijitButton.dijitButtonDisabled,
 349 .claro .dijitComboButton.dijitButtonDisabled {
 350   cursor: default;
 351   background-image: none;
 352   opacity: 0.65;
 353   filter: alpha(opacity=65);
 354   -webkit-box-shadow: none;
 355   box-shadow: none;
 356 }
 357
 358 .claro .dijitButton .dijitButtonContents,
 359 .claro .dijitDropDownButton .dijitButtonContents,
 360 .claro .dijitComboButton .dijitButtonContents {
 361         font-size : 14px;
 362         font-weight : normal;
 363         line-height : 20px;
 364 }
 365
 366 .claro .dijitButton.small .dijitButtonText {
 367         font-size : 11px;
 368 }
 369
 370 .claro .dijitMenu {
 371         border-color : #ccc;
 372 }
 373
 374 .claro .dijitMenu .dijitMenuItem.dijitHover,
 375 .claro .dijitMenu .dijitMenuItem.dijitFocused,
 376 .claro .dijitMenuTable .dijitMenuItem.dijitHover .dijitMenuItemLabel,
 377 .claro .dijitMenuTable .dijitMenuItem.dijitFocused .dijitMenuItemLabel {
 378         background : #eee;
 379         border-color : transparent;
 380 }
 381
 382 .claro .dijitButton .dijitButtonNode,
 383 .claro .dijitComboButton .dijitButtonNode {
 384         padding : 0px;
 385 }
 386
 387 /* Other stuff */
 388
 389 /* .claro .dijitAccordionTitleFocus {
 390         text-shadow : 1px 1px 2px #fff;
 391 }
 392
 393 .claro .dijitAccordionTitle {
 394         text-rendering: optimizelegibility;
 395         font-family : "Segoe WP Semibold", "Segoe UI Semibold",
 396                 "Segoe UI Web Semibold", "Segoe UI", "Helvetica Neue",
 397                 Helvetica, Arial, sans-serif;
 398 } */
 399
 400 .claro .dijitAccordionInnerContainer.dijitAccordionInnerContainerSelected {
 401         border-color : #ccc;
 402 }
 403
 404 .claro .dijitAccordionContainer .dijitAccordionChildWrapper {
 405         border-color : #ddd;
 406 }
 407
 408 /* Tabs */
 409
 410 .claro .dijitTabContent {
 411         background : #eee;
 412 }
 413
 414 .claro .dijitTabContent.dijitTabChecked,
 415 .claro .dijitTabContent.dijitTabHover,
 416 .claro .dijitTabContent.dijitFocused {
 417         background : white;
 418 }
 419
 420 .claro .dijitTabPaneWrapper,
 421 .claro .dijitTabContainerTop-tabs,
 422 .claro .dijitTab,
 423 .claro .dijitAccordionInnerContainer {
 424         border-color : #ddd;
 425 }
 426
 427 /* Text fields & selects */
 428
 429 .claro .dijitComboBox .dijitArrowButton,
 430 .claro .dijitSelect .dijitArrowButton {
 431         background : transparent;
 432         border-color : transparent;
 433 }
 434
 435 .claro .dijitSelect .dijitArrowButton .dijitArrowButtonInner {
 436         margin-right : 5px;
 437 }
 438
 439 .claro .dijitDownArrowButton.dijitSelect {
 440         -webkit-border-radius: 4px;
 441         -moz-border-radius: 4px;
 442         border-radius: 4px;
 443         margin-bottom : 4px;
 444
 445 }
 446
 447 .claro .dijitSelect .dijitButtonContents {
 448         display: inline-block;
 449         height: 20px;
 450         padding: 4px 6px;
 451         font-size: 14px;
 452         line-height: 20px;
 453         color: #555555;
 454         vertical-align: middle;
 455         border-width : 0px;
 456 }
 457
 458 .claro .dijitTextBox {
 459         display: inline-block;
 460         height: 20px;
 461         padding: 4px 6px;
 462         font-size: 14px;
 463         line-height: 20px;
 464         color: #555555;
 465         vertical-align: middle;
 466         -webkit-border-radius: 4px;
 467         -moz-border-radius: 4px;
 468         border-radius: 4px;
 469         margin-bottom : 4px;
 470 }
 471
 472 .claro .dijitTextBox,
 473 .claro .dijitSelect {
 474         background-color: #ffffff;
 475         border: 1px solid #cccccc;
 476         -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
 477         -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
 478         box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
 479         -webkit-transition: border linear 0.2s, box-shadow linear 0.2s;
 480         -moz-transition: border linear 0.2s, box-shadow linear 0.2s;
 481         -o-transition: border linear 0.2s, box-shadow linear 0.2s;
 482         transition: border linear 0.2s, box-shadow linear 0.2s;
 483 }
 484
 485 .claro .dijitTextBox.dijitFocused {
 486         border-color: rgba(82, 168, 236, 0.8);
 487         outline: 0;
 488         outline: thin dotted \9;
 489         /* IE6-9 */
 490
 491         -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6);
 492         -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6);
 493         box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6);
 494 }
 495
 496 .claro .dijitError .dijitValidationContainer {
 497         padding : 0px;
 498         width : 13px;
 499         border-width : 1px;
 500 }
 501
 502 .claro .dijitTextBox.dijitReadOnly,
 503 .claro .dijitTextBox.dijitReadOnly .dijitInputField .dijitInputInner {
 504         cursor: not-allowed;
 505         background-color: #eeeeee;
 506 }
 507
 508 .claro .dijitToolbar .dijitDownArrowButton.dijitSelect {
 509         border-color : rgba(0,0,0,0.1);
 510 }
 511
 512 .claro .dijitToolbar .dijitDownArrowButton.dijitSelect .dijitButtonContents {
 513         padding : 0px 2px 0px 2px;
 514 }
 515
 516 .claro .dijitToolbar .dijitDownArrowButton.dijitSelect {
 517         margin : 0px;
 518 }
 519
 520 .claro .dijitToolbar .dijitTextBox {
 521         padding : 0px;
 522         margin-bottom : 0px;
 523         border-radius : 0px;
 524 }
 525