chart.css 5.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235
  1. .dot {
  2. display: inline-block;
  3. width: 6px;
  4. height: 6px;
  5. vertical-align: middle;
  6. border-radius: 50%; }
  7. .card {
  8. margin-bottom: 30px;
  9. height: calc(100% - 30px); }
  10. .ct-chart .ct-label.ct-vertical, .ct-chart .ct-label.ct-horizontal {
  11. font-size: 14px;
  12. color: #a3afb7; }
  13. .ct-chart .ct-label.ct-horizontal {
  14. text-align: center; }
  15. #chartThreeLinearea .ct-chart .ct-area {
  16. fill-opacity: 1; }
  17. #chartThreeLinearea .ct-chart .ct-series.ct-series-a .ct-area {
  18. fill: #ff4c52; }
  19. #chartThreeLinearea .ct-chart .ct-series.ct-series-b .ct-area {
  20. fill: #eb6709; }
  21. #chartThreeLinearea .ct-chart .ct-series.ct-series-c .ct-area {
  22. fill: #11c26d; }
  23. #chartLinePie .chart-line .ct-line, #chartLinePie .chart-line .ct-point {
  24. stroke: white; }
  25. #chartLinePie .chart-line .ct-line {
  26. stroke-width: 2px; }
  27. #chartLinePie .chart-line .ct-point {
  28. stroke-width: 6px; }
  29. #chartLinePie .chart-pie .ct-series.ct-series-a .ct-slice-donut {
  30. stroke: #0bb2d4; }
  31. #chartLinePie .chart-pie .ct-series.ct-series-b .ct-slice-donut {
  32. stroke: #ff4c52; }
  33. #chartBarPie .chart-bar .ct-bar {
  34. stroke: #79b2fc;
  35. stroke-width: 3%; }
  36. #chartBarPie .chart-pie .ct-series.ct-series-a .ct-slice-donut {
  37. stroke: #9463f7; }
  38. #chartBarPie .chart-pie .ct-series.ct-series-b .ct-slice-donut {
  39. stroke: #3e8ef7; }
  40. #chartBarStacked .ct-chart .ct-bar {
  41. stroke-width: 4%; }
  42. #chartBarStacked .ct-chart .ct-series.ct-series-a .ct-bar {
  43. stroke: #3e8ef7; }
  44. #chartBarStacked .ct-chart .ct-series.ct-series-b .ct-bar {
  45. stroke: #9463f7; }
  46. #chartBarStacked .ct-chart .ct-series.ct-series-c .ct-bar {
  47. stroke: #ccd5db; }
  48. #chartPie .ct-chart .ct-series.ct-series-a .ct-slice-donut {
  49. stroke: #9463f7; }
  50. #chartPie .ct-chart .ct-series.ct-series-b .ct-slice-donut {
  51. stroke: #ff4c52; }
  52. #chartPie .ct-chart .ct-series.ct-series-c .ct-slice-donut {
  53. stroke: #3e8ef7; }
  54. #chartBarSimple .ct-chart .ct-bar {
  55. stroke: #3e8ef7;
  56. stroke-width: 2%; }
  57. #chartLineareaSimple .ct-chart .ct-line {
  58. stroke-width: 1px;
  59. stroke: #ffa1a4; }
  60. #chartLineareaSimple .ct-chart .ct-area {
  61. fill: #ffbfc1; }
  62. #chartLineareaWithfooter .ct-chart .ct-area {
  63. fill: #247cf0; }
  64. #chartLineareaWithfooter .ct-chart .ct-line {
  65. stroke-width: 1px;
  66. stroke: #79b2fc; }
  67. #chartBarWithfooter .ct-chart .ct-series.ct-series-a .ct-bar {
  68. stroke: #ff4c52;
  69. stroke-width: 2%; }
  70. #chartBarWithfooter .ct-chart .ct-series.ct-series-b .ct-bar {
  71. stroke: #e4eaec;
  72. stroke-width: 2%; }
  73. #chartLinebarLarge .chart-line .ct-line {
  74. stroke: #3e8ef7;
  75. stroke-width: 2px; }
  76. #chartLinebarLarge .chart-line .ct-label.ct-horizontal {
  77. margin-left: -20px; }
  78. #chartLinebarLarge .chart-bar .ct-bar {
  79. stroke: #0bb2d4;
  80. stroke-width: 5%; }
  81. #chartLineTime .chart-line .ct-line {
  82. stroke: #f3f7f9;
  83. stroke-width: 2px; }
  84. #chartLineTime .ct-chart {
  85. position: relative; }
  86. #chartLineTime .chart-pie-left .ct-series.ct-series-a .ct-slice-donut {
  87. stroke: #3e8ef7; }
  88. #chartLineTime .chart-pie-left .ct-series.ct-series-b .ct-slice-donut {
  89. stroke: #e4eaec; }
  90. #chartLineTime .chart-pie-right .ct-series.ct-series-a .ct-slice-donut {
  91. stroke: #ff4c52; }
  92. #chartLineTime .chart-pie-right .ct-series.ct-series-b .ct-slice-donut {
  93. stroke: #e4eaec; }
  94. #chartBarlineMix .chart-bar {
  95. position: relative; }
  96. #chartBarlineMix .chart-bar .ct-bar {
  97. stroke: #fab06b;
  98. stroke-width: 2%; }
  99. #chartBarlineMix .chart-line {
  100. width: 100%;
  101. position: absolute;
  102. top: 0;
  103. left: 0; }
  104. #chartBarlineMix .chart-line .ct-line {
  105. stroke: white;
  106. stroke-width: 2px; }
  107. #chartBarlineMixTwo .small-bar-one, #chartBarlineMixTwo .small-bar-two {
  108. display: inline-block;
  109. width: 80px;
  110. height: 45px;
  111. vertical-align: top; }
  112. #chartBarlineMixTwo .small-bar-one .ct-bar, #chartBarlineMixTwo .small-bar-two .ct-bar {
  113. stroke-width: 4px; }
  114. #chartBarlineMixTwo .small-bar-one .ct-bar {
  115. stroke: #11c26d; }
  116. #chartBarlineMixTwo .small-bar-two .ct-bar {
  117. stroke: #3e8ef7; }
  118. #chartBarlineMixTwo .line-chart .ct-series.ct-series-a .ct-line {
  119. stroke: #3e8ef7;
  120. stroke-width: 2px; }
  121. #chartBarlineMixTwo .line-chart .ct-series.ct-series-b .ct-line {
  122. stroke: #11c26d;
  123. stroke-width: 2px; }
  124. #chartBarlineMixTwo .line-chart .ct-labels > foreignObject:first-child .ct-label.ct-horizontal {
  125. margin-left: 0px; }
  126. #chartBarlineMixTwo .line-chart .ct-label.ct-vertical {
  127. text-align: left; }
  128. #chartBarlineMixTwo .line-chart .ct-label.ct-horizontal {
  129. margin-left: -20px; }
  130. #charLineareaTwo .ct-chart .ct-label.ct-vertical, #charLineareaTwo .ct-chart .ct-label.ct-horizontal {
  131. font-size: 14px; }
  132. #charLineareaTwo .ct-chart .ct-area {
  133. fill-opacity: 1; }
  134. #charLineareaTwo .ct-chart .ct-series.ct-series-a .ct-area {
  135. fill: #b8d7ff; }
  136. #charLineareaTwo .ct-chart .ct-series.ct-series-b .ct-area {
  137. fill: #92f0e6; }
  138. #chartLinepoint .header {
  139. border-bottom: 1px solid #e4eaec; }
  140. #chartLinepoint .badge {
  141. padding: 8px 12px; }
  142. #chartLinepoint .ct-chart .ct-line, #chartLinepoint .ct-chart .ct-point {
  143. stroke: #3e8ef7; }
  144. #chartLinepoint .ct-chart .ct-line {
  145. stroke-width: 2px; }
  146. #chartLinepoint .ct-chart .ct-point {
  147. stroke-width: 6px; }
  148. #chartTimelineTwo ul li {
  149. border-bottom: 1px solid #e4eaec; }
  150. #chartTimelineTwo .ct-chart .ct-area {
  151. fill-opacity: 1; }
  152. #chartTimelineTwo .ct-chart .ct-series.ct-series-a .ct-area {
  153. fill: #e4eaec; }
  154. #chartTimelineTwo .ct-chart .ct-series.ct-series-b .ct-area {
  155. fill: #3e8ef7; }
  156. #chartStackedBar .ct-chart .ct-label.ct-vertical, #chartStackedBar .ct-chart .ct-label.ct-horizontal {
  157. font-size: 14px; }
  158. #chartStackedBar .ct-chart .ct-label.ct-horizontal {
  159. text-align: center; }
  160. #chartStackedBar .ct-chart .ct-bar {
  161. stroke-width: 3%; }
  162. #chartStackedBar .ct-chart .ct-series.ct-series-a .ct-bar {
  163. stroke: #3e8ef7; }
  164. #chartStackedBar .ct-chart .ct-series.ct-series-b .ct-bar {
  165. stroke: #f3f7f9; }
  166. @media screen and (max-width: 595px) {
  167. #chartBarlineMixTwo .counter-label {
  168. font-size: 10px; } }