Use CSS for styling
[dygraphs.git] / css / dygraph.css
CommitLineData
f0e47200
DV
1/**
2 * Default styles for the dygraphs charting library.
3 */
4
5.dygraph-legend {
6 position: absolute;
7 font-size: 14px;
8 z-index: 10;
9 width: 250px; /* labelsDivWidth */
10 /*
11 dygraphs determines these based on the presence of chart labels.
12 It might make more sense to create a wrapper div around the chart proper.
13 top: 0px;
14 right: 2px;
15 */
16 background: white;
17 line-height: normal;
18 text-align: left;
19 overflow: hidden;
20}
21
22/* styles for a solid line in the legend */
23.dygraph-legend-line {
24 display: inline-block;
25 position: relative;
26 bottom: .5ex;
27 padding-left: 1em;
28 height: 1px;
29 border-bottom-width: 2px;
30 border-bottom-style: solid;
31 /* border-bottom-color is set based on the series color */
32}
33
34/* styles for a dashed line in the legend, e.g. when strokePattern is set */
35.dygraph-legend-dash {
36 display: inline-block;
37 position: relative;
38 bottom: .5ex;
39 height: 1px;
40 border-bottom-width: 2px;
41 border-bottom-style: solid;
42 /* border-bottom-color is set based on the series color */
43 /* margin-right is set based on the stroke pattern */
44 /* padding-left is set based on the stroke pattern */
45}
46
47.dygraph-roller {
48 position: absolute;
49 z-index: 10;
50}
51
52/* This class is shared by all annotations, including those with icons */
53.dygraph-annotation {
54 position: absolute;
55 z-index: 10;
56 overflow: hidden;
57}
58
59/* This class only applies to annotations without icons */
60/* Old class name: .dygraphDefaultAnnotation */
61.dygraph-default-annotation {
62 border: 1px solid black;
63 background-color: white;
64 text-align: center;
65}
66
67.dygraph-axis-label {
68 /* position: absolute; */
69 /* font-size: 14px; */
70 z-index: 10;
71 line-height: normal;
72 overflow: hidden;
73 color: black; /* replaces old axisLabelColor option */
74}
75
76.dygraph-axis-label-x {
77}
78
79.dygraph-axis-label-y {
80}
81
82.dygraph-axis-label-y2 {
83}
84
85.dygraph-title {
86 font-weight: bold;
87 z-index: 10;
88 text-align: center;
89 /* font-size: based on titleHeight option */
90}
91
92.dygraph-xlabel {
93 text-align: center;
94 /* font-size: based on xLabelHeight option */
95}
96
97/* For y-axis label */
98.dygraph-label-rotate-left {
99 text-align: center;
100 /* See http://caniuse.com/#feat=transforms2d */
101 transform: rotate(90deg);
102 -webkit-transform: rotate(90deg);
103 -moz-transform: rotate(90deg);
104 -o-transform: rotate(90deg);
105 -ms-transform: rotate(90deg);
106}
107
108/* For y2-axis label */
109.dygraph-label-rotate-right {
110 text-align: center;
111 /* See http://caniuse.com/#feat=transforms2d */
112 transform: rotate(-90deg);
113 -webkit-transform: rotate(-90deg);
114 -moz-transform: rotate(-90deg);
115 -o-transform: rotate(-90deg);
116 -ms-transform: rotate(-90deg);
117}