PluginProbe
Visualizer – Tables & Charts Manager with Built-in AI Generator / 3.11.10
Visualizer – Tables & Charts Manager with Built-in AI Generator v3.11.10
4.0.8 4.0.7 4.0.6 4.0.5 4.0.4 4.0.3 3.0.5 3.0.6 3.0.7 3.0.8 3.0.9 3.1.0 3.1.1 3.1.2 3.1.3 3.10.0 3.10.1 3.10.10 3.10.11 3.10.12 3.10.13 3.10.14 3.10.15 3.10.2 3.10.3 All 149 releases
← All changes | classes/Visualizer/Gutenberg/src/style.scss +185 -7 3.1.03.11.10 View file →
@@ -82,21 +82,25 @@
82 82
83 83 .visualizer-settings__charts-grid {
84 84 display: grid;
85 85 grid-template-columns: 50% 50%;
86 -
86 +
87 87 .visualizer-settings__charts-single {
88 88 margin: 25px;
89 89 padding-bottom: 50px;
90 90 background-color: #efefef;
91 91 position: relative;
92 -
92 +
93 93 .visualizer-settings__charts-title {
94 94 padding: 10px;
95 95 font-weight: bold;
96 96 text-align: center;
97 97 }
98 -
98 +
99 + .visualizer-settings__charts-footer {
100 + font-size: small;
101 + }
102 +
99 103 .visualizer-settings__charts-controls {
100 104 width: 100%;
101 105 position: absolute;
102 106 bottom: 0;
@@ -107,8 +111,13 @@
107 111 }
108 112 }
109 113 }
110 114
115 + .dataTables_wrapper {
116 + background: #fff;
117 + padding: 10px;
118 + }
119 +
111 120 .visualizer-no-charts {
112 121 padding-top: 25px;
113 122 }
114 123 }
@@ -114,8 +123,13 @@
114 123 }
115 124
116 125 .visualizer-settings__chart {
117 126 text-align: center;
127 +
128 + .dataTables_wrapper {
129 + background: #fff;
130 + padding: 10px;
131 + }
118 132 }
119 133
120 134 .visualizer-settings__controls {
121 135 margin: 0;
@@ -193,9 +207,9 @@
193 207 border-color: #ddd;
194 208 border-style: solid;
195 209 }
196 210 }
197 -
211 +
198 212 .components-panel__arrow {
199 213 left: 0;
200 214 transform: translateY(-50%) rotate(90deg);
201 215 }
@@ -215,9 +229,9 @@
215 229 .htRowHeaders {
216 230 height: auto !important;
217 231 width: auto !important;
218 232 }
219 -
233 +
220 234 .ht_master {
221 235 .wtHolder {
222 236 height: auto !important;
223 237 width: auto !important;
@@ -225,8 +239,133 @@
225 239 }
226 240 }
227 241 }
228 242
243 +.visualizer-json-query-modal {
244 + .components-modal__content {
245 + padding-left: 0;
246 + padding-right: 0;
247 +
248 + .components-modal__header {
249 + margin: 0;
250 + }
251 + }
252 +
253 + .components-icon-button {
254 + margin: 10px 0;
255 + }
256 +
257 + .visualizer-json-query-modal-headers-panel {
258 + padding: 0 0 1em 2.2em;
259 +
260 + .components-base-control {
261 + display: inline-block;
262 + }
263 +
264 + .visualizer-json-query-modal-field-separator {
265 + padding: 0 10px;
266 + }
267 + }
268 +
269 + .viz-editor-table {
270 + tbody {
271 + tr {
272 + &:first-child {
273 + background-color: #ececec !important;
274 + }
275 + }
276 + }
277 +
278 + tr {
279 + th {
280 + background-color: #cccccc;
281 + }
282 + }
283 +
284 + thead {
285 + tr {
286 + th {
287 + &:nth-child(n+1) {
288 + cursor: move !important;
289 + }
290 + }
291 + }
292 + }
293 + }
294 +
295 + #visualizer-json-query-table {
296 + margin-bottom: 10px;
297 + }
298 +
299 + ul {
300 + list-style: disc;
301 + margin-left: 10px;
302 + }
303 +}
304 +
305 +.visualizer-db-query-modal {
306 + .CodeMirror-scroll {
307 + overflow: hidden !important;
308 + height: 50%;
309 + margin: 0;
310 + padding: 0;
311 + }
312 +
313 + .CodeMirror-wrap {
314 + height: 200px;
315 + padding: 15px;
316 + color: #fff;
317 + background: #282923;
318 + font-size: 15px;
319 + margin-bottom: 20px;
320 +
321 + .CodeMirror-cursor {
322 + border-left: 1px solid #fff !important;
323 + }
324 +
325 + .CodeMirror-placeholder {
326 + color: #fff;
327 + }
328 +
329 + pre {
330 + color: #fff !important;
331 + }
332 +
333 + .cm-keyword {
334 + color: #f92472 !important;
335 + }
336 +
337 + .cm-comment {
338 + color: #74705d !important;
339 + }
340 +
341 + .cm-number {
342 + color: #fff !important;
343 + }
344 +
345 + .cm-string {
346 + color: #fff !important;
347 + }
348 + }
349 +
350 + ul {
351 + list-style: disc;
352 + margin-left: 10px;
353 + }
354 +
355 + .db-wizard-error {
356 + color: #f00;
357 + }
358 +
359 + .visualizer-db-query-actions {
360 + .components-button {
361 + &:first-child {
362 + margin-right: 10px;
363 + }
364 + }
365 + }
366 +}
367 +
229 368 .htContextMenu {
230 369 &:not( .htGhostTable ) {
231 370 z-index: 999999;
232 371 }
@@ -231,12 +370,34 @@
231 370 z-index: 999999;
232 371 }
233 372 }
234 373
235 -.htDatepickerHolder {
374 +.htDatepickerHolder,
375 +.CodeMirror-hints,
376 +.DTCR_clonedTable,
377 +.DTCR_pointer {
236 378 z-index: 999999 !important;
237 379 }
380 +.vz-permission-tab {
381 + select.components-select-control__input {
382 + overflow:auto !important;
383 + }
384 +}
385 +.components-panel {
386 + .components-select-control {
387 + height:auto !important;
388 + }
389 +}
390 +@media ( min-width: 768px ) {
391 + .visualizer-json-query-modal {
392 + width: 668px;
393 + }
238 394
395 + .visualizer-db-query-modal .CodeMirror-wrap {
396 + min-width: 550px;
397 + }
398 +}
399 +
239 400 @media ( max-width: 768px ) {
240 401 .visualizer-settings {
241 402
242 403 .visualizer-settings__charts {
@@ -246,5 +407,22 @@
246 407 grid-template-columns: 100%;
247 408 }
248 409 }
249 410 }
250 -}
411 +}
412 +
413 +.viz-edit-chart-new {
414 + display: flex;
415 + flex-direction: column;
416 + align-items: center;
417 + gap: 12px;
418 +
419 + p {
420 + padding: 12px;
421 + padding-left: 24px;
422 + color: #ff9901;
423 +
424 + a:hover {
425 + pointer: cursor;
426 + }
427 + }
428 +}