vis.js is a dynamic, browser-based visualization library
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

142 lines
2.3 KiB

11 years ago
  1. .graph {
  2. position: relative;
  3. border: 1px solid #bfbfbf;
  4. }
  5. .graph .panel {
  6. position: absolute;
  7. }
  8. .graph .itemset {
  9. position: absolute;
  10. }
  11. .graph .item {
  12. position: absolute;
  13. color: #1A1A1A;
  14. border-color: #97B0F8;
  15. background-color: #D5DDF6;
  16. display: inline-block;
  17. }
  18. .graph .item.selected {
  19. border-color: #FFC200;
  20. background-color: #FFF785;
  21. z-index: 999;
  22. }
  23. .graph .item.cluster {
  24. /* TODO: use another color or pattern? */
  25. background: #97B0F8 url('img/cluster_bg.png');
  26. color: white;
  27. }
  28. .graph .item.cluster.point {
  29. border-color: #D5DDF6;
  30. }
  31. .graph .item.box {
  32. text-align: center;
  33. border-style: solid;
  34. border-width: 1px;
  35. border-radius: 5px;
  36. -moz-border-radius: 5px; /* For Firefox 3.6 and older */
  37. }
  38. .graph .item.point {
  39. background: none;
  40. }
  41. .graph .dot {
  42. border: 5px solid #97B0F8;
  43. position: absolute;
  44. border-radius: 5px;
  45. -moz-border-radius: 5px; /* For Firefox 3.6 and older */
  46. }
  47. .graph .item.range {
  48. overflow: hidden;
  49. border-style: solid;
  50. border-width: 1px;
  51. border-radius: 2px;
  52. -moz-border-radius: 2px; /* For Firefox 3.6 and older */
  53. }
  54. .graph .item.range .drag-left {
  55. cursor: w-resize;
  56. z-index: 1000;
  57. }
  58. .graph .item.range .drag-right {
  59. cursor: e-resize;
  60. z-index: 1000;
  61. }
  62. .graph .item.range .content {
  63. position: relative;
  64. display: inline-block;
  65. }
  66. .graph .item.line {
  67. position: absolute;
  68. width: 0;
  69. border-left-width: 1px;
  70. border-left-style: solid;
  71. z-index: -1;
  72. }
  73. .graph .item .content {
  74. margin: 5px;
  75. white-space: nowrap;
  76. overflow: hidden;
  77. }
  78. /* TODO: better css name, 'graph' is way to generic */
  79. .graph {
  80. overflow: hidden;
  81. }
  82. .graph .axis {
  83. position: relative;
  84. }
  85. .graph .axis .text {
  86. position: absolute;
  87. color: #4d4d4d;
  88. padding: 3px;
  89. white-space: nowrap;
  90. }
  91. .graph .axis .text.measure {
  92. position: absolute;
  93. padding-left: 0;
  94. padding-right: 0;
  95. margin-left: 0;
  96. margin-right: 0;
  97. visibility: hidden;
  98. }
  99. .graph .axis .grid.vertical {
  100. position: absolute;
  101. width: 0;
  102. border-right: 1px solid;
  103. }
  104. .graph .axis .grid.horizontal {
  105. position: absolute;
  106. left: 0;
  107. width: 100%;
  108. height: 0;
  109. border-bottom: 1px solid;
  110. }
  111. .graph .axis .grid.minor {
  112. border-color: #e5e5e5;
  113. }
  114. .graph .axis .grid.major {
  115. border-color: #bfbfbf;
  116. }