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 .labelParam {
  19         float : right;
  20         margin-right : 1em;
  21 }
  22
  23 .claro .dijitTree .dijitTreeLabel.Disabled,
  24 .claro .dijitTree .labelParam.Disabled {
  25         color : #555;
  26 }
  27
  28 .claro .dijitTreeRow.Error {
  29         color : red;
  30 }
  31
  32 .claro .dijitTreeRow.Hidden {
  33         display : none;
  34 }
  35
  36 .claro .dijitTreeNode .loadingNode {
  37         margin-left : 3px;
  38         height : 9px;
  39 }
  40
  41 .claro .dijitFolderClosed,
  42 .claro .dijitFolderOpened {
  43         display : none;
  44 }
  45
  46 .claro .dijitTreeNode .dijitCheckBox {
  47         margin-left : 4px;
  48 }
  49
  50 .claro .dijitTreeIsRoot > .dijitTreeRow > .dijitTreeExpando {
  51         margin-left : 5px;
  52 }
  53
  54 .claro .dijitTree .dijitTreeExpando {
  55         margin-top : 0px;
  56         opacity : 0.6;
  57 }
  58
  59 .claro .dijitTree .dijitTreeNode {
  60         padding : 0px;
  61         border-width : 0px;
  62 }
  63
  64 .claro .dijitTree .dijitTreeRow {
  65         max-width: 100%;
  66         overflow: hidden;
  67         text-overflow: ellipsis;
  68 }
  69
  70 .claro .dijitTree .dijitTreeRowSelected {
  71         background : white;
  72 }
  73
  74 .claro .dijitTree .dijitTreeRowHover {
  75         background : #f0f0f0;
  76         border-color : #ddd;
  77 }
  78
  79 .claro .dijitTree .dijitTreeRowSelected {
  80         background : white;
  81         border-color : #ddd;
  82 }
  83
  84 .claro .dijitTreeRowSelected .dijitTreeLabel {
  85         text-shadow : 1px 1px 2px #fff;
  86 }
  87
  88 .claro .dijitTreeRow .dijitTreeExpando {
  89         background-image: url("../images/treeExpandImages.png");
  90         position : relative;
  91         top : -1px;
  92 }
  93
  94 .claro .dijitTreeRow .dijitTreeExpandoLeaf {
  95         background : none;
  96 }
  97
  98 /* Toolbar */
  99
 100 .claro .dijitToolbar {
 101         background : #f5f5f5;
 102         border-color : #ddd;
 103 }
 104
 105 .claro .dijitToolbar {
 106         text-shadow : 1px 1px 2px #fff;
 107 }
 108
 109 .claro .dijitDialog .dijitToolbar {
 110         border : 1px solid #ddd;
 111 }
 112
 113 /* Dialog */
 114
 115 .claro .dijitDialog h2 {
 116         margin-top : 0px;
 117         margin-bottom : 4px;
 118         border-width : 0px;
 119 }
 120
 121 .claro .dijitMenuItemLabel {
 122         font-size : 13px;
 123 }
 124
 125 /* Checkbox */
 126
 127 .claro .dijitCheckBox {
 128         background-image : url("../images/untick.png");
 129         background-color : transparent;
 130         width : 16px;
 131         height : 16px;
 132         background-position : center center;
 133         opacity : 0.4;
 134         -webkit-transition : opacity 0.25s;
 135         transition : opacity 0.25s;
 136         border : 1px solid #eee;
 137         border-radius : 2px;
 138         padding : 1px;
 139 }
 140
 141 .claro .dijitCheckBox:hover {
 142         opacity : 1;
 143 }
 144
 145 .claro .dijitCheckBox.dijitCheckBoxDisabled:hover {
 146         opacity : 0.6;
 147 }
 148
 149 .claro .dijitCheckBox.dijitCheckBoxChecked {
 150         border-color : #ddffdd;
 151         background-image : url("../images/tick.png");
 152         opacity : 1;
 153 }
 154
 155 /* Various buttons */
 156
 157 .claro .dijitButton .dijitButtonNode,
 158 .claro .dijitComboButton .dijitButtonNode,
 159 .claro .dijitToolbar .dijitDropDownButton .dijitButtonNode,
 160 .claro .dijitToolbar .dijitComboButton,
 161 .claro .dijitToolbar .dijitComboButton .dijitButtonNode {
 162         background : none;
 163         border-color : transparent;
 164         box-shadow : none;
 165 }
 166
 167 button,
 168 input[type="submit"] {
 169         font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
 170         font-size : 14px;
 171 }
 172
 173 button,
 174 input[type="submit"],
 175 .claro .dijitButton,
 176 .claro .dijitComboButton {
 177   display: inline-block;
 178   padding: 4px 12px;
 179   margin-bottom: 0;
 180   font-size: 14px;
 181   line-height: 20px;
 182   color: #333333;
 183   text-align: center;
 184   text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
 185   vertical-align: middle;
 186   cursor: pointer;
 187   background-color: #f5f5f5;
 188   background-image: -moz-linear-gradient(top, #ffffff, #e6e6e6);
 189   background-image: -webkit-linear-gradient(top, #ffffff, #e6e6e6);
 190   background-image: linear-gradient(to bottom, #ffffff, #e6e6e6);
 191   background-repeat: repeat-x;
 192   border: 1px solid #cccccc;
 193   border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
 194   border-bottom-color: #b3b3b3;
 195   -webkit-border-radius: 4px;
 196   border-radius: 4px;
 197   -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
 198   box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
 199 }
 200
 201 button:hover,
 202 button:focus,
 203 button:active,
 204 input[type="submit"]:hover,
 205 input[type="submit"]:focus,
 206 input[type="submit"]:active,
 207 .claro .dijitButton:hover,
 208 .claro .dijitButton:focus,
 209 .claro .dijitButton:active,
 210 .claro .dijitComboButton:hover,
 211 .claro .dijitComboButton:focus,
 212 .claro .dijitComboButton:active,
 213 .claro .dijitButton.dijitButtonDisabled {
 214   color: #333333;
 215   background-color: #e6e6e6;
 216 }
 217
 218 button:active,
 219 input[type="submit"]:active,
 220 .claro .dijitButton:active,
 221 .claro .dijitComboButton:active {
 222         background-color: #cccccc \9;
 223 }
 224
 225 .claro .dijitToolbar .dijitButton,
 226 .claro .dijitToolbar .dijitButton.dijitHover,
 227 .claro .dijitToolbar .dijitComboButton,
 228 .claro .dijitToolbar .dijitComboButton.dijitHover {
 229         background : none;
 230         border-color : transparent;
 231         box-shadow : none;
 232         padding : 0px;
 233         margin : 0px;
 234         line-height : auto;
 235 }
 236
 237 .claro .dijitToolbar .dijitButton.dijitHover,
 238 .claro .dijitToolbar .dijitDropDownButton.dijitHover .dijitButtonNode,
 239 .claro .dijitToolbar .dijitComboButton.dijitHover {
 240         border-color : #ccc;
 241 }
 242
 243 .claro .dijitToolbar .dijitButton.dijitHover .dijitButtonNode,
 244 .claro .dijitToolbar .dijitButton.dijitButtonActive .dijitButtonNode {
 245         background : none;
 246 }
 247
 248 .claro .dijitToolbar .dijitButton .dijitButtonContents,
 249 .claro .dijitToolbar .dijitDropDownButton .dijitButtonContents,
 250 .claro .dijitToolbar .dijitComboButton .dijitButtonContents {
 251         font-size : 13px;
 252 }
 253
 254 button:hover,
 255 button:focus,
 256 input[type="submit"]:hover,
 257 input[type="submit"]:focus,
 258 .claro .dijitButton:hover,
 259 .claro .dijitToolbar .dijitButton:hover .dijitButtonNode,
 260 .claro .dijitToolbar .dijitButton.dijitHover .dijitButtonNode,
 261 .claro .dijitButton:focus,
 262 .claro .dijitComboButton:hover,
 263 .claro .dijitComboButton:focus {
 264   color: #333333;
 265   text-decoration: none;
 266   background-position: 0 -15px;
 267   -webkit-transition: background-position 0.1s linear;
 268   transition: background-position 0.1s linear;
 269 }
 270
 271 button:focus,
 272 input[type="submit"]:focus,
 273 .claro .dijitButton:focus,
 274 .claro .dijitComboButton:focus {
 275   outline: thin dotted #333;
 276   outline: 5px auto -webkit-focus-ring-color;
 277   outline-offset: -2px;
 278 }
 279
 280 button:active,
 281 input[type="submit"]:active,
 282 .claro .dijitButton:active,
 283 .claro .dijitComboButton:active,
 284 .claro .dijitToolbar .dijitDropDownButton.dijitOpened,
 285 .claro .dijitToolbar .dijitComboButton.dijitOpened,
 286 .claro .dijitToolbar .dijitButton.dijitButtonActive .dijitButtonNode {
 287   background-image: none;
 288   outline: 0;
 289   -webkit-box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05);
 290   box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05);
 291 }
 292
 293 input[type="submit"][disabled],
 294 button[disabled],
 295 .claro .dijitButton[disabled],
 296 .claro .dijitButton.dijitButtonDisabled,
 297 .claro .dijitComboButton.dijitButtonDisabled {
 298   cursor: default;
 299   background-image: none;
 300   opacity: 0.65;
 301   filter: alpha(opacity=65);
 302   -webkit-box-shadow: none;
 303   box-shadow: none;
 304 }
 305
 306 .claro .dijitButton .dijitButtonContents,
 307 .claro .dijitComboButton .dijitButtonContents {
 308         font-size : 14px;
 309         font-weight : normal;
 310         line-height : 20px;
 311 }
 312
 313 .claro .dijitMenu {
 314         border-color : #ccc;
 315 }
 316
 317 .claro .dijitMenu .dijitMenuItem.dijitHover,
 318 .claro .dijitMenu .dijitMenuItem.dijitFocused,
 319 .claro .dijitMenuTable .dijitMenuItem.dijitHover .dijitMenuItemLabel,
 320 .claro .dijitMenuTable .dijitMenuItem.dijitFocused .dijitMenuItemLabel {
 321         background : #eee;
 322         border-color : transparent;
 323 }
 324
 325 .claro .dijitButton .dijitButtonNode,
 326 .claro .dijitComboButton .dijitButtonNode {
 327         padding : 0px;
 328 }
 329
 330 /* Other stuff */
 331
 332 .claro .dijitAccordionTitleFocus {
 333         text-shadow : 1px 1px 2px #fff;
 334 }
 335
 336 .claro .dijitAccordionInnerContainer.dijitAccordionInnerContainerSelected {
 337         border-color : #ccc;
 338 }
 339
 340 .claro .dijitAccordionContainer .dijitAccordionChildWrapper {
 341         border-color : #ddd;
 342 }
 343
 344 /* Tabs */
 345
 346 .claro .dijitTabContent {
 347         background : #eee;
 348 }
 349
 350 .claro .dijitTabContent.dijitTabChecked,
 351 .claro .dijitTabContent.dijitTabHover,
 352 .claro .dijitTabContent.dijitFocused {
 353         background : white;
 354 }
 355
 356 .claro .dijitTabPaneWrapper,
 357 .claro .dijitTabContainerTop-tabs,
 358 .claro .dijitTab,
 359 .claro .dijitAccordionInnerContainer {
 360         border-color : #ddd;
 361 }
 362