perspective-viewer 4.4.0

A data visualization and analytics component, especially well-suited for large and/or streaming datasets.
Documentation
/* ┏━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┓
 * ┃ ██████ ██████ ██████       █      █      █      █      █ █▄  ▀███ █       ┃
 * ┃ ▄▄▄▄▄█ █▄▄▄▄▄ ▄▄▄▄▄█  ▀▀▀▀▀█▀▀▀▀▀ █ ▀▀▀▀▀█ ████████▌▐███ ███▄  ▀█ █ ▀▀▀▀▀ ┃
 * ┃ █▀▀▀▀▀ █▀▀▀▀▀ █▀██▀▀ ▄▄▄▄▄ █ ▄▄▄▄▄█ ▄▄▄▄▄█ ████████▌▐███ █████▄   █ ▄▄▄▄▄ ┃
 * ┃ █      ██████ █  ▀█▄       █ ██████      █      ███▌▐███ ███████▄ █       ┃
 * ┣━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┫
 * ┃ 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="Gruvbox Light"] {
    --psp-theme-name: "Gruvbox Light";
}

perspective-viewer[theme="Gruvbox Light"] {
    /* perspective-viewer-gruvbox-light--colors */
    --theme-fg0: #282828;
    --theme-fg1: #3c3836;
    --theme-fg2: #7c6f64;

    --theme-gray: #928374;

    --theme-bg0: #fbf1c7;
    --theme-bg1: #ebdbb2;
    --theme-bg2: #a89984;

    --theme-red: #cc241d;
    --theme-green: #98871a;
    --theme-yellow: #d79921;
    --theme-blue: #458588;
    --theme-purple: #b16286;
    --theme-aqua: #689d5a;
    --theme-orange: #d65d0e;

    --theme-alt-red: #9d0006;
    --theme-alt-green: #79740e;
    --theme-alt-yellow: #b57614;
    --theme-alt-blue: #076678;
    --theme-alt-purple: #8f3f71;
    --theme-alt-aqua: #427b58;
    --theme-alt-orange: #af3a03;

    color: var(--theme-fg1);
    background-color: var(--theme-bg1);
    --psp--color: var(--theme-fg0);
    --psp-inactive--color: var(--theme-fg2);
    --psp-inactive--border-color: var(--theme-bg2);
    --psp--background-color: var(--theme-bg0);
    --psp-status-icon--connected--color: var(--theme-aqua);
    --psp-status-icon--initializing--color: var(--theme-yellow);
    --psp-status-icon--psp-error--color: var(--theme-red);

    /* perspective-viewer-gruvbox-light--datagrid */
    --psp-datagrid--pos-cell--color: var(--theme-blue);
    --psp-datagrid--neg-cell--color: var(--theme-red);

    /* perspective-viewer-gruvbox-light--d3fc */
    --psp-d3fc--axis-ticks--color: var(--theme-fg1);
    --psp-d3fc--gridline--color: var(--theme-bg2);
    --psp-d3fc--series--color: var(--theme-blue);
    --psp-d3fc--series-1--color: var(--theme-blue);
    --psp-d3fc--series-2--color: var(--theme-red);
    --psp-d3fc--series-3--color: var(--theme-green);
    --psp-d3fc--series-4--color: var(--theme-purple);
    --psp-d3fc--series-5--color: var(--theme-aqua);
    --psp-d3fc--series-6--color: var(--theme-alt-blue);
    --psp-d3fc--series-7--color: var(--theme-alt-red);
    --psp-d3fc--series-8--color: var(--theme-alt-green);
    --psp-d3fc--series-9--color: var(--theme-alt-purple);
    --psp-d3fc--series-10--color: var(--theme-alt-aqua);

    --psp-d3fc--neg-gradient--background: linear-gradient(
        var(--theme-bg1),
        var(--theme-red),
        var(--theme-alt-red)
    ) !important;

    --psp-d3fc--pos-gradient--background: linear-gradient(
        var(--theme-bg1),
        var(--theme-blue),
        var(--theme-alt-blue)
    ) !important;

    --psp-d3fc--full-gradient--background: linear-gradient(
        var(--theme-alt-red),
        var(--theme-red),
        var(--theme-bg1),
        var(--theme-blue),
        var(--theme-alt-blue)
    ) !important;
}

perspective-copy-menu[theme="Gruvbox Light"],
perspective-export-menu[theme="Gruvbox Light"],
perspective-dropdown[theme="Gruvbox Light"] {
    /* perspective-viewer-gruvbox-light--colors */
    --theme-fg0: #282828;
    --theme-fg1: #3c3836;
    --theme-fg2: #7c6f64;
    --theme-gray: #928374;
    --theme-bg0: #fbf1c7;
    --theme-bg1: #ebdbb2;
    --theme-bg2: #a89984;
    --theme-red: #cc241d;
    --theme-green: #98871a;
    --theme-yellow: #d79921;
    --theme-blue: #458588;
    --theme-purple: #b16286;
    --theme-aqua: #689d5a;
    --theme-orange: #d65d0e;
    --theme-alt-red: #9d0006;
    --theme-alt-green: #79740e;
    --theme-alt-yellow: #b57614;
    --theme-alt-blue: #076678;
    --theme-alt-purple: #8f3f71;
    --theme-alt-aqua: #427b58;
    --theme-alt-orange: #af3a03;

    color: var(--theme-fg1);
    --psp--color: var(--theme-fg0);
    --psp-inactive--color: var(--theme-fg2);
    --psp-inactive--border-color: var(--theme-bg2);
    --psp--background-color: var(--theme-bg0);
    --psp-status-icon--connected--color: var(--theme-aqua);
    --psp-status-icon--initializing--color: var(--theme-yellow);
    --psp-status-icon--psp-error--color: var(--theme-red);

    background-color: var(--theme-bg0);
}