realchart 1.0.9 → 1.1.0

package/dist/realchart-style.css

@@ -4,7 +4,7 @@
     font-family: var(--rct-font-family);
     font-size: var(--rct-font-size);
     color: #000;
-    /* background-color: white; */
+    /* background-color: #fff; */
     /* word-break: break-all;
     word-wrap: break-word; */
     -webkit-touch-callout: default;
@@ -26,7 +26,7 @@
 }
 
 /** palette */
-.rct-root {
+:root, .rct-root {
     --color-1: #0098ff;
     --color-2: #66d0ff;
     --color-3: #ff5c35;
@@ -136,11 +136,11 @@
 .rct-control[data-theme='real'] {
 	--rct-background: #264653;
 }
-.rct-root {
+:root, .rct-root {
     --rct-font-family: AppleSDGothicNeo-Light, "HelveticaNeue", "Malgun Gothic", "맑은 고딕", sans-serif;
     --rct-font-size: 16px;
 
-    --rct-focus-stroke: black;
+    --rct-focus-stroke: #000;
     --rct-focus-stroke-width: 2px;
     --rct-text-fill: #333;
 
@@ -160,7 +160,7 @@
     --rct-axis-grid-line-stroke-width: 1px;
     --rct-axis-scrollbar-track-fill: #fdfdfd;
     --rct-axis-scrollbar-track-stroke: #aaa;
-    --rct-axis-scrollbar-thumb-fill: lightgray;
+    --rct-axis-scrollbar-thumb-fill: #d3d3d3;
     --rct-axis-scrollbar-rx: 4px;
     
     --rct-legend-background: none;
@@ -175,6 +175,9 @@
     --rct-point-label-stroke: none;
     --rct-point-label-fill: #333;
 
+    --rct-point-label-line-stroke-width: 1px;
+    --rct-point-label-line-stroke: #585;
+
     --rct-credits-fill: #777;
 
     /* polar */
@@ -184,7 +187,7 @@
 
     /* linear gauge */
     --rct-linear-gauge-background-fill: #eee;
-    --rct-linear-gauge-value-fill: green;
+    --rct-linear-gauge-value-fill: #008000;
     --rct-linear-gauge-band-tick-labels-stroke: #333;
     --rct-linear-gauge-group-label-fill: #333;
     /** bullet gauge */
@@ -203,9 +206,9 @@
     --rct-gauge-scale-tick: #555;
     --rct-gauge-scale-tick-labels-stroke: #333;
     /* clock gauge */
-    --rct-clock-gauge-face-fill: white;
+    --rct-clock-gauge-face-fill: #fff;
     --rct-clock-gauge-rim-fill: #eee;
-    --rct-clock-gauge-rim-stroke: gray;
+    --rct-clock-gauge-rim-stroke: #808080;
     --rct-clock-gauge-tick-stroke: #333;
     --rct-clock-gauge-minor-tick-stroke: #555;
     --rct-clock-gauge-tick-label-fill: #333;
@@ -215,7 +218,7 @@
     /** series navigator */
     --rct-navigator-handle-color: #0098ff; 
     --rct-navigator-handle-hover-color: #55c;
-    --rct-navigator-track-fill: lightgray;
+    --rct-navigator-track-fill: #d3d3d3;
     --rct-navigator-thumb-fill:#0098ff;
 }
 .rct-root[data-theme='dark'] {
@@ -329,13 +332,13 @@
 
 /** label */
 .rct-label-dark {
-    fill: black;
+    fill: #000;
 }
 .rct-label-light {
-    fill: white;
+    fill: #fff;
 }
 .rct-label-background {
-    fill: lightgray;
+    fill: #d3d3d3;
 }
 
 /** button */
@@ -449,7 +452,7 @@
 }
 .rct-axis-break {
     stroke: #aaa;
-    fill: white;
+    fill: #fff;
     fill-opacity: 0.9;
 }
 .rct-axis-guide-label {
@@ -545,7 +548,7 @@
 }
 
 .rct-series-trendline {
-    stroke: red;
+    stroke: #ff0000;
     stroke-width: 2px;
     stroke-linejoin: round;
     fill: none;
@@ -674,7 +677,8 @@
     opacity: 1;
 }
 .rct-point-label-lines {
-    stroke: #585;
+    stroke-width: var(--rct-point-label-line-stroke-width);
+    stroke: var(--rct-point-label-line-stroke);
     fill: none;
 }
 
@@ -685,7 +689,7 @@
 
 /** circlebar series */
 .rct-circlebar-series .rct-point {
-    stroke: white;
+    stroke: #fff;
 }
 
 /** barrange series */
@@ -762,7 +766,7 @@
     stroke-dasharray: 2;
 }
 .rct-boxplot-series .rct-point[data-hover] .rct-boxplot-point-stem {
-    stroke: black;
+    stroke: #000;
     stroke-dasharray: none;
     stroke-width: 2px;
 }
@@ -869,7 +873,7 @@
 
 /** histogram */
 .rct-histogram-series .rct-point {
-    stroke: white;
+    stroke: #fff;
 }
 
 /** vector series */
@@ -887,12 +891,12 @@
 
 /** treemap series */
 .rct-treemap-series .rct-point {
-    stroke: white;
+    stroke: #fff;
 }
 
 /** pie series */
 .rct-pie-series .rct-point {
-    stroke: white;
+    stroke: #fff;
 }
 .rct-pie-series-inner {
     font-size: 20px;
@@ -901,10 +905,10 @@
 
 /** funnel series */
 .rct-funnel-series .rct-point {
-    stroke: white;
+    stroke: #fff;
 }
 .rct-funnel-series .rct-point[data-hover] {
-    stroke: black;
+    stroke: #000;
     stroke-width: 2px;
 }
 
@@ -940,7 +944,7 @@
     font-size: 20px;
 }
 .rct-circle-gauge-pin {
-    fill: white;
+    fill: #fff;
     stroke: #333;
     stroke-width: 3px;
 }
@@ -972,7 +976,7 @@
     font-size: 1em;
 }
 .rct-clock-gauge-pin {
-    fill: white;
+    fill: #fff;
     stroke: #333;
     stroke-width: 3px;
 }
@@ -1061,10 +1065,10 @@
     opacity: 0.9;
 }
 .rct-tooltip-back {
-    fill: white;
+    fill: #fff;
 }
 .rct-tooltip-tail {
-    fill: white;
+    fill: #fff;
 }
 .rct-tooltip-text {
     fill: #333;
@@ -1111,7 +1115,7 @@
     display: none;
 }
 .rct-navigator-back {
-    fill: white;
+    fill: #fff;
     stroke: #f0f0f0;
 }
 .rct-navigator-mask {