ecomp-sdk-app/src/main/webapp/static/fusion/raptor/d3/css/nv.d3.css

   1
   2 /********************
   3  * HTML CSS
   4  */
   5
   6
   7 .chartWrap {
   8   margin: 0;
   9   padding: 0;
  10   overflow: hidden;
  11 }
  12
  13
  14 /********************
  15  * TOOLTIP CSS
  16  */
  17
  18 .nvtooltip {
  19   position: absolute;
  20   background-color: rgba(255,255,255,1);
  21   padding: 10px;
  22   border: 1px solid #ddd;
  23   z-index: 10000;
  24
  25   font-family: Arial;
  26   font-size: 13px;
  27
  28   transition: opacity 500ms linear;
  29   -moz-transition: opacity 500ms linear;
  30   -webkit-transition: opacity 500ms linear;
  31
  32   transition-delay: 500ms;
  33   -moz-transition-delay: 500ms;
  34   -webkit-transition-delay: 500ms;
  35
  36   -moz-box-shadow: 4px 4px 8px rgba(0,0,0,.5);
  37   -webkit-box-shadow: 4px 4px 8px rgba(0,0,0,.5);
  38   box-shadow: 4px 4px 8px rgba(0,0,0,.5);
  39
  40   -moz-border-radius: 10px;
  41   border-radius: 10px;
  42
  43   pointer-events: none;
  44
  45   -webkit-touch-callout: none;
  46   -webkit-user-select: none;
  47   -khtml-user-select: none;
  48   -moz-user-select: none;
  49   -ms-user-select: none;
  50   user-select: none;
  51 }
  52
  53 .nvtooltip h3 {
  54   margin: 0;
  55   padding: 0;
  56   text-align: center;
  57 }
  58
  59 .nvtooltip p {
  60   margin: 0;
  61   padding: 0;
  62   text-align: center;
  63 }
  64
  65 .nvtooltip span {
  66   display: inline-block;
  67   margin: 2px 0;
  68 }
  69
  70 .nvtooltip-pending-removal {
  71   position: absolute;
  72   pointer-events: none;
  73 }
  74
  75
  76 /********************
  77  * SVG CSS
  78  */
  79
  80
  81 svg {
  82   -webkit-touch-callout: none;
  83   -webkit-user-select: none;
  84   -khtml-user-select: none;
  85   -moz-user-select: none;
  86   -ms-user-select: none;
  87   user-select: none;
  88   /* Trying to get SVG to act like a greedy block in all browsers */
  89   display: block;
  90   width:100%;
  91   height:100%;
  92 }
  93
  94
  95 svg text {
  96   font: normal 12px Arial;
  97 }
  98
  99 svg .title {
 100  font: bold 14px Arial;
 101 }
 102
 103 .nvd3 .nv-background {
 104   fill: white;
 105   fill-opacity: 0;
 106   /*
 107   pointer-events: none;
 108   */
 109 }
 110
 111 .nvd3.nv-noData {
 112   font-size: 18px;
 113   font-weight: bolf;
 114 }
 115
 116
 117 /**********
 118 *  Brush
 119 */
 120
 121 .nv-brush .extent {
 122   fill-opacity: .125;
 123   shape-rendering: crispEdges;
 124 }
 125
 126
 127
 128 /**********
 129 *  Legend
 130 */
 131
 132 .nvd3 .nv-legend .nv-series {
 133   cursor: pointer;
 134 }
 135
 136 .nvd3 .nv-legend .disabled circle {
 137   fill-opacity: 0;
 138 }
 139
 140
 141
 142 /**********
 143 *  Axes
 144 */
 145
 146 .nvd3 .nv-axis path {
 147   fill: none;
 148   stroke: #000;
 149   stroke-opacity: .75;
 150   shape-rendering: crispEdges;
 151 }
 152
 153 .nvd3 .nv-axis path.domain {
 154   stroke-opacity: .75;
 155 }
 156
 157 .nvd3 .nv-axis.nv-x path.domain {
 158   stroke-opacity: 0;
 159 }
 160
 161 .nvd3 .nv-axis line {
 162   fill: none;
 163   stroke: #000;
 164   stroke-opacity: .25;
 165   shape-rendering: crispEdges;
 166 }
 167
 168 .nvd3 .nv-axis line.zero {
 169   stroke-opacity: .75;
 170 }
 171
 172 .nvd3 .nv-axis .nv-axisMaxMin text {
 173   font-weight: bold;
 174 }
 175
 176 .nvd3 .x  .nv-axis .nv-axisMaxMin text,
 177 .nvd3 .x2 .nv-axis .nv-axisMaxMin text,
 178 .nvd3 .x3 .nv-axis .nv-axisMaxMin text {
 179   text-anchor: middle
 180 }
 181
 182
 183
 184 /**********
 185 *  Brush
 186 */
 187
 188 .nv-brush .resize path {
 189   fill: #eee;
 190   stroke: #666;
 191 }
 192
 193
 194
 195 /**********
 196 *  Bars
 197 */
 198
 199 .nvd3 .nv-bars .negative rect {
 200     zfill: brown;
 201 }
 202
 203 .nvd3 .nv-bars rect {
 204   zfill: steelblue;
 205   fill-opacity: .75;
 206
 207   transition: fill-opacity 250ms linear;
 208   -moz-transition: fill-opacity 250ms linear;
 209   -webkit-transition: fill-opacity 250ms linear;
 210 }
 211
 212 .nvd3 .nv-bars rect:hover {
 213   fill-opacity: 1;
 214 }
 215
 216 .nvd3 .nv-bars .hover rect {
 217   fill: lightblue;
 218 }
 219
 220 .nvd3 .nv-bars text {
 221   fill: rgba(0,0,0,0);
 222 }
 223
 224 .nvd3 .nv-bars .hover text {
 225   fill: rgba(0,0,0,1);
 226 }
 227
 228
 229 /**********
 230 *  Bars
 231 */
 232
 233 .nvd3 .nv-multibar .nv-groups rect,
 234 .nvd3 .nv-multibarHorizontal .nv-groups rect,
 235 .nvd3 .nv-discretebar .nv-groups rect {
 236   stroke-opacity: 0;
 237
 238   transition: fill-opacity 250ms linear;
 239   -moz-transition: fill-opacity 250ms linear;
 240   -webkit-transition: fill-opacity 250ms linear;
 241 }
 242
 243 .nvd3 .nv-multibar .nv-groups rect:hover,
 244 .nvd3 .nv-multibarHorizontal .nv-groups rect:hover,
 245 .nvd3 .nv-discretebar .nv-groups rect:hover {
 246   fill-opacity: 1;
 247 }
 248
 249 .nvd3 .nv-discretebar .nv-groups text,
 250 .nvd3 .nv-multibarHorizontal .nv-groups text {
 251   font-weight: bold;
 252   fill: rgba(0,0,0,1);
 253   stroke: rgba(0,0,0,0);
 254 }
 255
 256 /***********
 257 *  Pie Chart
 258 */
 259
 260 .nvd3.nv-pie path {
 261   stroke-opacity: 0;
 262
 263   transition: fill-opacity 250ms linear, stroke-width 250ms linear, stroke-opacity 250ms linear;
 264   -moz-transition: fill-opacity 250ms linear, stroke-width 250ms linear, stroke-opacity 250ms linear;
 265   -webkit-transition: fill-opacity 250ms linear, stroke-width 250ms linear, stroke-opacity 250ms linear;
 266
 267 }
 268
 269 .nvd3.nv-pie .nv-slice text {
 270   stroke: #000;
 271   stroke-width: 0;
 272 }
 273
 274 .nvd3.nv-pie path {
 275   stroke: #fff;
 276   stroke-width: 1px;
 277   stroke-opacity: 1;
 278 }
 279
 280 .nvd3.nv-pie .hover path {
 281   fill-opacity: .7;
 282 /*
 283   stroke-width: 6px;
 284   stroke-opacity: 1;
 285 */
 286 }
 287
 288 .nvd3.nv-pie .nv-label rect {
 289   fill-opacity: 0;
 290   stroke-opacity: 0;
 291 }
 292
 293 /**********
 294 * Lines
 295 */
 296
 297 .nvd3 .nv-groups path.nv-line {
 298   fill: none;
 299   stroke-width: 2.5px;
 300   /*
 301   stroke-linecap: round;
 302   shape-rendering: geometricPrecision;
 303
 304   transition: stroke-width 250ms linear;
 305   -moz-transition: stroke-width 250ms linear;
 306   -webkit-transition: stroke-width 250ms linear;
 307
 308   transition-delay: 250ms
 309   -moz-transition-delay: 250ms;
 310   -webkit-transition-delay: 250ms;
 311   */
 312 }
 313
 314 .nvd3 .nv-groups path.nv-area {
 315   stroke: none;
 316   /*
 317   stroke-linecap: round;
 318   shape-rendering: geometricPrecision;
 319
 320   stroke-width: 2.5px;
 321   transition: stroke-width 250ms linear;
 322   -moz-transition: stroke-width 250ms linear;
 323   -webkit-transition: stroke-width 250ms linear;
 324
 325   transition-delay: 250ms
 326   -moz-transition-delay: 250ms;
 327   -webkit-transition-delay: 250ms;
 328   */
 329 }
 330
 331 .nvd3 .nv-line.hover path {
 332   stroke-width: 6px;
 333 }
 334
 335 /*
 336 .nvd3.scatter .groups .point {
 337   fill-opacity: 0.1;
 338   stroke-opacity: 0.1;
 339 }
 340   */
 341
 342 .nvd3.nv-line .nvd3.nv-scatter .nv-groups .nv-point {
 343   fill-opacity: 0;
 344   stroke-opacity: 0;
 345 }
 346
 347 .nvd3.nv-scatter.nv-single-point .nv-groups .nv-point {
 348   fill-opacity: .5 !important;
 349   stroke-opacity: .5 !important;
 350 }
 351
 352
 353 .nvd3 .nv-groups .nv-point {
 354   transition: stroke-width 250ms linear, stroke-opacity 250ms linear;
 355   -moz-transition: stroke-width 250ms linear, stroke-opacity 250ms linear;
 356   -webkit-transition: stroke-width 250ms linear, stroke-opacity 250ms linear;
 357 }
 358
 359 .nvd3.nv-scatter .nv-groups .nv-point.hover,
 360 .nvd3 .nv-groups .nv-point.hover {
 361   stroke-width: 20px;
 362   fill-opacity: .5 !important;
 363   stroke-opacity: .5 !important;
 364 }
 365
 366
 367 .nvd3 .nv-point-paths path {
 368   stroke: #aaa;
 369   stroke-opacity: 0;
 370   fill: #eee;
 371   fill-opacity: 0;
 372 }
 373
 374
 375
 376 .nvd3 .nv-indexLine {
 377   cursor: ew-resize;
 378 }
 379
 380
 381 /**********
 382 * Distribution
 383 */
 384
 385 .nvd3 .nv-distribution {
 386   pointer-events: none;
 387 }
 388
 389
 390
 391 /**********
 392 *  Scatter
 393 */
 394
 395 /* **Attempting to remove this for useVoronoi(false), need to see if it's required anywhere
 396 .nvd3 .nv-groups .nv-point {
 397   pointer-events: none;
 398 }
 399 */
 400
 401 .nvd3 .nv-groups .nv-point.hover {
 402   stroke-width: 20px;
 403   stroke-opacity: .5;
 404 }
 405
 406 .nvd3 .nv-scatter .nv-point.hover {
 407   fill-opacity: 1;
 408 }
 409
 410 /*
 411 .nv-group.hover .nv-point {
 412   fill-opacity: 1;
 413 }
 414 */
 415
 416
 417 /**********
 418 *  Stacked Area
 419 */
 420
 421 .nvd3.nv-stackedarea path.nv-area {
 422   fill-opacity: .7;
 423   /*
 424   stroke-opacity: .65;
 425   fill-opacity: 1;
 426   */
 427   stroke-opacity: 0;
 428
 429   transition: fill-opacity 250ms linear, stroke-opacity 250ms linear;
 430   -moz-transition: fill-opacity 250ms linear, stroke-opacity 250ms linear;
 431   -webkit-transition: fill-opacity 250ms linear, stroke-opacity 250ms linear;
 432
 433   /*
 434   transition-delay: 500ms;
 435   -moz-transition-delay: 500ms;
 436   -webkit-transition-delay: 500ms;
 437   */
 438
 439 }
 440
 441 .nvd3.nv-stackedarea path.nv-area.hover {
 442   fill-opacity: .9;
 443   /*
 444   stroke-opacity: .85;
 445   */
 446 }
 447 /*
 448 .d3stackedarea .groups path {
 449   stroke-opacity: 0;
 450 }
 451   */
 452
 453
 454
 455 .nvd3.nv-stackedarea .nv-groups .nv-point {
 456   stroke-opacity: 0;
 457   fill-opacity: 0;
 458 }
 459
 460 .nvd3.nv-stackedarea .nv-groups .nv-point.hover {
 461   stroke-width: 20px;
 462   stroke-opacity: .75;
 463   fill-opacity: 1;
 464 }
 465
 466
 467
 468 /**********
 469 *  Line Plus Bar
 470 */
 471
 472 .nvd3.nv-linePlusBar .nv-bar rect {
 473   fill-opacity: .75;
 474 }
 475
 476 .nvd3.nv-linePlusBar .nv-bar rect:hover {
 477   fill-opacity: 1;
 478 }
 479
 480
 481 /**********
 482 *  Bullet
 483 */
 484
 485 .nvd3.nv-bullet { font: 10px sans-serif; }
 486 .nvd3.nv-bullet .nv-measure { fill-opacity: .8; }
 487 .nvd3.nv-bullet .nv-measure:hover { fill-opacity: 1; }
 488 .nvd3.nv-bullet .nv-marker { stroke: #000; stroke-width: 2px; }
 489 .nvd3.nv-bullet .nv-markerTriangle { stroke: #000; fill: #fff; stroke-width: 1.5px; }
 490 .nvd3.nv-bullet .nv-tick line { stroke: #666; stroke-width: .5px; }
 491 .nvd3.nv-bullet .nv-range.nv-s0 { fill: #eee; }
 492 .nvd3.nv-bullet .nv-range.nv-s1 { fill: #ddd; }
 493 .nvd3.nv-bullet .nv-range.nv-s2 { fill: #ccc; }
 494 .nvd3.nv-bullet .nv-title { font-size: 14px; font-weight: bold; }
 495 .nvd3.nv-bullet .nv-subtitle { fill: #999; }
 496
 497
 498 .nvd3.nv-bullet .nv-range {
 499   fill: #999;
 500   fill-opacity: .4;
 501 }
 502 .nvd3.nv-bullet .nv-range:hover {
 503   fill-opacity: .7;
 504 }
 505
 506
 507
 508 /**********
 509 * Sparkline
 510 */
 511
 512 .nvd3.nv-sparkline path {
 513   fill: none;
 514 }
 515
 516 .nvd3.nv-sparklineplus g.nv-hoverValue {
 517   pointer-events: none;
 518 }
 519
 520 .nvd3.nv-sparklineplus .nv-hoverValue line {
 521   stroke: #333;
 522   stroke-width: 1.5px;
 523  }
 524
 525 .nvd3.nv-sparklineplus,
 526 .nvd3.nv-sparklineplus g {
 527   pointer-events: all;
 528 }
 529
 530 .nvd3 .nv-hoverArea {
 531   fill-opacity: 0;
 532   stroke-opacity: 0;
 533 }
 534
 535 .nvd3.nv-sparklineplus .nv-xValue,
 536 .nvd3.nv-sparklineplus .nv-yValue {
 537   /*
 538   stroke: #666;
 539   */
 540   stroke-width: 0;
 541   font-size: .9em;
 542   font-weight: normal;
 543 }
 544
 545 .nvd3.nv-sparklineplus .nv-yValue {
 546   stroke: #f66;
 547 }
 548
 549 .nvd3.nv-sparklineplus .nv-maxValue {
 550   stroke: #2ca02c;
 551   fill: #2ca02c;
 552 }
 553
 554 .nvd3.nv-sparklineplus .nv-minValue {
 555   stroke: #d62728;
 556   fill: #d62728;
 557 }
 558
 559 .nvd3.nv-sparklineplus .nv-currentValue {
 560   /*
 561   stroke: #444;
 562   fill: #000;
 563   */
 564   font-weight: bold;
 565   font-size: 1.1em;
 566 }
 567
 568 /**********
 569 * historical stock
 570 */
 571
 572 .nvd3.nv-ohlcBar .nv-ticks .nv-tick {
 573   stroke-width: 2px;
 574 }
 575
 576 .nvd3.nv-ohlcBar .nv-ticks .nv-tick.hover {
 577   stroke-width: 4px;
 578 }
 579
 580 .nvd3.nv-ohlcBar .nv-ticks .nv-tick.positive {
 581  stroke: #2ca02c;
 582 }
 583
 584 .nvd3.nv-ohlcBar .nv-ticks .nv-tick.negative {
 585  stroke: #d62728;
 586 }
 587
 588 .nvd3.nv-historicalStockChart .nv-axis .nv-axislabel {
 589   font-weight: bold;
 590 }
 591
 592 .nvd3.nv-historicalStockChart .nv-dragTarget {
 593   fill-opacity: 0;
 594   stroke: none;
 595   cursor: move;
 596 }
 597
 598 .nvd3 .nv-brush .extent {
 599   /*
 600   cursor: ew-resize !important;
 601   */
 602   fill-opacity: 0 !important;
 603 }
 604
 605 .nvd3 .nv-brushBackground rect {
 606   stroke: #000;
 607   stroke-width: .4;
 608   fill: #fff;
 609   fill-opacity: .7;
 610 }
 611
 612
 613
 614 /**********
 615 * Indented Tree
 616 */
 617
 618
 619 /**
 620  * TODO: the following 3 selectors are based on classes used in the example.  I should either make them standard and leave them here, or move to a CSS file not included in the library
 621  */
 622 .nvd3.nv-indentedtree .name {
 623   margin-left: 5px;
 624 }
 625
 626 .nvd3.nv-indentedtree .clickable {
 627   color: #08C;
 628   cursor: pointer;
 629 }
 630
 631 .nvd3.nv-indentedtree span.clickable:hover {
 632   color: #005580;
 633   text-decoration: underline;
 634 }
 635
 636
 637 .nvd3.nv-indentedtree .nv-childrenCount {
 638   display: inline-block;
 639   margin-left: 5px;
 640 }
 641
 642 .nvd3.nv-indentedtree .nv-treeicon {
 643   cursor: pointer;
 644   /*
 645   cursor: n-resize;
 646   */
 647 }
 648
 649 .nvd3.nv-indentedtree .nv-treeicon.nv-folded {
 650   cursor: pointer;
 651   /*
 652   cursor: s-resize;
 653   */
 654 }
 655
 656