ProgressBar.css 1.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657
  1. /* ProgressBar
  2. *
  3. * Styling of the ProgressBar consists of the following:
  4. *
  5. * 1. the base progress bar
  6. * .dijitProgressBar - sets margins for the progress bar
  7. *
  8. * 2. the empty bar
  9. * .dijitProgressBarEmpty - sets background img and color for bar or parts of bar that are not finished yet
  10. * Also sets border color for whole bar
  11. *
  12. * 3. tile mode
  13. * .dijitProgressBarTile
  14. * inner container for finished portion when in 'tile' (image) mode
  15. *
  16. * 4. full bar mode
  17. * .dijitProgressBarFull
  18. * adds border to right side of the filled portion of bar
  19. *
  20. * 5. text for label of bar
  21. * .dijitProgressBarLabel - sets text color, which must contrast with both the "Empty" and "Full" parts.
  22. *
  23. * 6. indeterminate mode
  24. * .dijitProgressBarIndeterminate .dijitProgressBarTile
  25. * sets animated gif for the progress bar in 'indeterminate' mode
  26. */
  27. .claro .dijitProgressBar {
  28. margin: 2px 0 2px 0;
  29. }
  30. .claro .dijitProgressBarEmpty {
  31. /* outer container and background of the bar that's not finished yet*/
  32. background: #ffffff url("images/progressBarEmpty.png") repeat-none left;
  33. border-color: #769dc0;
  34. }
  35. .claro .dijitProgressBarTile {
  36. /* inner container for finished portion when in 'tile' (image) mode */
  37. background: #abd6ff url("images/progressBarFull.png") repeat-x top;
  38. }
  39. .dj_ie6 .claro .dijitProgressBarTile {
  40. background-image: none;
  41. }
  42. .claro .dijitProgressBarFull {
  43. border-right: 1px solid #769dc0;
  44. }
  45. .claro .dijitProgressBarLabel {
  46. /* Set to a color that contrasts with both the "Empty" and "Full" parts. */
  47. color: #000000;
  48. }
  49. .claro .dijitProgressBarIndeterminate .dijitProgressBarTile {
  50. /* use an animated gif for the progress bar in 'indeterminate' mode;
  51. background-color won't appear unless user has turned off background images */
  52. background: #efefef url("images/progressBarAnim.gif") repeat-x top;
  53. }