70 lines
962 B
SCSS
70 lines
962 B
SCSS
.chart.line-chart {
|
|
display: block;
|
|
height: 100%;
|
|
|
|
svg {
|
|
display: block;
|
|
height: 100%;
|
|
width: 100%;
|
|
overflow: visible;
|
|
}
|
|
|
|
.canvas {
|
|
.line {
|
|
fill: transparent;
|
|
stroke-width: 1.25;
|
|
}
|
|
|
|
.hover-target {
|
|
fill: transparent;
|
|
stroke: transparent;
|
|
}
|
|
}
|
|
|
|
.axis {
|
|
line,
|
|
path {
|
|
stroke: $grey-blue;
|
|
}
|
|
|
|
text {
|
|
fill: darken($grey-blue, 20%);
|
|
}
|
|
}
|
|
|
|
.gridlines {
|
|
path {
|
|
stroke-width: 0;
|
|
}
|
|
|
|
line {
|
|
stroke: lighten($grey-blue, 10%);
|
|
stroke-dasharray: 5 10;
|
|
}
|
|
}
|
|
|
|
@each $name, $pair in $colors {
|
|
$color: nth($pair, 1);
|
|
|
|
.canvas.is-#{$name} {
|
|
.line {
|
|
stroke: $color;
|
|
}
|
|
}
|
|
|
|
linearGradient {
|
|
&.is-#{$name} {
|
|
> .start {
|
|
stop-color: $color;
|
|
stop-opacity: 0.6;
|
|
}
|
|
|
|
> .end {
|
|
stop-color: $color;
|
|
stop-opacity: 0.05;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|