UNPKG

9.27 kBCSSView Raw
1/******************************************************************************
2 *
3 * Copyright (c) 2017, the Perspective Authors.
4 *
5 * This file is part of the Perspective library, distributed under the terms of
6 * the Apache License 2.0. The full license can be found in the LICENSE file.
7 *
8 */
9@import url("https://fonts.googleapis.com/css?family=Material+Icons");
10@import url("https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400&display=swap");
11@import url("https://fonts.googleapis.com/css2?family=Roboto+Mono:wght@200;400&display=swap");
12@import url("https://unpkg.com/monaco-editor/esm/vs/base/browser/ui/codicons/codicon/codicon.css");
13.perspective-viewer-material-dense-base {
14 --side_panel--padding: 12px 12px 12px 10px;
15 --top_panel--padding: 0px 0px 12px 0px;
16 --column-drop-label--margin: -10px 0px 0px 0px;
17 --column-drop-container--margin: 12px 12px 0px 0px;
18 --column-container--margin: 6px 0px 0px 0px;
19 --row_draggable--animation: none;
20 --button--padding: 12px 9px;
21 --active-column--height: 45px;
22 --column-drop-label--font-size: 8px;
23 --column_selector--width: 24px;
24}
25perspective-column-style,
26perspective-expression-editor {
27 background-color: #2A2C2F;
28 color: #FFFFFF;
29 border: 1px solid #3B3F46;
30 --input--border-color: #3B3F46;
31 --active-color: #2770a9;
32 --inactive-color: #3B3F46;
33}
34perspective-viewer,
35.perspective-viewer-material-dense-dark {
36 background-color: #F2F4F6;
37 font-family: "Open Sans";
38 --rt-pos-cell--color: #338DCD;
39 --rt-neg-cell--color: #ff471e;
40 --interface--font-family: "Open Sans";
41 --interface-monospace--font-family: "Roboto Mono";
42 --inactive-column-selector--content: "\E835";
43 --active-column-selector--content: "\E834";
44 --column--background: #F2F4F6;
45 --plugin--background: #FFFFFF;
46 --column--height: 21px;
47 --active-column--height: 51px;
48 --inactive-column--height: 24px;
49 --active-columns--justify-content: space-evenly;
50 --inactive-column--opacity: 0.3;
51 --null--background: rgba(0, 0, 0, 0.02);
52 --null--box-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, 0.1);
53 --float--column-type--color: #2670A9;
54 --string--column-type--color: #E32B16;
55 --settings-button--content: "more_vert";
56 --button--font-family: "Material Icons";
57 --overflow_hint--before: "error_outline";
58 --overflow_hint--font-family: "Material Icons";
59 --overflow_hint--color: rgba(0, 0, 0, 0.2);
60 --overflow_hint--padding: 0 12px 0 6px;
61 --row_draggable-last-child-border-color: transparent;
62 --row_pivots--before: "Group By";
63 --column_pivots--before: "Split By";
64 --sort-order-asc--before: "arrow_upward";
65 --sort-order-desc--before: "arrow_downward";
66 --sort-order-none--before: "remove";
67 --close_button--before: "close";
68 --sort-order-col-asc--before: "arrow_back";
69 --sort-order-col-desc--before: "arrow_forward";
70 --select--background-color: none;
71 --select--padding: 0px;
72 --column-drop-container--background: none;
73 --column-drop-container--padding: 0px;
74 --column-drop-container--margin: 24px 24px 0px 0px;
75 --column-drop-label--margin: -12px 0px 0px 0px;
76 --column-drop-label--font-size: 10px;
77 --column-drop-label--display: inline-block;
78 --column-container--margin: 18px 0px 0px 0px;
79 --column-add--font-family: "Material Icons";
80 --column-add--before: "add";
81 --column-close--font-family: "Material Icons";
82 --column-close--before: "close";
83 --column-hide--before: "expand_more";
84 --column_type--padding: 0px 0px 0px 0px;
85 --column_type--width: 25px;
86 --column-selector--font-family: "Material Icons";
87 --active-column-selector--height: 45px;
88 --column_selector--width: 31px;
89 --column_selector--font-size: 16px;
90 --side_panel--padding: 24px 16px 24px 17px;
91 --button--padding: 24px 17px 0px 17px;
92 --button--font-size: 16px;
93 --top_panel--padding: 0px 0px 24px 0px;
94 --top-panel-row--display: inline-flex;
95 --d3fc-treedata-axis--lines: none;
96 --d3fc-y1-label--font-family: "Material Icons";
97 --d3fc-y1-label--content: "arrow_upward";
98 --d3fc-y2-label--font-family: "Material Icons";
99 --d3fc-y2-label--content: "arrow_downward";
100 --d3fc-tooltip--background--color: rgba(155, 155, 155, 0.8);
101 --d3fc-tooltip--color: #161616;
102 --d3fc-tooltip--border-color: #fff;
103 --d3fc-tooltip--box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
104 --d3fc-gridline--color: #eaedef;
105 --d3fc-axis--ticks: #161616;
106 --d3fc-axis--lines: #C5C9D0;
107 --d3fc-legend--background: rgba(255, 255, 255, 0.8);
108 background-color: #242526;
109 color: white;
110 --background-color: #242526;
111 --column--background: #242526;
112 --null--background: rgba(0, 0, 0, 0.08);
113 --color: white;
114 --plugin--background: #2A2C2F;
115 --select--background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDIwLjAuMCwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPgo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IgoJIHZpZXdCb3g9IjAgMCA0LjkgMTAiIHN0eWxlPSJlbmFibGUtYmFja2dyb3VuZDpuZXcgMCAwIDQuOSAxMDsiIHhtbDpzcGFjZT0icHJlc2VydmUiPgo8c3R5bGUgdHlwZT0idGV4dC9jc3MiPgoJLnN0MHtmaWxsOiM0NDQ0NDQ7fQo8L3N0eWxlPgo8dGl0bGU+YXJyb3dzPC90aXRsZT4KPHBvbHlnb24gY2xhc3M9InN0MCIgcG9pbnRzPSIxLjQsNC43IDIuNSwzLjIgMy41LDQuNyAiLz4KPHBvbHlnb24gY2xhc3M9InN0MCIgcG9pbnRzPSIzLjUsNS4zIDIuNSw2LjggMS40LDUuMyAiLz4KPC9zdmc+Cg==) no-repeat 95% 50%;
116 --select--background-color: #242526;
117 --inactive--color: #3B3F46;
118 --pv-divider--color: #3B3F46;
119 --active--background: rgba(39, 113, 170, 0.5);
120 --active--color: #2770a9;
121 --float--column-type--color: #7DC3F0;
122 --string--column-type--color: #FF9485;
123 --expression--operator-color: #C5C9D0;
124 --expression--function-color: #22a0ce;
125 --expression--error-color: #ff8888;
126 --input-dragover--background: linear-gradient(to top, rgbs(38, 112, 169, 0.5), transparent 50%);
127 --monaco-theme: vs-dark;
128 --scrollbar--background-color: #3B3F46;
129 --d3fc-legend--text: #C5C9D0;
130 --d3fc-treedata--labels: white;
131 --d3fc-treedata--hover-highlight: white;
132 --d3fc-axis--ticks: #C5C9D0;
133 --d3fc-axis--lines: #61656E;
134 --d3fc-gridline--color: #3B3F46;
135 --d3fc-tooltip--background: #2a2c2f;
136 --d3fc-tooltip--color: white;
137 --d3fc-tooltip--border-color: #242526;
138 --d3fc-legend--background: rgba(42, 44, 47, 0.8);
139 --d3fc-series: #4778c2;
140 --d3fc-series-1: #4778c2;
141 --d3fc-series-2: #cc7830;
142 --d3fc-series-3: #9e54c0;
143 --d3fc-series-4: #339699;
144 --d3fc-series-5: #66728f;
145 --d3fc-series-6: #d367bd;
146 --d3fc-series-7: #6d7c4d;
147 --d3fc-series-8: #dd6367;
148 --d3fc-series-9: #7868ce;
149 --d3fc-series-10: #17a67b;
150 --d3fc-full--gradient: linear-gradient(#dd6367 0%, #242526 50%, #3289c8 100%);
151 --d3fc-positive--gradient: linear-gradient(#242526 0%, #3289c8 100%);
152 --d3fc-negative--gradient: linear-gradient(#dd6367 0%, #242526 100%);
153 --warning--color: #333;
154 --autocomplete-select-background: #555;
155 --autocomplete-hover-background: #444;
156 --side_panel--padding: 12px 12px 12px 10px;
157 --top_panel--padding: 0px 0px 12px 0px;
158 --column-drop-label--margin: -10px 0px 0px 0px;
159 --column-drop-container--margin: 12px 12px 0px 0px;
160 --column-container--margin: 6px 0px 0px 0px;
161 --row_draggable--animation: none;
162 --button--padding: 12px 9px;
163 --active-column--height: 45px;
164 --column-drop-label--font-size: 8px;
165 --column_selector--width: 24px;
166}
167perspective-viewer regular-table::-webkit-scrollbar-thumb,
168.perspective-viewer-material-dense-dark regular-table::-webkit-scrollbar-thumb {
169 background-color: #E0E4E9;
170}
171perspective-viewer regular-table,
172.perspective-viewer-material-dense-dark regular-table {
173 -webkit-mask-image: linear-gradient(black, black), linear-gradient(to top, transparent 10%, black 90%), linear-gradient(to left, transparent 10%, black 90%);
174 -webkit-mask-position: -12px -12px, bottom right, bottom right;
175 -webkit-mask-size: 100% 100%, 12px 1000%, 1000% 12px;
176 -webkit-mask-repeat: no-repeat;
177 transition: -webkit-mask-position 0.3s;
178}
179perspective-viewer regular-table:hover,
180.perspective-viewer-material-dense-dark regular-table:hover {
181 -webkit-mask-position: -12px -12px, top right, bottom left;
182}
183perspective-viewer table,
184.perspective-viewer-material-dense-dark table {
185 color: white;
186}
187perspective-viewer table tr:hover,
188.perspective-viewer-material-dense-dark table tr:hover {
189 color: white;
190}
191perspective-viewer regular-table,
192.perspective-viewer-material-dense-dark regular-table {
193 --rt-pos-cell--color: #7DC3F0;
194 --rt-neg-cell--color: #FF9485;
195}
196perspective-viewer regular-table table tbody tr td,
197.perspective-viewer-material-dense-dark regular-table table tbody tr td,
198perspective-viewer regular-table table tbody tr th,
199.perspective-viewer-material-dense-dark regular-table table tbody tr th {
200 --rt-hover--border-color: #61656E;
201 border-top-color: #3B3F46;
202}
203perspective-viewer regular-table::-webkit-scrollbar-thumb,
204.perspective-viewer-material-dense-dark regular-table::-webkit-scrollbar-thumb {
205 background-color: #3B3F46;
206}
207perspective-viewer tbody th:empty,
208.perspective-viewer-material-dense-dark tbody th:empty {
209 background: linear-gradient(to right, transparent 9px, #3B3F46 10px, transparent 11px);
210 background-repeat: no-repeat;
211 background-position: 0px -10px;
212}