UNPKG

@finos/perspective-viewer

Version:

The `<perspective-viewer>` Custom Element, frontend for Perspective.js

206 lines (205 loc) 8.23 kB
/****************************************************************************** * * Copyright (c) 2017, the Perspective Authors. * * This file is part of the Perspective library, distributed under the terms of * the Apache License 2.0. The full license can be found in the LICENSE file. * */ @import url("https://fonts.googleapis.com/css?family=Material+Icons"); @import url("https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400&display=swap"); @import url("https://fonts.googleapis.com/css2?family=Roboto+Mono:wght@200;400&display=swap"); @import url("https://unpkg.com/monaco-editor/esm/vs/base/browser/ui/codicons/codicon/codicon.css"); /****************************************************************************** * * Copyright (c) 2017, the Perspective Authors. * * This file is part of the Perspective library, distributed under the terms of * the Apache License 2.0. The full license can be found in the LICENSE file. * */ perspective-column-style.dark, perspective-expression-editor.dark { background-color: #2a2c2f; color: #ffffff; border: 1px solid #4c505b; --input--border-color: #4c505b; --active-color: #2770a9; --inactive-color: #4c505b; } perspective-viewer, .perspective-viewer-material-dark { background-color: #f2f4f6; font-family: "Open Sans"; --rt-pos-cell--color: #338dcd; --rt-neg-cell--color: #ff471e; --modal--class: light; --interface-monospace--font-family: "Roboto Mono"; --inactive-column-selector--content: "\E835"; --active-column-selector--content: "\E834"; --plugin--background: #ffffff; --float--column-type--color: #2670a9; --string--column-type--color: #e32b16; --date--column-type--color: #24874b; --boolean--column-type--color: #ea7319; --settings-button--content: "more_vert"; --button--font-family: "Material Icons"; --overflow_hint--before: "error_outline"; --overflow_hint--font-family: "Material Icons"; --overflow_hint--color: rgba(0, 0, 0, 0.2); --overflow_hint--padding: 0 12px 0 6px; --row_pivots--before: "Group By"; --column_pivots--before: "Split By"; --sort-order-asc--before: "arrow_upward"; --sort-order-desc--before: "arrow_downward"; --sort-order-none--before: "remove"; --close_button--before: "close"; --sort-order-col-asc--before: "arrow_forward"; --sort-order-col-desc--before: "arrow_back"; --select--background-color: none; --select--padding: 0px; --column-drop-container--background: none; --column-drop-container--padding: 0px; --column-drop-container--margin: 24px 24px 0px 0px; --column-drop-label--margin: -12px 0px 0px 0px; --column-drop-label--font-size: 10px; --column-drop-label--display: inline-block; --column-container--margin: 18px 0px 0px 0px; --column-add--font-family: "Material Icons"; --column-add--before: "add"; --column-close--font-family: "Material Icons"; --column-close--before: "close"; --column-hide--before: "expand_more"; --column_type--padding: 0px 0px 0px 0px; --column_type--width: 25px; --column-selector--font-family: "Material Icons"; --active-column-selector--height: 45px; --column_selector--width: 31px; --column_selector--font-size: 16px; --side_panel--padding: 24px 16px 24px 17px; --settings-button--padding: 24px 17px 0px 17px; --button--font-size: 16px; --top_panel--padding: 12px 0px 24px 0px; --top-panel-row--display: inline-flex; --d3fc-treedata-axis--lines: none; --d3fc-y1-label--font-family: "Material Icons"; --d3fc-y1-label--content: "arrow_upward"; --d3fc-y2-label--font-family: "Material Icons"; --d3fc-y2-label--content: "arrow_downward"; --d3fc-tooltip--background--color: rgba(155, 155, 155, 0.8); --d3fc-tooltip--color: #161616; --d3fc-tooltip--border-color: #fff; --d3fc-tooltip--box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1); --d3fc-gridline--color: #eaedef; --d3fc-axis--ticks: #161616; --d3fc-axis--lines: #c5c9d0; --d3fc-legend--background: rgba(255, 255, 255, 0.8); --d3fc-series: rgba(31, 119, 180, 0.5); --d3fc-series-1: #0366d6; --d3fc-series-2: #ff7f0e; --d3fc-series-3: #2ca02c; --d3fc-series-4: #d62728; --d3fc-series-5: #9467bd; --d3fc-series-6: #8c564b; --d3fc-series-7: #e377c2; --d3fc-series-8: #7f7f7f; --d3fc-series-9: #bcbd22; --d3fc-series-10: #17becf; --d3fc-full--gradient: linear-gradient(#4d342f 0%, #e4521b 22.5%, #feeb65 42.5%, #f0f0f0 50%, #dcedc8 57.5%, #42b3d5 67.5%, #1a237e 100%); --d3fc-positive--gradient: linear-gradient(#dcedc8 0%, #42b3d5 35%, #1a237e 100%); --d3fc-negative--gradient: linear-gradient(#feeb65 100%, #e4521b 70%, #4d342f 0%); background-color: #242526; color: white; --plugin--background: #2a2c2f; --modal-target--background: #2a2c2f; --select--background-color: #242526; --inactive--color: #4c505b; --pv-divider--color: #4c505b; --active--background: rgba(39, 113, 170, 0.5); --active--color: #2770a9; --float--column-type--color: #7dc3f0; --string--column-type--color: #ff9485; --date--column-type--color: #70c77f; --boolean--column-type--color: #fec55e; --expression--operator-color: #c5c9d0; --expression--function-color: #22a0ce; --expression--error-color: #ff8888; --input-dragover--background: linear-gradient(to top, rgbs(38, 112, 169, 0.5), transparent 50%); --monaco-theme: vs-dark; --modal--class: dark; --calendar--filter: invert(1); --scrollbar--background-color: #3b3f46; --d3fc-legend--text: #c5c9d0; --d3fc-treedata--labels: white; --d3fc-treedata--hover-highlight: white; --d3fc-axis--ticks: #c5c9d0; --d3fc-axis--lines: #61656e; --d3fc-gridline--color: #3b3f46; --d3fc-tooltip--background: #2a2c2f; --d3fc-tooltip--color: white; --d3fc-tooltip--border-color: #242526; --d3fc-legend--background: rgba(42, 44, 47, 0.8); --d3fc-series: #4778c2; --d3fc-series-1: #4778c2; --d3fc-series-2: #cc7830; --d3fc-series-3: #9e54c0; --d3fc-series-4: #339699; --d3fc-series-5: #66728f; --d3fc-series-6: #d367bd; --d3fc-series-7: #6d7c4d; --d3fc-series-8: #dd6367; --d3fc-series-9: #7868ce; --d3fc-series-10: #17a67b; --d3fc-full--gradient: linear-gradient(#dd6367 0%, #242526 50%, #3289c8 100%); --d3fc-positive--gradient: linear-gradient(#242526 0%, #3289c8 100%); --d3fc-negative--gradient: linear-gradient(#dd6367 0%, #242526 100%); --warning--color: #333; --autocomplete-select-background: #555; --autocomplete-hover-background: #444; } perspective-viewer regular-table::-webkit-scrollbar-thumb, .perspective-viewer-material-dark regular-table::-webkit-scrollbar-thumb { background-color: #e0e4e9; } perspective-viewer regular-table, .perspective-viewer-material-dark regular-table { -webkit-mask-image: linear-gradient(black, black), linear-gradient(to top, transparent 10%, black 90%), linear-gradient(to left, transparent 10%, black 90%); -webkit-mask-position: -12px -12px, bottom right, bottom right; -webkit-mask-size: 100% 100%, 12px 1000%, 1000% 12px; -webkit-mask-repeat: no-repeat; transition: -webkit-mask-position 0.3s; } perspective-viewer regular-table:hover, .perspective-viewer-material-dark regular-table:hover { -webkit-mask-position: -12px -12px, top right, bottom left; } perspective-viewer table, .perspective-viewer-material-dark table { color: white; } perspective-viewer table tr:hover, .perspective-viewer-material-dark table tr:hover { color: white; } perspective-viewer regular-table, .perspective-viewer-material-dark regular-table { --rt-pos-cell--color: #7dc3f0; --rt-neg-cell--color: #ff9485; } perspective-viewer regular-table table tbody tr td, .perspective-viewer-material-dark regular-table table tbody tr td, perspective-viewer regular-table table tbody tr th, .perspective-viewer-material-dark regular-table table tbody tr th { --rt-hover--border-color: #61656e; border-top-color: #3b3f46; } perspective-viewer regular-table::-webkit-scrollbar-thumb, .perspective-viewer-material-dark regular-table::-webkit-scrollbar-thumb { background-color: #3b3f46; } perspective-viewer tbody th:empty, .perspective-viewer-material-dark tbody th:empty { background: linear-gradient(to right, transparent 9px, #3b3f46 10px, transparent 11px); background-repeat: no-repeat; background-position: 0px -10px; }