@perspective-dev/viewer 4.4.0 → 4.5.0

package/src/themes/intl/pt.css

@@ -54,11 +54,11 @@ perspective-dropdown {
     --psp-label--copy-button--content: "cópia de";
     --psp-label--export-button--content: "Exportar";
     --psp-label--reset-button--content: "Reiniciar";
-    --psp-label--edit-mode-read-only--content: "Read Only";
-    --psp-label--edit-mode-edit--content: "Text Edit";
-    --psp-label--edit-mode-select-row--content: "Select Row";
-    --psp-label--edit-mode-select-column--content: "Select Column";
-    --psp-label--edit-mode-select-region--content: "Select Region";
+    --psp-label--edit-mode-read-only--content: "Somente leitura";
+    --psp-label--edit-mode-edit--content: "Edição de texto";
+    --psp-label--edit-mode-select-row--content: "Selecionar linha";
+    --psp-label--edit-mode-select-column--content: "Selecionar coluna";
+    --psp-label--edit-mode-select-region--content: "Selecionar região";
     --psp-label--scroll-lock-toggle--content: "Rolagem Grátis";
     --psp-label--scroll-lock-alt-toggle--content: "Alinhar rolagem";
 
@@ -70,15 +70,24 @@ perspective-dropdown {
     --psp-label--time-style--content: "Estilo de tempo";
     --psp-label--foreground--content: "Primeiro plano";
     --psp-label--background--content: "Fundo";
+    --psp-label--number-fg-mode--content: "Primeiro plano";
+    --psp-label--number-bg-mode--content: "Fundo";
+    --psp-label--pos-bg-color--content: "Fundo";
+    --psp-label--datetime-color-mode--content: "Cor";
+    --psp-label--string-color-mode--content: "Cor";
     --psp-label--series--content: "Series";
     --psp-label--color-range--content: "Gama de cores";
     --psp-label--style--content: "Estilo";
+    --psp-label--stack--content: "Empilhar";
+    --psp-label--alt-axis--content: "Eixo Alternativo";
     --psp-label--minimum-integer-digits--content: "Dígitos inteiros mínimos";
     --psp-label--rounding-increment--content: "Incremento de arredondamento";
     --psp-label--notation--content: "Notação";
     --psp-label--use-grouping--content: "Usar agrupamento";
     --psp-label--sign-display--content: "Exibição de sinalização";
     --psp-label--max-value--content: "Valor máximo";
+    --psp-label--fg-gradient--content: "Valor máximo";
+    --psp-label--bg-gradient--content: "Valor máximo";
     --psp-label--rounding-priority--content: "Prioridade de arredondamento";
     --psp-label--rounding-mode--content: "Modo de arredondamento";
     --psp-label--trailing-zero-display--content: "Exibição de zero à direita";
@@ -98,5 +107,32 @@ perspective-dropdown {
     /* Tabs */
     --psp-label--style-tab--content: "Estilo";
     --psp-label--attributes-tab--content: "Atributos";
-    --psp-label--debug-tab--content: "Debug JSON";
+    --psp-label--query-tab--content: "Consulta";
+    --psp-label--plugin-tab--content: "Plugin";
+    --psp-label--debug-tab--content: "JSON";
+
+    /* Plugin settings */
+    --psp-label--edit-mode--content: "Modo de edição";
+    --psp-label--scroll-lock--content: "Bloqueio de rolagem";
+    --psp-label--chart-type--content: "Tipo de gráfico";
+
+    /* Plugin settings — viewer-charts */
+    --psp-label--auto-alt-y-axis--content: "Eixo Y duplo automático";
+    --psp-label--facet-mode--content: "Modo de faceta";
+    --psp-label--facet-zoom-mode--content: "Zoom de faceta";
+    --psp-label--series-zoom-mode--content: "Zoom de séries";
+    --psp-label--line-width-px--content: "Largura da linha";
+    --psp-label--point-size-px--content: "Tamanho do ponto";
+    --psp-label--band-inner-frac--content: "Largura da banda";
+    --psp-label--bar-inner-pad--content: "Espaçamento das barras";
+    --psp-label--wick-width-px--content: "Largura do pavio";
+    --psp-label--ohlc-line-width-px--content: "Largura da linha OHLC";
+    --psp-label--include-zero--content: "Incluir zero";
+    --psp-label--domain-mode--content: "Modo de domínio";
+    --psp-label--gradient-color-mode--content: "Modo de cor";
+    --psp-label--gradient-radius-px--content: "Raio do gradiente";
+    --psp-label--gradient-intensity--content: "Intensidade";
+    --psp-label--gradient-heat-max--content: "Calor máximo";
+    --psp-label--map-tile-provider--content: "Provedor de mapa";
+    --psp-label--map-tile-alpha--content: "Opacidade do mapa";
 }

package/src/themes/intl/zh.css

@@ -54,11 +54,11 @@ perspective-dropdown {
     --psp-label--copy-button--content: "复制";
     --psp-label--export-button--content: "出口";
     --psp-label--reset-button--content: "重置";
-    --psp-label--edit-mode-read-only--content: "Read Only";
-    --psp-label--edit-mode-edit--content: "Text Edit";
-    --psp-label--edit-mode-select-row--content: "Select Row";
-    --psp-label--edit-mode-select-column--content: "Select Column";
-    --psp-label--edit-mode-select-region--content: "Select Region";
+    --psp-label--edit-mode-read-only--content: "只读";
+    --psp-label--edit-mode-edit--content: "文本编辑";
+    --psp-label--edit-mode-select-row--content: "选择行";
+    --psp-label--edit-mode-select-column--content: "选择列";
+    --psp-label--edit-mode-select-region--content: "选择区域";
     --psp-label--scroll-lock-toggle--content: "自由滚动";
     --psp-label--scroll-lock-alt-toggle--content: "对齐滚动";
 
@@ -70,15 +70,24 @@ perspective-dropdown {
     --psp-label--time-style--content: "时间风格";
     --psp-label--foreground--content: "前景";
     --psp-label--background--content: "背景";
+    --psp-label--number-fg-mode--content: "前景";
+    --psp-label--number-bg-mode--content: "背景";
+    --psp-label--pos-bg-color--content: "背景";
+    --psp-label--datetime-color-mode--content: "颜色";
+    --psp-label--string-color-mode--content: "颜色";
     --psp-label--series--content: "系列";
     --psp-label--color-range--content: "颜色范围";
     --psp-label--style--content: "风格";
+    --psp-label--stack--content: "堆叠";
+    --psp-label--alt-axis--content: "副轴";
     --psp-label--minimum-integer-digits--content: "最小整数位数";
     --psp-label--rounding-increment--content: "舍入增量";
     --psp-label--notation--content: "符号";
     --psp-label--use-grouping--content: "使用分组";
     --psp-label--sign-display--content: "标志展示";
     --psp-label--max-value--content: "最大值";
+    --psp-label--fg-gradient--content: "最大值";
+    --psp-label--bg-gradient--content: "最大值";
     --psp-label--rounding-priority--content: "舍入优先级";
     --psp-label--rounding-mode--content: "舍入模式";
     --psp-label--trailing-zero-display--content: "尾随零显示";
@@ -98,5 +107,32 @@ perspective-dropdown {
     /* Tabs */
     --psp-label--style-tab--content: "风格";
     --psp-label--attributes-tab--content: "属性";
-    --psp-label--debug-tab--content: "Debug JSON";
+    --psp-label--query-tab--content: "查询";
+    --psp-label--plugin-tab--content: "插件";
+    --psp-label--debug-tab--content: "JSON";
+
+    /* Plugin settings */
+    --psp-label--edit-mode--content: "编辑模式";
+    --psp-label--scroll-lock--content: "滚动锁定";
+    --psp-label--chart-type--content: "图表类型";
+
+    /* Plugin settings — viewer-charts */
+    --psp-label--auto-alt-y-axis--content: "自动双Y轴";
+    --psp-label--facet-mode--content: "分面模式";
+    --psp-label--facet-zoom-mode--content: "分面缩放";
+    --psp-label--series-zoom-mode--content: "系列缩放";
+    --psp-label--line-width-px--content: "线宽";
+    --psp-label--point-size-px--content: "点大小";
+    --psp-label--band-inner-frac--content: "带宽";
+    --psp-label--bar-inner-pad--content: "条形间距";
+    --psp-label--wick-width-px--content: "影线宽度";
+    --psp-label--ohlc-line-width-px--content: "OHLC线宽";
+    --psp-label--include-zero--content: "包含零";
+    --psp-label--domain-mode--content: "域模式";
+    --psp-label--gradient-color-mode--content: "颜色模式";
+    --psp-label--gradient-radius-px--content: "渐变半径";
+    --psp-label--gradient-intensity--content: "强度";
+    --psp-label--gradient-heat-max--content: "最大热度";
+    --psp-label--map-tile-provider--content: "地图提供商";
+    --psp-label--map-tile-alpha--content: "地图不透明度";
 }

package/src/themes/intl.css

@@ -68,18 +68,24 @@ perspective-dropdown {
     --psp-label--timezone--content: "Timezone";
     --psp-label--date-style--content: "Date Style";
     --psp-label--time-style--content: "Time Style";
-    --psp-label--foreground--content: "Foreground";
-    --psp-label--background--content: "Background";
+    --psp-label--number-fg-mode--content: "Foreground";
+    --psp-label--number-bg-mode--content: "Background";
+    --psp-label--pos-bg-color--content: "Background";
+    --psp-label--datetime-color-mode--content: "Color";
+    --psp-label--string-color-mode--content: "Color";
     --psp-label--series--content: "Series";
     --psp-label--color-range--content: "Color Range";
     --psp-label--style--content: "Style";
+    --psp-label--stack--content: "Stack";
+    --psp-label--alt-axis--content: "Alt Axis";
     --psp-label--minimum-integer-digits--content: "Minimum Integer Digits";
     --psp-label--rounding-increment--content: "Rounding Increment";
     --psp-label--notation--content: "Notation";
     --psp-label--use-grouping--content: "Use Grouping";
     --psp-label--sign-display--content: "Sign Display";
     --psp-label--aggregate-depth--content: "Aggregate Depth";
-    --psp-label--max-value--content: "Max Value";
+    --psp-label--fg-gradient--content: "Max Value";
+    --psp-label--bg-gradient--content: "Max Value";
     --psp-label--rounding-priority--content: "Rounding Priority";
     --psp-label--rounding-mode--content: "Rounding Mode";
     --psp-label--trailing-zero-display--content: "Trailing Zero Display";
@@ -98,5 +104,32 @@ perspective-dropdown {
     /* Tabs */
     --psp-label--style-tab--content: "Style";
     --psp-label--attributes-tab--content: "Attributes";
-    --psp-label--debug-tab--content: "Debug JSON";
+    --psp-label--query-tab--content: "Query";
+    --psp-label--plugin-tab--content: "Plugin";
+    --psp-label--debug-tab--content: "JSON";
+
+    /* Plugin settings */
+    --psp-label--edit-mode--content: "Edit mode";
+    --psp-label--scroll-lock--content: "Scroll lock";
+    --psp-label--chart-type--content: "Glyph type";
+
+    /* Plugin settings — viewer-charts */
+    --psp-label--auto-alt-y-axis--content: "Auto dual Y axis";
+    --psp-label--facet-mode--content: "Facet mode";
+    --psp-label--facet-zoom-mode--content: "Facet zoom";
+    --psp-label--series-zoom-mode--content: "Series zoom";
+    --psp-label--line-width-px--content: "Line width";
+    --psp-label--point-size-px--content: "Point size";
+    --psp-label--band-inner-frac--content: "Band width";
+    --psp-label--bar-inner-pad--content: "Bar padding";
+    --psp-label--wick-width-px--content: "Wick width";
+    --psp-label--ohlc-line-width-px--content: "OHLC line width";
+    --psp-label--include-zero--content: "Include zero";
+    --psp-label--domain-mode--content: "Domain mode";
+    --psp-label--gradient-color-mode--content: "Color mode";
+    --psp-label--gradient-radius-px--content: "Gradient radius";
+    --psp-label--gradient-intensity--content: "Intensity";
+    --psp-label--gradient-heat-max--content: "Heat max";
+    --psp-label--map-tile-provider--content: "Map provider";
+    --psp-label--map-tile-alpha--content: "Map opacity";
 }

package/src/themes/monokai.css

@@ -53,41 +53,33 @@ perspective-viewer[theme="Monokai"] {
     --psp-datagrid--pos-cell--color: #7dc3f0;
     --psp-datagrid--neg-cell--color: #ff9485;
 
-    /* perspective-viewer-pro-dark--d3fc (overrides) */
-    --psp-d3fc--legend--color: #c5c9d0;
-    --psp-d3fc--treemap--labels: white;
-    --psp-d3fc--treemap--hover-highlight: white;
-    --psp-d3fc--tooltip--color: white;
-    --psp-d3fc--axis-ticks--color: #c5c9d0;
-    --psp-d3fc--axis-lines--color: #61656e;
-    --psp-d3fc--gridline--color: #3b3f46;
-    --psp-d3fc--tooltip--background: rgba(42, 44, 47, 1);
-    --psp-d3fc--tooltip--border-color: #242526;
-    --psp-d3fc--legend--background: var(--psp--background-color);
-    --psp-d3fc--series--color: rgb(71, 120, 194);
-    --psp-d3fc--series-1--color: rgb(71, 120, 194);
-    --psp-d3fc--series-2--color: rgb(204, 120, 48);
-    --psp-d3fc--series-3--color: rgb(158, 84, 192);
-    --psp-d3fc--series-4--color: rgb(51, 150, 153);
-    --psp-d3fc--series-5--color: rgb(102, 114, 143);
-    --psp-d3fc--series-6--color: rgb(211, 103, 189);
-    --psp-d3fc--series-7--color: rgb(109, 124, 77);
-    --psp-d3fc--series-8--color: rgb(221, 99, 103);
-    --psp-d3fc--series-9--color: rgb(120, 104, 206);
-    --psp-d3fc--series-10--color: rgb(23, 166, 123);
-    --psp-d3fc--full-gradient--background: linear-gradient(
+    /* perspective-viewer-pro-dark--webgl (overrides) */
+    --psp-charts--legend--color: #c5c9d0;
+    --psp-charts--treemap--labels: white;
+    --psp-charts--treemap--hover-highlight: white;
+    --psp-charts--tooltip--color: white;
+    --psp-charts--axis-ticks--color: #c5c9d0;
+    --psp-charts--axis-lines--color: #61656e;
+    --psp-charts--gridline--color: #3b3f46;
+    --psp-charts--tooltip--background: rgba(42, 44, 47, 1);
+    --psp-charts--tooltip--border-color: #242526;
+    --psp-charts--legend--background: var(--psp--background-color);
+    --psp-charts--series--color: rgb(71, 120, 194);
+    --psp-charts--series-1--color: rgb(71, 120, 194);
+    --psp-charts--series-2--color: rgb(204, 120, 48);
+    --psp-charts--series-3--color: rgb(158, 84, 192);
+    --psp-charts--series-4--color: rgb(51, 150, 153);
+    --psp-charts--series-5--color: rgb(102, 114, 143);
+    --psp-charts--series-6--color: rgb(211, 103, 189);
+    --psp-charts--series-7--color: rgb(109, 124, 77);
+    --psp-charts--series-8--color: rgb(221, 99, 103);
+    --psp-charts--series-9--color: rgb(120, 104, 206);
+    --psp-charts--series-10--color: rgb(23, 166, 123);
+    --psp-charts--gradient--background: linear-gradient(
         #dd6367 0%,
         #242526 50%,
         #3289c8 100%
     );
-    --psp-d3fc--pos-gradient--background: linear-gradient(
-        #242526 0%,
-        #3289c8 100%
-    );
-    --psp-d3fc--neg-gradient--background: linear-gradient(
-        #dd6367 0%,
-        #242526 100%
-    );
 
     /* perspective-viewer-pro-dark--openlayers (overrides) */
     --psp-openlayers--tile-url: "http://{a-c}.basemaps.cartocdn.com/dark_all/{z}/{x}/{y}.png";
@@ -142,36 +134,28 @@ perspective-viewer[theme="Monokai"] {
         );
     }
 
-    /* perspective-viewer-monokai--d3fc */
-    --psp-d3fc--treemap--labels: #d6d6d6;
-    --psp-d3fc--treemap--hover-highlight: #2d2a2e;
-
-    --psp-d3fc--axis-ticks--color: #d6d6d6;
-    --psp-d3fc--gridline--color: #444444;
-    --psp-d3fc--series--color: #78dce8;
-    --psp-d3fc--series-1--color: #78dce8;
-    --psp-d3fc--series-2--color: #ff6188;
-    --psp-d3fc--series-3--color: #fc9867;
-    --psp-d3fc--series-4--color: #ffd866;
-    --psp-d3fc--series-5--color: #a9dc76;
-
-    --psp-d3fc--series-6--color: #ab9df2;
-    --psp-d3fc--series-7--color: #66d9ef;
-    --psp-d3fc--series-8--color: #f92672;
-    --psp-d3fc--series-9--color: #fd971f;
-    --psp-d3fc--series-10--color: #e6db74;
-    --psp-d3fc--series-11--color: #a6e22e;
-    --psp-d3fc--series-12--color: #ae81ff;
-
-    --psp-d3fc--neg-gradient--background: linear-gradient(
-        #272822 0%,
-        #ff6188 100%
-    );
-    --psp-d3fc--pos-gradient--background: linear-gradient(
-        #272822 0%,
-        #78dce8 100%
-    );
-    --psp-d3fc--full-gradient--background: linear-gradient(
+    /* perspective-viewer-monokai--webgl */
+    --psp-charts--treemap--labels: #d6d6d6;
+    --psp-charts--treemap--hover-highlight: #2d2a2e;
+
+    --psp-charts--axis-ticks--color: #d6d6d6;
+    --psp-charts--gridline--color: #444444;
+    --psp-charts--series--color: #78dce8;
+    --psp-charts--series-1--color: #78dce8;
+    --psp-charts--series-2--color: #ff6188;
+    --psp-charts--series-3--color: #fc9867;
+    --psp-charts--series-4--color: #ffd866;
+    --psp-charts--series-5--color: #a9dc76;
+
+    --psp-charts--series-6--color: #ab9df2;
+    --psp-charts--series-7--color: #66d9ef;
+    --psp-charts--series-8--color: #f92672;
+    --psp-charts--series-9--color: #fd971f;
+    --psp-charts--series-10--color: #e6db74;
+    --psp-charts--series-11--color: #a6e22e;
+    --psp-charts--series-12--color: #ae81ff;
+
+    --psp-charts--gradient--background: linear-gradient(
         #ff6188 0%,
         #272822 50%,
         #78dce8 100%

package/src/themes/phosphor.css

@@ -0,0 +1,175 @@
+/* ┏━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┓
+ * ┃ ██████ ██████ ██████       █      █      █      █      █ █▄  ▀███ █       ┃
+ * ┃ ▄▄▄▄▄█ █▄▄▄▄▄ ▄▄▄▄▄█  ▀▀▀▀▀█▀▀▀▀▀ █ ▀▀▀▀▀█ ████████▌▐███ ███▄  ▀█ █ ▀▀▀▀▀ ┃
+ * ┃ █▀▀▀▀▀ █▀▀▀▀▀ █▀██▀▀ ▄▄▄▄▄ █ ▄▄▄▄▄█ ▄▄▄▄▄█ ████████▌▐███ █████▄   █ ▄▄▄▄▄ ┃
+ * ┃ █      ██████ █  ▀█▄       █ ██████      █      ███▌▐███ ███████▄ █       ┃
+ * ┣━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┫
+ * ┃ Copyright (c) 2017, the Perspective Authors.                              ┃
+ * ┃ ╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌ ┃
+ * ┃ This file is part of the Perspective library, distributed under the terms ┃
+ * ┃ of the [Apache License 2.0](https://www.apache.org/licenses/LICENSE-2.0). ┃
+ * ┗━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┛ */
+
+@import "./defaults.css";
+
+perspective-viewer,
+perspective-viewer[theme="Phosphor"] {
+    --psp-theme-name: "Phosphor";
+}
+
+perspective-viewer[theme="Phosphor"] {
+    /* perspective-viewer-phosphor--colors */
+    --theme-bg0: #0a0a0a;
+    --theme-bg1: #0d0d0d;
+    --theme-bg2: #1a1a1a;
+
+    --theme-green-bright: #00ff41;
+    --theme-green-mid: #20cc20;
+    --theme-green-dim: #0d660d;
+    --theme-green-dark: #0a3a0a;
+    --theme-amber: #ffb000;
+    --theme-red: #ff3333;
+
+    color: var(--theme-green-mid);
+    background-color: var(--theme-bg0);
+    --psp--color: var(--theme-green-mid);
+    --psp-active--color: var(--theme-green-bright);
+    --psp-error--color: var(--theme-red);
+    --psp-inactive--color: var(--theme-green-dark);
+    --psp-inactive--border-color: var(--theme-green-dark);
+    --psp--background-color: var(--theme-bg1);
+    --psp-active--background: rgba(51, 255, 51, 0.3);
+    --psp-expression--operator--color: var(--theme-green-dim);
+    --psp-expression--function--color: var(--theme-green-bright);
+    --psp-expression--psp-error--color: var(--theme-red);
+    --psp-calendar--filter: invert(1) hue-rotate(70deg);
+    --psp-warning--color: var(--theme-bg0);
+    --psp-warning--background: var(--theme-amber);
+
+    --psp-icon--select-arrow--mask-image: var(
+        --psp-icon--select-arrow-light--mask-image
+    );
+
+    --psp-icon--select-arrow-hover--mask-image: var(
+        --psp-icon--select-arrow-dark--mask-image
+    );
+
+    /* Syntax */
+    --psp-code-editor--symbol--color: var(--theme-green-mid);
+    --psp-code-editor--literal--color: var(--theme-green-bright);
+    --psp-code-editor--operator--color: var(--theme-amber);
+    --psp-code-editor--comment--color: var(--theme-green-dark);
+    --psp-code-editor--column--color: var(--theme-green-bright);
+
+    --psp-status-icon--connected--color: var(--theme-green-bright);
+    --psp-status-icon--initializing--color: var(--theme-amber);
+    --psp-status-icon--psp-error--color: var(--theme-red);
+
+    /* perspective-viewer-phosphor--animation */
+    --psp-status-icon--updating-keyframes-start--filter: opacity(1);
+    --psp-status-icon--updating-keyframes-end--filter: opacity(0);
+    --psp-status-icon--updating-keyframes-start--transform: scale(1);
+    --psp-status-icon--updating-keyframes-end--transform: scale(0.8);
+    --psp-status-icon--keyframes-start--transform: scale(1.1);
+    --psp-status-icon--keyframes-end--transform: scale(1);
+
+    /* perspective-viewer-phosphor--datagrid */
+    --psp-datagrid--pos-cell--color: var(--theme-green-bright);
+    --psp-datagrid--neg-cell--color: var(--theme-red);
+
+    /* perspective-viewer-phosphor--webgl */
+    --psp-charts--legend--color: var(--theme-green-mid);
+    --psp-charts--treemap--labels: var(--theme-green-mid);
+    --psp-charts--treemap--hover-highlight: #ff6600;
+    --psp-charts--tooltip--color: var(--theme-green-mid);
+    --psp-charts--axis-ticks--color: var(--theme-green-mid);
+    --psp-charts--axis-lines--color: var(--theme-green-dim);
+    --psp-charts--gridline--color: var(--theme-green-dark);
+    --psp-charts--tooltip--background: var(--theme-green-dark);
+    --psp-charts--tooltip--border-color: var(--theme-green-bright);
+    --psp-charts--legend--background: var(--psp--background-color);
+
+    --psp-charts--series--color: #00ff41;
+    --psp-charts--series-1--color: #00ff41;
+    --psp-charts--series-2--color: #00bfff;
+    --psp-charts--series-3--color: #ff0055;
+    --psp-charts--series-4--color: #ffd700;
+    --psp-charts--series-5--color: #7fffd4;
+
+    --psp-charts--gradient--background: linear-gradient(
+        #ff3333 0%,
+        #1a1a2e 50%,
+        #00cc66 100%
+    );
+
+    /* OpenLayers */
+    --psp-openlayers--tile-url: "http://{a-c}.basemaps.cartocdn.com/dark_all/{z}/{x}/{y}.png";
+    --psp-openlayers--attribution--filter: invert(1) hue-rotate(180deg);
+    --psp-openlayers--element--background: #1a1a2e;
+    --psp-openlayers--category-1--color: #ff6600;
+    --psp-openlayers--category-2--color: #33ccff;
+    --psp-openlayers--category-3--color: #00cc66;
+    --psp-openlayers--category-4--color: #ffcc00;
+    --psp-openlayers--category-5--color: #ff3333;
+    --psp-openlayers--category-6--color: #cc66ff;
+    --psp-openlayers--category-7--color: #ff9933;
+    --psp-openlayers--category-8--color: #66ffcc;
+    --psp-openlayers--category-9--color: #ff6699;
+    --psp-openlayers--category-10--color: #99ccff;
+    --psp-openlayers--gradient--background: linear-gradient(
+        #ff3333 0%,
+        #1a1a2e 50%,
+        #00cc66 100%
+    );
+}
+
+perspective-copy-menu[theme="Phosphor"],
+perspective-export-menu[theme="Phosphor"],
+perspective-dropdown[theme="Phosphor"],
+perspective-date-column-style[theme="Phosphor"],
+perspective-datetime-column-style[theme="Phosphor"],
+perspective-number-column-style[theme="Phosphor"],
+perspective-string-column-style[theme="Phosphor"] {
+    /* perspective-viewer-phosphor--colors */
+    --theme-bg0: #0a0a0a;
+    --theme-bg1: #0d0d0d;
+    --theme-bg2: #1a1a1a;
+    --theme-green-bright: #33ff33;
+    --theme-green-mid: #20cc20;
+    --theme-green-dim: #0d660d;
+    --theme-green-dark: #0a3a0a;
+    --theme-amber: #ffb000;
+    --theme-red: #ff3333;
+
+    color: var(--theme-green-mid);
+    --psp--color: var(--theme-green-mid);
+    --psp-active--color: var(--theme-green-bright);
+    --psp-error--color: var(--theme-red);
+    --psp-inactive--color: var(--theme-green-dark);
+    --psp-inactive--border-color: var(--theme-green-dark);
+    --psp--background-color: var(--theme-bg1);
+    --psp-active--background: rgba(51, 255, 51, 0.3);
+    --psp-expression--operator--color: var(--theme-green-dim);
+    --psp-expression--function--color: var(--theme-green-bright);
+    --psp-expression--psp-error--color: var(--theme-red);
+    --psp-calendar--filter: invert(1) hue-rotate(70deg);
+    --psp-warning--color: var(--theme-bg0);
+    --psp-warning--background: var(--theme-amber);
+    --psp-icon--select-arrow--mask-image: var(
+        --psp-icon--select-arrow-light--mask-image
+    );
+    --psp-icon--select-arrow-hover--mask-image: var(
+        --psp-icon--select-arrow-dark--mask-image
+    );
+    --psp-code-editor--symbol--color: var(--theme-green-mid);
+    --psp-code-editor--literal--color: var(--theme-green-bright);
+    --psp-code-editor--operator--color: var(--theme-amber);
+    --psp-code-editor--comment--color: var(--theme-green-dark);
+    --psp-code-editor--column--color: var(--theme-green-bright);
+    --psp-status-icon--connected--color: var(--theme-green-bright);
+    --psp-status-icon--initializing--color: var(--theme-amber);
+    --psp-status-icon--psp-error--color: var(--theme-red);
+
+    background-color: #0a0a0a;
+    border: 1px solid #1a3a1a;
+}

package/src/themes/pro-dark.css

@@ -55,45 +55,36 @@ perspective-viewer[theme="Pro Dark"] {
     --psp-datagrid--pos-cell--color: #7dc3f0;
     --psp-datagrid--neg-cell--color: #ff9485;
 
-    /* perspective-viewer-pro-dark--d3fc (overrides) */
-    --psp-d3fc--legend--color: #c5c9d0;
-    --psp-d3fc--treemap--labels: white;
-    --psp-d3fc--treemap--hover-highlight: white;
-    --psp-d3fc--tooltip--color: white;
-    --psp-d3fc--axis-ticks--color: #c5c9d0;
-    --psp-d3fc--axis-lines--color: #61656e;
-    --psp-d3fc--gridline--color: #3b3f46;
-    --psp-d3fc--tooltip--background: rgba(42, 44, 47, 1);
-    --psp-d3fc--tooltip--border-color: #242526;
-    --psp-d3fc--legend--background: var(--psp--background-color);
-
-    --psp-d3fc--series--color: rgb(71, 120, 194);
-    --psp-d3fc--series-1--color: rgb(71, 120, 194);
-    --psp-d3fc--series-2--color: rgb(204, 120, 48);
-    --psp-d3fc--series-3--color: rgb(158, 84, 192);
-    --psp-d3fc--series-4--color: rgb(51, 150, 153);
-    --psp-d3fc--series-5--color: rgb(102, 114, 143);
-    --psp-d3fc--series-6--color: rgb(211, 103, 189);
-    --psp-d3fc--series-7--color: rgb(109, 124, 77);
-    --psp-d3fc--series-8--color: rgb(221, 99, 103);
-    --psp-d3fc--series-9--color: rgb(120, 104, 206);
-    --psp-d3fc--series-10--color: rgb(23, 166, 123);
-
-    --psp-d3fc--full-gradient--background: linear-gradient(
+    /* perspective-viewer-pro-dark--webgl (overrides) */
+    --psp-charts--legend--color: #c5c9d0;
+    --psp-charts--treemap--labels: white;
+    --psp-charts--treemap--hover-highlight: white;
+    --psp-charts--tooltip--color: white;
+    --psp-charts--axis-ticks--color: #c5c9d0;
+    --psp-charts--axis-lines--color: #61656e;
+    --psp-charts--gridline--color: #3b3f46;
+    --psp-charts--tooltip--background: rgba(42, 44, 47, 1);
+    --psp-charts--tooltip--border-color: #242526;
+    --psp-charts--legend--background: var(--psp--background-color);
+
+    --psp-charts--series--color: rgb(71, 120, 194);
+    --psp-charts--series-1--color: rgb(71, 120, 194);
+    --psp-charts--series-2--color: rgb(204, 120, 48);
+    --psp-charts--series-3--color: rgb(158, 84, 192);
+    --psp-charts--series-4--color: rgb(51, 150, 153);
+    --psp-charts--series-5--color: rgb(102, 114, 143);
+    --psp-charts--series-6--color: rgb(211, 103, 189);
+    --psp-charts--series-7--color: rgb(109, 124, 77);
+    --psp-charts--series-8--color: rgb(221, 99, 103);
+    --psp-charts--series-9--color: rgb(120, 104, 206);
+    --psp-charts--series-10--color: rgb(23, 166, 123);
+
+    --psp-charts--gradient--background: linear-gradient(
         #dd6367 0%,
         #242526 50%,
         #3289c8 100%
     );
 
-    --psp-d3fc--pos-gradient--background: linear-gradient(
-        #242526 0%,
-        #3289c8 100%
-    );
-    --psp-d3fc--neg-gradient--background: linear-gradient(
-        #dd6367 0%,
-        #242526 100%
-    );
-
     /* perspective-viewer-pro-dark--openlayers (overrides) */
     --psp-openlayers--tile-url: "http://{a-c}.basemaps.cartocdn.com/dark_all/{z}/{x}/{y}.png";
     --psp-openlayers--attribution--filter: invert(1) hue-rotate(180deg);

package/src/themes/solarized-dark.css

@@ -38,29 +38,19 @@ perspective-viewer[theme="Solarized Dark"] {
     --psp-datagrid--hover--border-color: #ccc;
     --psp-datagrid--border-color: #93a1a1;
 
-    /* perspective-viewer-solarized--d3fc */
-    --psp-d3fc--treemap--labels: black;
-    --psp-d3fc--treemap--hover-highlight: black;
-    --psp-d3fc--axis-ticks--color: #586e75;
-    --psp-d3fc--gridline--color: #eee8d5;
-    --psp-d3fc--series--color: #268bd2;
-    --psp-d3fc--series-1--color: #268bd2;
-    --psp-d3fc--series-2--color: #cb4b16;
-    --psp-d3fc--series-3--color: #b58900;
-    --psp-d3fc--series-4--color: #859900;
-    --psp-d3fc--series-5--color: #2aa198;
-    --psp-d3fc--series-6--color: #6c71c4;
-    --psp-d3fc--series-7--color: #d33682;
-    --psp-d3fc--pos-gradient--background: linear-gradient(
-        #268bd2 0%,
-        #2aa198,
-        #859900,
-        #b58900,
-        #cb4b16,
-        #dc322f,
-        #d33682 100%
-    );
-
+    /* perspective-viewer-solarized--webgl */
+    --psp-charts--treemap--labels: black;
+    --psp-charts--treemap--hover-highlight: black;
+    --psp-charts--axis-ticks--color: #586e75;
+    --psp-charts--gridline--color: #eee8d5;
+    --psp-charts--series--color: #268bd2;
+    --psp-charts--series-1--color: #268bd2;
+    --psp-charts--series-2--color: #cb4b16;
+    --psp-charts--series-3--color: #b58900;
+    --psp-charts--series-4--color: #859900;
+    --psp-charts--series-5--color: #2aa198;
+    --psp-charts--series-6--color: #6c71c4;
+    --psp-charts--series-7--color: #d33682;
     /* perspective-viewer-solarized-dark--colors */
     color: #93a1a1;
     background-color: #002b36;
@@ -77,24 +67,19 @@ perspective-viewer[theme="Solarized Dark"] {
         --psp-icon--select-arrow-dark--mask-image
     );
 
-    /* perspective-viewer-solarized-dark--d3fc */
-    --psp-d3fc--treemap--labels: white;
-    --psp-d3fc--treemap--hover-highlight: white;
-    --psp-d3fc--axis-ticks--color: #93a1a1;
-    --psp-d3fc--axis-lines--color: #93a1a1;
-    --psp-d3fc--gridline--color: #002b36;
-    --psp-d3fc--legend--color: #93a1a1;
+    /* perspective-viewer-solarized-dark--webgl */
+    --psp-charts--treemap--labels: white;
+    --psp-charts--treemap--hover-highlight: white;
+    --psp-charts--axis-ticks--color: #93a1a1;
+    --psp-charts--axis-lines--color: #93a1a1;
+    --psp-charts--gridline--color: #002b36;
+    --psp-charts--legend--color: #93a1a1;
 
-    --psp-d3fc--full-gradient--background: linear-gradient(
+    --psp-charts--gradient--background: linear-gradient(
         #cb4b16 0%,
         #073642 50%,
         #268bd2 100%
     );
-
-    --psp-d3fc--neg-gradient--background: linear-gradient(
-        #cb4b16 0%,
-        #073642 100%
-    );
 }
 
 perspective-copy-menu[theme="Solarized Dark"],