UNPKG

4.05 kBCSSView Raw
1/*!
2 * Copyright (c) 2017 ~ present NAVER Corp.
3 * billboard.js project is licensed under the MIT license
4 *
5 * billboard.js, JavaScript chart library
6 * http://naver.github.io/billboard.js/
7 *
8 * @version 1.9.5
9 */
10/*-- Chart --*/
11.bb svg {
12 font: 10px sans-serif;
13 -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }
14
15.bb path, .bb line {
16 fill: none;
17 stroke: #000; }
18
19.bb text, .bb .bb-button {
20 -webkit-user-select: none;
21 -moz-user-select: none;
22 user-select: none; }
23
24.bb-legend-item-tile,
25.bb-xgrid-focus,
26.bb-ygrid,
27.bb-event-rect,
28.bb-bars path {
29 shape-rendering: crispEdges; }
30
31.bb-chart-arc path {
32 stroke: #fff; }
33
34.bb-chart-arc text {
35 fill: #fff;
36 font-size: 13px; }
37
38/*-- Axis --*/
39.bb-axis {
40 shape-rendering: crispEdges; }
41
42/*-- Grid --*/
43.bb-grid line {
44 stroke: #aaa; }
45
46.bb-grid text {
47 fill: #aaa; }
48
49.bb-xgrid, .bb-ygrid {
50 stroke-dasharray: 3 3; }
51
52/*-- Text on Chart --*/
53.bb-text.bb-empty {
54 fill: #808080;
55 font-size: 2em; }
56
57/*-- Line --*/
58.bb-line {
59 stroke-width: 1px; }
60
61/*-- Point --*/
62.bb-circle._expanded_ {
63 stroke-width: 1px;
64 stroke: white; }
65
66.bb-selected-circle {
67 fill: white;
68 stroke-width: 2px; }
69
70/*-- Bar --*/
71.bb-bar {
72 stroke-width: 0; }
73 .bb-bar._expanded_ {
74 fill-opacity: 0.75; }
75
76/*-- Focus --*/
77.bb-target.bb-focused {
78 opacity: 1; }
79
80.bb-target.bb-focused path.bb-line, .bb-target.bb-focused path.bb-step {
81 stroke-width: 2px; }
82
83.bb-target.bb-defocused {
84 opacity: 0.3 !important; }
85
86/*-- Region --*/
87.bb-region {
88 fill: steelblue;
89 fill-opacity: .1; }
90
91/*-- Zoom region --*/
92.bb-zoom-brush {
93 fill-opacity: .1; }
94
95/*-- Brush --*/
96.bb-brush .extent {
97 fill-opacity: .1; }
98
99/*-- Select - Drag --*/
100/*-- Legend --*/
101.bb-legend-item {
102 font-size: 12px;
103 user-select: none; }
104
105.bb-legend-item-hidden {
106 opacity: 0.15; }
107
108.bb-legend-background {
109 opacity: 0.75;
110 fill: white;
111 stroke: lightgray;
112 stroke-width: 1; }
113
114/*-- Title --*/
115.bb-title {
116 font: 14px sans-serif; }
117
118/*-- Tooltip --*/
119.bb-tooltip-container {
120 z-index: 10; }
121
122.bb-tooltip {
123 border-collapse: collapse;
124 border-spacing: 0;
125 background-color: #fff;
126 empty-cells: show;
127 opacity: 0.9;
128 -webkit-box-shadow: 7px 7px 12px -9px #777777;
129 -moz-box-shadow: 7px 7px 12px -9px #777777;
130 box-shadow: 7px 7px 12px -9px #777777; }
131 .bb-tooltip tr {
132 border: 1px solid #CCC; }
133 .bb-tooltip th {
134 background-color: #aaa;
135 font-size: 14px;
136 padding: 2px 5px;
137 text-align: left;
138 color: #FFF; }
139 .bb-tooltip td {
140 font-size: 13px;
141 padding: 3px 6px;
142 background-color: #fff;
143 border-left: 1px dotted #999; }
144 .bb-tooltip td > span, .bb-tooltip td > svg {
145 display: inline-block;
146 width: 10px;
147 height: 10px;
148 margin-right: 6px; }
149 .bb-tooltip.value {
150 text-align: right; }
151
152/*-- Area --*/
153.bb-area {
154 stroke-width: 0;
155 opacity: 0.2; }
156
157/*-- Arc --*/
158.bb-chart-arcs-title {
159 dominant-baseline: middle;
160 font-size: 1.3em; }
161
162.bb-chart-arcs-gauge-title {
163 dominant-baseline: middle;
164 font-size: 2.7em; }
165
166.bb-chart-arcs .bb-chart-arcs-background {
167 fill: #e0e0e0;
168 stroke: none; }
169
170.bb-chart-arcs .bb-chart-arcs-gauge-unit {
171 fill: #000;
172 font-size: 16px; }
173
174.bb-chart-arcs .bb-chart-arcs-gauge-max {
175 fill: #777; }
176
177.bb-chart-arcs .bb-chart-arcs-gauge-min {
178 fill: #777; }
179
180.bb-chart-arc .bb-gauge-value {
181 fill: #000; }
182
183/*-- Radar --*/
184.bb-chart-radars .bb-levels polygon {
185 fill: none;
186 stroke: #848282;
187 stroke-width: .5px; }
188
189.bb-chart-radars .bb-levels text {
190 fill: #848282; }
191
192.bb-chart-radars .bb-axis line {
193 stroke: #848282;
194 stroke-width: .5px; }
195
196.bb-chart-radars .bb-axis text {
197 font-size: 1.15em;
198 cursor: default; }
199
200.bb-chart-radars .bb-shapes polygon {
201 fill-opacity: .2;
202 stroke-width: 1px; }
203
204/*-- Button --*/
205.bb-button {
206 position: absolute;
207 top: 10px;
208 right: 10px; }
209 .bb-button .bb-zoom-reset {
210 font-size: 11px;
211 border: solid 1px #ccc;
212 background-color: #fff;
213 padding: 5px;
214 border-radius: 5px;
215 cursor: pointer; }
216
217
218/*# sourceMappingURL=billboard.css.map*/
\No newline at end of file