UNPKG

2.74 kBCSSView Raw
1/*-- Chart --*/
2
3.c3 svg {
4 font: 10px sans-serif;
5}
6.c3 path, .c3 line {
7 fill: none;
8 stroke: #000;
9}
10.c3 text {
11 -webkit-user-select: none;
12 -moz-user-select: none;
13 user-select: none;
14}
15
16.c3-legend-item-tile,
17.c3-xgrid-focus,
18.c3-ygrid,
19.c3-event-rect,
20.c3-bars path {
21 shape-rendering: crispEdges;
22}
23
24.c3-chart-arc path {
25 stroke: #fff;
26
27}
28.c3-chart-arc text {
29 fill: #fff;
30 font-size: 13px;
31}
32
33/*-- Axis --*/
34
35.c3-axis-x .tick {
36}
37.c3-axis-x-label {
38}
39
40.c3-axis-y .tick {
41}
42.c3-axis-y-label {
43}
44
45.c3-axis-y2 .tick {
46}
47.c3-axis-y2-label {
48}
49
50/*-- Grid --*/
51
52.c3-grid line {
53 stroke: #aaa;
54}
55.c3-grid text {
56 fill: #aaa;
57}
58.c3-xgrid, .c3-ygrid {
59 stroke-dasharray: 3 3;
60}
61.c3-xgrid-focus {
62}
63
64/*-- Text on Chart --*/
65
66.c3-text {
67}
68
69.c3-text.c3-empty {
70 fill: #808080;
71 font-size: 2em;
72}
73
74/*-- Line --*/
75
76.c3-line {
77 stroke-width: 1px;
78}
79/*-- Point --*/
80
81.c3-circle._expanded_ {
82 stroke-width: 1px;
83 stroke: white;
84}
85.c3-selected-circle {
86 fill: white;
87 stroke-width: 2px;
88}
89
90/*-- Bar --*/
91
92.c3-bar {
93 stroke-width: 0;
94}
95.c3-bar._expanded_ {
96 fill-opacity: 0.75;
97}
98
99/*-- Arc --*/
100
101.c3-chart-arcs-title {
102 font-size: 1.3em;
103}
104
105/*-- Focus --*/
106
107.c3-target.c3-focused path.c3-line, .c3-target.c3-focused path.c3-step {
108 stroke-width: 2px;
109}
110
111/*-- Region --*/
112
113.c3-region {
114 fill: steelblue;
115 fill-opacity: .1;
116}
117
118/*-- Brush --*/
119
120.c3-brush .extent {
121 fill-opacity: .1;
122}
123
124/*-- Select - Drag --*/
125
126.c3-dragarea {
127}
128
129/*-- Legend --*/
130
131.c3-legend-item {
132 font-size: 12px;
133}
134
135.c3-legend-background {
136 opacity: 0.75;
137 fill: white;
138 stroke: lightgray;
139 stroke-width: 1
140}
141
142/*-- Tooltip --*/
143
144.c3-tooltip {
145 border-collapse:collapse;
146 border-spacing:0;
147 background-color:#fff;
148 empty-cells:show;
149 -webkit-box-shadow: 7px 7px 12px -9px rgb(119,119,119);
150 -moz-box-shadow: 7px 7px 12px -9px rgb(119,119,119);
151 box-shadow: 7px 7px 12px -9px rgb(119,119,119);
152 opacity: 0.9;
153}
154.c3-tooltip tr {
155 border:1px solid #CCC;
156}
157.c3-tooltip th {
158 background-color: #aaa;
159 font-size:14px;
160 padding:2px 5px;
161 text-align:left;
162 color:#FFF;
163}
164.c3-tooltip td {
165 font-size:13px;
166 padding: 3px 6px;
167 background-color:#fff;
168 border-left:1px dotted #999;
169}
170.c3-tooltip td > span {
171 display: inline-block;
172 width: 10px;
173 height: 10px;
174 margin-right: 6px;
175}
176.c3-tooltip td.value{
177 text-align: right;
178}
179
180.c3-area {
181 stroke-width: 0;
182 opacity: 0.2;
183}
184
185.c3-chart-arcs .c3-chart-arcs-background {
186 fill: #e0e0e0;
187 stroke: none;
188}
189.c3-chart-arcs .c3-chart-arcs-gauge-unit {
190 fill: #000;
191 font-size: 16px;
192}
193.c3-chart-arcs .c3-chart-arcs-gauge-max {
194 fill: #777;
195}
196.c3-chart-arcs .c3-chart-arcs-gauge-min {
197 fill: #777;
198}
199
200.c3-chart-arc .c3-gauge-value {
201 fill: #000;
202 font-size: 28px;
203}