PluginProbe
Visualizer – Tables & Charts Manager with Built-in AI Generator / 3.3.4
Visualizer – Tables & Charts Manager with Built-in AI Generator v3.3.4
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 3.10.4 All 148 releases
← All changes | css/frame.css +110 -510 4.0.43.3.4 View file →
@@ -16,31 +16,9 @@
16 16 right: 310px;
17 17 bottom: 10px;
18 18 left: 10px;
19 19 }
20 -#control_wrapper_canvas:not(:empty) {
21 - margin: 15px 0 0 5px;
22 - position: relative;
23 - z-index: 1;
24 -}
25 -#control_wrapper_canvas:not(:empty) + #canvas .google-visualization-table {
26 - top: 60px;
27 -}
28 -.vz-vertical .google-visualization-table {
29 - left: 70px;
30 -}
31 -.google-visualization-controls-categoryfilter label.google-visualization-controls-label {
32 - vertical-align: middle;
33 -}
34 -.google-visualization-controls-categoryfilter li.goog-inline-block {
35 - margin: 0 0.2em;
36 -}
37 -.google-visualization-controls-categoryfilter li {
38 - padding: 0 0.2em;
39 -}
40 -.goog-combobox input {
41 - min-height: auto;
42 -}
20 +
43 21 .loader {
44 22 position: absolute;
45 23 top: 50%;
46 24 left: 50%;
@@ -52,19 +30,19 @@
52 30 /******************************** SIDEBAR ***********************************/
53 31 /******************************************************************************/
54 32
55 33 #sidebar {
56 - overflow-x: hidden;
57 - overflow-y: auto;
34 + overflow: auto;
58 35 position: absolute;
59 - z-index: 80;
36 + z-index: 75;
60 37 top: 0;
61 38 right: 0;
62 39 bottom: 60px;
63 - width: 350px;
64 - border-left: 1px solid #ddd;
65 - background: #f8f9fa;
66 - overscroll-behavior: contain;
40 + width: 299px;
41 + border-left: 1px solid #dfdfdf;
42 + background: whitesmoke;
43 +
44 + -webkit-overflow-scrolling: touch;
67 45 }
68 46
69 47 .viz-group {
70 48 margin: 0;
@@ -82,13 +60,13 @@
82 60 background: #fff;
83 61 }
84 62
85 63 .viz-group-wrapper ul .viz-group-title {
86 - border-top: 1px solid #e5e5e5;
64 + border-top: 1px solid #ddd;
87 65 }
88 66
89 67 .viz-group-wrapper ul li {
90 - border-top: 1px solid #e5e5e5;
68 + border-top: 1px solid #ddd;
91 69 }
92 70
93 71 .viz-group-wrapper ul ul li.viz-subsection {
94 72 margin: 5px;
@@ -97,19 +75,19 @@
97 75
98 76 .viz-group-wrapper .viz-group .viz-group .viz-group-title {
99 77 position: relative;
100 78 margin: 0;
101 - padding: 12px 36px 12px 16px;
79 + padding: 10px 10px 11px 14px;
102 80 border-top: none;
103 81 border-bottom: none;
104 - border-left: 4px solid transparent;
82 + border-left: 4px solid #fff;
105 83 color: #555d66;
106 84 background-color: #fff;
107 - font-size: 13px;
85 + font-size: 14px;
108 86 font-weight: 600;
109 - line-height: 1.4;
87 + line-height: 21px;
110 88 cursor: pointer;
111 - transition: 0.15s color ease-in-out, 0.15s background-color ease-in-out, 0.15s border-color ease-in-out;
89 + transition: 0.15s color ease-in-out,0.15s background-color ease-in-out,0.15s border-color ease-in-out;
112 90 }
113 91
114 92 .viz-title-small {
115 93 font-size: smaller;
@@ -124,15 +102,13 @@
124 102
125 103 .viz-group-wrapper .viz-group .viz-group .viz-group-title:after {
126 104 position: absolute;
127 105 z-index: 1;
128 - top: 50%;
129 - right: 12px;
130 - transform: translateY(-50%);
131 - color: inherit;
132 - font: 400 18px/1 dashicons;
106 + top: 11px;
107 + right: 10px;
108 + color: #a0a5aa;
109 + font: 400 20px/1 dashicons;
133 110 content: "\f345";
134 - opacity: 0.6;
135 111 }
136 112
137 113 .viz-group-wrapper .viz-group .viz-group.open .viz-group-title:after {
138 114 content: "\f347";
@@ -175,17 +151,15 @@
175 151 position: relative;
176 152 width: 100%;
177 153 height: 100%;
178 154 margin: 0;
179 - padding-bottom: 60px;
180 155 }
181 156
182 -.viz-group.bottom-fixed {
157 +.viz-group.bottom-fixed {
183 158 display: block;
184 - position: fixed;
185 - width: 350px;
186 - padding: 12px;
187 - margin: 0 auto;
159 + position: absolute;
160 + bottom: 0;
161 + width: 100%;
188 162 }
189 163
190 164 .viz-group ul li h2,
191 165 .viz-group ul li h3 {
@@ -201,9 +175,9 @@
201 175 .viz-group-content {
202 176 display: none;
203 177 margin: 0;
204 178 padding: 0;
205 - background-color: #fff;
179 + background-color: #fdfdfd;
206 180 }
207 181
208 182 div.viz-group-content {
209 183 padding: 15px;
@@ -236,46 +210,39 @@
236 210
237 211 .viz-section-title {
238 212 display: block;
239 213 position: relative;
240 - margin-bottom: 0;
241 - padding: 10px 36px 10px 16px;
242 - border-top: 1px solid #e5e5e5;
243 - border-left: 3px solid transparent;
244 - background-color: #f8f9fa;
245 - font-size: 12px;
246 - font-weight: 600;
247 - color: #555d66;
248 - text-transform: uppercase;
249 - letter-spacing: 0.4px;
214 + margin-bottom: 5px;
215 + padding: 4px 20px;
216 + border-top: 1px solid #eee;
217 + border-bottom: 1px solid #eee;
218 + background-color: rgba(0, 0, 0, 0.02);
219 + box-shadow: 0 4px 4px -4px rgba(0, 0, 0, 0.1);
220 + font-weight: bold;
250 221 cursor: pointer;
251 - transition: border-left-color 0.15s ease-in-out, color 0.15s ease-in-out, background-color 0.15s ease-in-out;
252 222 }
253 223
254 -.viz-section-title:hover,
255 -.viz-section-title.open {
256 - border-left-color: #0073aa;
257 - color: #0073aa;
258 - background-color: #f0f6fb;
259 -}
260 -
261 224 .viz-group-wrapper ul ul li .viz-section-title {
262 - border-left: 3px solid transparent;
225 + margin-bottom: 0;
226 + border: none;
227 + box-shadow: none;
263 228 }
264 229
265 230 .viz-section-title::after {
266 231 position: absolute;
267 - top: 50%;
268 - right: 10px;
269 - transform: translateY(-50%);
270 - color: inherit;
271 - font: 400 16px/1 dashicons;
272 - content: "\f345";
273 - opacity: 0.6;
232 + z-index: 1;
233 + top: 13px;
234 + right: 20px;
235 + width: 0;
236 + height: 0;
237 + border-width: 4px 4px 0;
238 + border-style: solid;
239 + border-color: #ccc transparent;
240 + content: "";
274 241 }
275 242
276 243 .viz-section-title.open::after {
277 - content: "\f347";
244 + border-width: 0 4px 4px;
278 245 }
279 246
280 247 .section-items,
281 248 .viz-section-items {
@@ -321,9 +288,9 @@
321 288
322 289 .section-delimiter,
323 290 .viz-section-delimiter {
324 291 margin: 15px 0;
325 - border-top: 1px solid #e5e5e5;
292 + border-top: 1px dashed #ccc;
326 293 }
327 294
328 295 .viz-section-table-column {
329 296 width: 50%;
@@ -361,9 +328,9 @@
361 328
362 329 #rate-the-plugin {
363 330 margin-top: 40px;
364 331 padding: 20px;
365 - border-top: 1px solid #e5e5e5;
332 + border-top: 1px dashed #ddd;
366 333 text-align: center;
367 334 }
368 335
369 336 .rate-the-plugin {
@@ -390,111 +357,8 @@
390 357 margin-top: 15px;
391 358 text-align: center;
392 359 }
393 360
394 -#viz-tabs {
395 - display: none;
396 -}
397 -
398 -#viz-tabs.done {
399 - display: block;
400 -}
401 -
402 -#viz-tabs .ui-tabs-panel {
403 - padding: 0;
404 -}
405 -
406 -#viz-tabs .wp-color-picker {
407 - width: 4rem !important;
408 -}
409 -
410 -/* Modern flat tab nav */
411 -#viz-tabs .ui-tabs-nav {
412 - display: flex;
413 - padding: 0;
414 - margin: 0;
415 - background: #fff;
416 - border: none;
417 - border-bottom: 2px solid #e5e5e5;
418 - border-radius: 0;
419 - box-shadow: none;
420 -}
421 -
422 -#viz-tabs .ui-tabs-nav li {
423 - flex: 1;
424 - margin: 0;
425 - border: none;
426 - border-bottom: 2px solid transparent;
427 - border-radius: 0;
428 - background: transparent;
429 - top: 2px;
430 - transition: border-color 0.15s ease-in-out;
431 -}
432 -
433 -#viz-tabs .ui-tabs-nav li a {
434 - display: block;
435 - width: 100%;
436 - padding: 10px 0;
437 - color: #555d66;
438 - font-size: 13px;
439 - font-weight: 500;
440 - text-align: center;
441 - box-sizing: border-box;
442 -}
443 -
444 -#viz-tabs .ui-tabs-nav li:hover a {
445 - color: #0073aa;
446 -}
447 -
448 -#viz-tabs .ui-tabs-nav .ui-state-active {
449 - border-bottom-color: #0073aa;
450 - background: transparent;
451 -}
452 -
453 -#viz-tabs .ui-tabs-nav .ui-state-active a {
454 - color: #0073aa;
455 - font-weight: 600;
456 -}
457 -
458 -#viz-tabs .ui-tabs-nav li a:focus,
459 -#viz-tabs .ui-tabs-nav li.ui-state-focus a {
460 - outline: none;
461 - box-shadow: none;
462 - border-radius: 2px;
463 -}
464 -
465 -.viz-info-panel {
466 - display: flex;
467 - flex-direction: column;
468 - padding: 16px;
469 - gap: 14px;
470 - background: #fff;
471 - border-bottom: 1px solid #e5e5e5;
472 -}
473 -
474 -.viz-info-panel label {
475 - margin: 0;
476 - padding: 0;
477 - font-weight: bold;
478 -}
479 -
480 -.viz-info-panel input {
481 - flex: 1;
482 -}
483 -
484 -.viz-info-panel .viz-info-item {
485 - display: flex;
486 - flex-direction: column;
487 - flex: 1;
488 - gap: 3px;
489 -}
490 -
491 -.viz-info-panel .viz-info-row {
492 - display: flex;
493 - flex-direction: row;
494 - gap: 5px;
495 -}
496 -
497 361 /******************************************************************************/
498 362 /******************************** TOOLBAR ***********************************/
499 363 /******************************************************************************/
500 364
@@ -513,9 +377,8 @@
513 377 }
514 378
515 379 #toolbar .push-right {
516 380 float: right;
517 - margin-right: 10px;
518 381 }
519 382
520 383 #toolbar .push-left {
521 384 float: left;
@@ -531,20 +394,8 @@
531 394 width: 30%;
532 395 vertical-align: top;
533 396 }
534 397
535 -#chart-select {
536 - display: flex;
537 - padding: 12px 8px;
538 - justify-content: center;
539 - align-items: center;
540 - gap: 12px;
541 -}
542 -
543 -#chart-select label {
544 - font-weight: bold;
545 -}
546 -
547 398 /******************************************************************************/
548 399 /******************************** TYPE PICKER ******************************/
549 400 /******************************************************************************/
550 401
@@ -551,68 +402,52 @@
551 402 .type-box span {
552 403 display: block;
553 404 position: absolute;
554 405 right: 0;
555 - bottom: 0;
406 + bottom: -6px;
556 407 width: 100%;
557 - padding: 6px 0;
558 - border-top: 1px solid #e5e5e5;
559 - background-color: #fff;
560 - font-weight: 600;
561 - font-size: 12px;
408 + padding: 4px 0;
409 + border-top: 1px dashed #ddd;
410 + border-bottom: 1px dashed #ddd;
411 + background: #e0e0e0;
412 + background-color: #efefef;
413 + box-shadow: 0 0 8px #ddd;
414 + font-weight: bold;
562 415 text-align: center;
563 - color: #555d66;
564 416 }
565 417
566 418 .type-box .pro-upsell {
567 - color: #d63638;
419 + color: #c55555;
568 420 }
569 421
570 422 #type-picker {
571 - max-width: 960px;
572 - margin: 30px auto;
573 - padding: 0 16px;
574 - display: flex;
575 - flex-wrap: wrap;
576 - gap: 16px;
423 + width: 954px;
424 + margin: 50px auto;
577 425 }
578 426
579 427 .type-box {
428 + float: left;
580 429 position: relative;
581 - border: 1px solid #ddd;
582 - border-left: 3px solid transparent;
583 - background-color: #fff;
584 - box-shadow: 0 1px 3px rgba(0,0,0,0.08);
585 - border-radius: 2px;
586 - overflow: hidden;
587 - transition: border-left-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
430 + margin: 0 20px 20px 0;
431 + border: 1px dashed #ddd;
432 + background-color: #efefef;
433 + box-shadow: 0 0 8px #ddd;
588 434 }
589 435
590 -.type-box:hover,
591 -.type-box:has(.type-label-selected) {
592 - border-left-color: #0073aa;
593 - box-shadow: 0 2px 6px rgba(0,114,170,0.15);
436 +.type-box:nth-child(3n+3) {
437 + margin-right: 0;
594 438 }
595 439
596 -.type-box.viz-hidden {
597 - display: none;
598 -}
599 -
600 440 .type-box .pro-upsell .visualizder-pro-label {
601 441 display: inline;
602 442 position: absolute;
603 443 top: 0;
604 444 width: 74px;
445 + height: 10px;
605 446 height: 17px;
606 447 border: none;
607 448 color: #fff;
608 - z-index: 4;
609 - background: #d63638;
610 - font-size: 10px;
611 - font-weight: 600;
612 - letter-spacing: 0.5px;
613 - line-height: 17px;
614 - text-align: center;
449 + background: #c55555;
615 450 }
616 451
617 452 .type-label {
618 453 display: block;
@@ -618,42 +453,22 @@
618 453 display: block;
619 454 width: 270px;
620 455 height: 205px;
621 456 padding: 15px;
622 - border: none;
623 - background-color: #f9f9f9;
624 - background-image: url(../images/chart_types_v395.png);
457 + border: 1px solid #e0e0e0;
458 + background-color: white;
459 + background-image: url(../images/chart_types_june2019_g.png);
625 460 background-repeat: no-repeat;
626 461 background-position: center center;
627 - background-size: 900px 1150px;
628 - filter: grayscale(100%);
629 - cursor: pointer;
630 - transition: filter 0.15s ease-in-out, background-color 0.15s ease-in-out;
631 462 }
632 463
633 -#type-picker.lib-ChartJS .type-label {
634 - background-image: url(../images/chart_types_chartjs.png);
635 -}
636 -
637 -#type-picker.lib-DataTable .type-label {
638 - background-image: url(../images/chart_types_datatable.png);
639 -}
640 -
641 464 .type-label-selected,
642 -.type-box .type-label:hover {
643 - filter: grayscale(0);
644 - background-color: #f0f7fb;
465 +.type-box > .type-label:hover {
466 + background-image: url(../images/chart_types_june2019.png);
645 467 }
646 468
647 -.type-label:focus,
648 -.viz-group-title:focus,
649 -.viz-section-title:focus {
650 - outline: 2px solid #2271b1;
651 - outline-offset: 2px;
652 -}
653 -
654 469 .type-box-area .type-label {
655 - background-position: -8px -225px;
470 + background-position: 0 -225px;
656 471 }
657 472
658 473 .type-box-line .type-label {
659 474 background-position: -600px 0;
@@ -667,9 +482,9 @@
667 482 background-position: 0 0;
668 483 }
669 484
670 485 .type-box-gauge .type-label {
671 - background-position: -7px -450px;
486 + background-position: 0 -450px;
672 487 }
673 488
674 489 .type-box-geo .type-label {
675 490 background-position: -600px -450px;
@@ -675,9 +490,9 @@
675 490 background-position: -600px -450px;
676 491 }
677 492
678 493 .type-box-candlestick .type-label {
679 - background-position: -304px -450px;
494 + background-position: -300px -450px;
680 495 }
681 496
682 497 .type-box-bar .type-label {
683 498 background-position: -300px -225px;
@@ -682,28 +497,26 @@
682 497 .type-box-bar .type-label {
683 498 background-position: -300px -225px;
684 499 }
685 500
686 -.type-box-bubble .type-label {
687 - background-position: -604px -906px;
501 +.type-box-column .type-label {
502 + background-position: -600px -225px;
688 503 }
689 504
690 -.type-box-column .type-label {
691 - background-position: -600px -225px;
505 +.type-box-dataTable .type-label {
506 + background-position: -301px -670px;
692 507 }
693 508
694 -.type-box-dataTable .type-label,
695 -.type-box-table .type-label,
696 -.type-box-tabular .type-label {
509 +.type-box-table .type-label {
697 510 background-position: -301px -670px;
698 511 }
699 512
700 513 .type-box-timeline .type-label {
701 - background-position: -8px -670px;
514 + background-position: -2px -670px;
702 515 }
703 516
704 517 .type-box-combo .type-label {
705 - background-position: -606px -670px;
518 + background-position: -597px -670px;
706 519 }
707 520
708 521 .type-box-polarArea .type-label {
709 522 background-position: -2px -912px;
@@ -874,10 +687,10 @@
874 687
875 688 input#existing-chart {
876 689 /*left: 18px;
877 690 width: 110px;
878 - position: relative;*/
879 - }
691 + position: relative;*/
692 +}
880 693
881 694 select#chart-id {
882 695 float: right;
883 696 width: 146px;
@@ -974,11 +787,8 @@
974 787
975 788 .viz-select-library {
976 789 color: #0085ba;
977 790 }
978 -.viz-select-library.viz-hide-library {
979 - display: none;
980 -}
981 791
982 792 .viz-select-library option:first-child {
983 793 font-weight: bold;
984 794 }
@@ -1094,56 +904,12 @@
1094 904 border-bottom: 1px solid #ddd;
1095 905 }
1096 906
1097 907 #vz-chart-copyright {
1098 - bottom: 60px;
908 + bottom: 10px;
1099 909 text-align: center;
1100 - z-index: 999;
1101 - background: #f3f3f3;
1102 910 }
1103 911
1104 -/* Import steps — stepped data-source + schedule flow */
1105 -.vz-import-step-btn {
1106 - width: 100%;
1107 - margin-bottom: 4px !important;
1108 - text-align: left;
1109 -}
1110 -
1111 -.vz-import-step-toggle {
1112 - display: flex;
1113 - justify-content: space-between;
1114 - align-items: center;
1115 - width: 100%;
1116 - margin: 0;
1117 - padding: 5px 10px;
1118 - background: #f0f0f1;
1119 - border: 1px solid #c3c4c7;
1120 - border-radius: 2px;
1121 - cursor: pointer;
1122 - font-size: 13px;
1123 - color: #50575e;
1124 - line-height: 2;
1125 -}
1126 -
1127 -.vz-import-step-toggle:hover {
1128 - background: #e5e5e5;
1129 - border-color: #a7aaad;
1130 -}
1131 -
1132 -.vz-import-step-toggle .dashicons {
1133 - transition: transform 0.2s ease;
1134 - flex-shrink: 0;
1135 -}
1136 -
1137 -.vz-import-step-toggle[aria-expanded="true"] .dashicons {
1138 - transform: rotate(180deg);
1139 -}
1140 -
1141 -#vz-wp-sync-options,
1142 -#vz-db-sync-options {
1143 - padding-top: 8px;
1144 -}
1145 -
1146 912 #sidebar {
1147 913 border-left: 1px solid #ddd;
1148 914 background: #f3f3f3;
1149 915 }
@@ -1189,9 +955,8 @@
1189 955
1190 956 #vz-csv-file-form,
1191 957 #vz-one-time-import,
1192 958 #vz-schedule-import,
1193 -#vz-permissions .only-pro-content,
1194 959 .edit-data-content {
1195 960 text-align: center;
1196 961 }
1197 962
@@ -1239,9 +1004,8 @@
1239 1004 bottom: 0;
1240 1005 left: 0;
1241 1006 width: 100%;
1242 1007 opacity: 0;
1243 - pointer-events: none;
1244 1008 background: rgba(253,253,253,0.9);
1245 1009 transition: 0.5s ease;
1246 1010 }
1247 1011
@@ -1246,29 +1010,23 @@
1246 1010 }
1247 1011
1248 1012 .only-pro-feature:hover .only-pro-content {
1249 1013 opacity: 1;
1250 - pointer-events: auto;
1251 1014 }
1252 1015
1253 1016 .only-pro-container {
1254 - display: flex;
1255 - align-items: center;
1256 - justify-content: center;
1017 + display: table;
1257 1018 width: 100%;
1258 1019 height: 100%;
1259 1020 }
1260 1021
1261 1022 .only-pro-inner {
1262 - display: flex;
1263 - flex-direction: column;
1264 - align-items: center;
1265 - justify-content: center;
1266 - gap: 12px;
1023 + display: table-cell;
1024 + vertical-align: middle;
1267 1025 }
1268 1026
1269 1027 .only-pro-content p {
1270 - margin: 0;
1028 + margin: 0 0 15px;
1271 1029 font-size: 14px;
1272 1030 font-weight: 700;
1273 1031 }
1274 1032
@@ -1275,25 +1033,19 @@
1275 1033 .only-pro-content a {
1276 1034 display: inline-block;
1277 1035 padding: 7px 12px;
1278 1036 color: #fff;
1279 - background: #3F57E1;
1037 + background: #ff595e;
1280 1038 font-weight: 600;
1281 1039 text-decoration: none;
1040 + text-transform: uppercase;
1282 1041 transition: 0.1s ease;
1283 - border-width: 1px;
1284 - border-style: solid;
1285 - border-radius: 3px;
1286 1042 }
1287 1043
1288 1044 .only-pro-content a:hover {
1289 - background: #2D419B;
1045 + background: #ce484c;
1290 1046 }
1291 1047
1292 -.only-pro-anchor {
1293 - position: relative;
1294 -}
1295 -
1296 1048 #sidebar::-webkit-scrollbar {
1297 1049 width: 4px;
1298 1050 }
1299 1051
@@ -1301,9 +1053,9 @@
1301 1053 background: #999;
1302 1054 }
1303 1055
1304 1056 span.viz-section-error {
1305 - color: #ff0000;
1057 + color: #ff000;
1306 1058 }
1307 1059
1308 1060 #visualizer-error-manual {
1309 1061 color: #ff595e;
@@ -1521,8 +1273,15 @@
1521 1273 .db-wizard-where-template-remove {
1522 1274 background-color: #ff0d00;
1523 1275 }
1524 1276
1277 +#db-query-form .CodeMirror-scroll {
1278 + overflow: hidden !important;
1279 + height: 50%;
1280 + margin: 0;
1281 + padding: 0;
1282 +}
1283 +
1525 1284 #db-query-form .CodeMirror-wrap {
1526 1285 height: 200px;
1527 1286 padding: 15px;
1528 1287 color: #fff;
@@ -1542,15 +1301,11 @@
1542 1301 color: #fff !important;
1543 1302 }
1544 1303
1545 1304 #db-query-form .CodeMirror-wrap pre .cm-keyword {
1546 - color: #FF6188 !important;
1305 + color: #f92472 !important;
1547 1306 }
1548 1307
1549 -#db-query-form .CodeMirror-wrap pre .cm-builtin {
1550 - color: #78DCE8 !important;
1551 -}
1552 -
1553 1308 #db-query-form .CodeMirror-wrap pre .cm-comment {
1554 1309 color: #74705d !important;
1555 1310 }
1556 1311
@@ -1555,9 +1310,9 @@
1555 1310 }
1556 1311
1557 1312 #db-query-form .CodeMirror-wrap pre .cm-number,
1558 1313 #db-query-form .CodeMirror-wrap pre .cm-string {
1559 - color: #A9DC76 !important;
1314 + color: #fff !important;
1560 1315 }
1561 1316
1562 1317 .visualizer-db-query-form > div {
1563 1318 display: block;
@@ -1575,9 +1330,8 @@
1575 1330 }
1576 1331
1577 1332 .db-wizard-error {
1578 1333 color: #f00;
1579 - padding: 16px 0;
1580 1334 }
1581 1335
1582 1336 .db-wizard-hints,
1583 1337 .json-wizard-hints,
@@ -1597,9 +1351,8 @@
1597 1351 .db-wizard-hints ul,
1598 1352 .html-table-editor-hints ul,
1599 1353 .json-wizard-hints ul {
1600 1354 list-style: square;
1601 - padding: 0 16px;
1602 1355 }
1603 1356
1604 1357 .db-wizard-results .dataTables_wrapper .dataTables_info {
1605 1358 width: calc(100% - 17px);
@@ -1604,77 +1357,18 @@
1604 1357 .db-wizard-results .dataTables_wrapper .dataTables_info {
1605 1358 width: calc(100% - 17px);
1606 1359 }
1607 1360
1608 -
1609 -/******************************************************************************/
1610 -/************************ manual config JSON editor *************************/
1611 -/******************************************************************************/
1612 -code.viz-manual-config-example {
1613 - display: block;
1614 - white-space: pre;
1615 - background: #f5f5f5;
1616 - border: 1px solid #e0e0e0;
1617 - border-radius: 3px;
1618 - padding: 6px 8px;
1619 - margin-top: 6px;
1620 - font-size: 11px;
1621 - line-height: 1.5;
1361 +#vz-chart-docs {
1362 + right: 85px;
1363 + bottom: 40px;
1364 + width: 35%;
1622 1365 }
1623 1366
1624 -
1625 -textarea[name="manual"] + .CodeMirror {
1626 - background: #282923;
1627 - color: #f8f8f2;
1628 - border-radius: 4px;
1629 - height: 200px;
1630 - font-size: 13px;
1367 +#vz-chart-docs a {
1368 + text-decoration: none;
1631 1369 }
1632 1370
1633 -textarea[name="manual"] + .CodeMirror .CodeMirror-scroll {
1634 - min-height: 200px;
1635 -}
1636 -
1637 -textarea[name="manual"] + .CodeMirror .CodeMirror-gutters {
1638 - background: #1e1f1c;
1639 - border-right: 1px solid #404040;
1640 - color: #75715e;
1641 -}
1642 -
1643 -textarea[name="manual"] + .CodeMirror .CodeMirror-linenumber {
1644 - color: #75715e;
1645 -}
1646 -
1647 -textarea[name="manual"] + .CodeMirror .CodeMirror-cursor {
1648 - border-left: 1px solid #f8f8f0;
1649 -}
1650 -
1651 -textarea[name="manual"] + .CodeMirror .CodeMirror-selected {
1652 - background: #49483e;
1653 -}
1654 -
1655 -textarea[name="manual"] + .CodeMirror pre.CodeMirror-line,
1656 -textarea[name="manual"] + .CodeMirror pre.CodeMirror-line-like {
1657 - color: #f8f8f2;
1658 -}
1659 -
1660 -textarea[name="manual"] + .CodeMirror .cm-string {
1661 - color: #A9DC76;
1662 -}
1663 -
1664 -textarea[name="manual"] + .CodeMirror .cm-number {
1665 - color: #AB9DF2;
1666 -}
1667 -
1668 -textarea[name="manual"] + .CodeMirror .cm-atom {
1669 - color: #78DCE8;
1670 -}
1671 -
1672 -textarea[name="manual"] + .CodeMirror .cm-punctuation,
1673 -textarea[name="manual"] + .CodeMirror .cm-bracket {
1674 - color: #f8f8f2;
1675 -}
1676 -
1677 1371 /******************************************************************************/
1678 1372 /******************************** data tables *******************************/
1679 1373 /******************************************************************************/
1680 1374 .db-wizard-results .dt-button {
@@ -1691,16 +1385,13 @@
1691 1385 #json-conclude-form .results {
1692 1386 min-width: 10px !important;
1693 1387 }
1694 1388
1695 -#json-conclude-form .json-table {
1696 - width: 85%;
1697 -}
1698 -
1389 +#json-conclude-form .json-table,
1699 1390 #vz-import-json-url,
1700 1391 #vz-import-json-root,
1701 1392 #vz-import-json-paging {
1702 - width: 75%;
1393 + width: 85%;
1703 1394 }
1704 1395
1705 1396 #json-conclude-form .json-table,
1706 1397 #json-conclude-form button#visualizer-json-conclude {
@@ -1730,41 +1421,8 @@
1730 1421 background: #0085BA !important;
1731 1422 color: #ffffff;
1732 1423 }
1733 1424
1734 -.viz-substep {
1735 - outline: 0 !important;
1736 - border: 0 !important;
1737 - background: none !important;
1738 - text-transform: uppercase;
1739 -}
1740 -
1741 -.viz-substep.ui-state-active {
1742 -}
1743 -
1744 -.viz-substep ~ .ui-accordion-content {
1745 - outline: 0 !important;
1746 - border: 0 !important;
1747 - font-size: smaller;
1748 -}
1749 -
1750 -.viz-substep ~ div {
1751 - display: table;
1752 -}
1753 -
1754 -.viz-substep ~ div > div {
1755 - display: table-row;
1756 -}
1757 -
1758 -.viz-substep ~ div > div div {
1759 - display: table-cell;
1760 - padding: 5px;
1761 -}
1762 -
1763 -.json-wizard-header .field-title {
1764 - position: absolute;
1765 - left: 30px;
1766 -}
1767 1425 /******************************************************************************/
1768 1426 /******************************** html table editor **************************/
1769 1427 /******************************************************************************/
1770 1428 .viz-simple-editor-type,
@@ -1809,12 +1467,8 @@
1809 1467 display: inline-block;
1810 1468 vertical-align: middle;
1811 1469 }
1812 1470
1813 -.viz-simple-editor .viz-html-table {
1814 - width: 95%;
1815 -}
1816 -
1817 1471 /******************************************************************************/
1818 1472 /******************************** chartjs ***********************************/
1819 1473 /******************************************************************************/
1820 1474
@@ -1819,59 +1473,5 @@
1819 1473 /******************************************************************************/
1820 1474
1821 1475 canvas.chartjs-render-monitor {
1822 1476 height: 500px !important;
1823 -}
1824 -
1825 -/******************************************************************************/
1826 -/******************************** Frontend Actions ***********************************/
1827 -/******************************************************************************/
1828 -#vz-frontend-actions .only-pro-inner, #vz-data-controls .only-pro-inner {
1829 - text-align: center;
1830 -}
1831 -
1832 -/******************************************************************************/
1833 -/******************************** chart type box upsell ***********************/
1834 -/******************************************************************************/
1835 -
1836 -.pro-upsell .pro-upsell-overlay {
1837 - position: absolute;
1838 - width: 100%;
1839 - height: 100%;
1840 - left: 0;
1841 - top: 0;
1842 - display: grid;
1843 - place-items: center;
1844 - background-color: rgba(255, 255, 255, 0.7);
1845 - z-index: 1;
1846 - opacity: 0;
1847 - visibility: hidden;
1848 - transition: all .3s ease-in-out;
1849 -}
1850 -.pro-upsell:hover .pro-upsell-overlay{
1851 - opacity: 1;
1852 - visibility: visible;
1853 -}
1854 -
1855 -.pro-upsell .pro-upsell-overlay .button {
1856 - width: 155px;
1857 - height: 39px;
1858 - background: #007CBA;
1859 - border-radius: 4px;
1860 - display: flex;
1861 - align-items: center;
1862 - text-align: center;
1863 - color: #FFFFFF;
1864 - justify-content: center;
1865 -}
1866 -.pro-upsell .pro-upsell-overlay .button.button-secondary{
1867 - background: #ffffff;
1868 - color: #007CBA;
1869 -}
1870 -.pro-upsell .pro-upsell-overlay .pro-upsell-action {
1871 - display: flex;
1872 - gap: 20px;
1873 -}
1874 -.pro-upsell .pro-upsell-overlay .pro-upsell-action .button{
1875 - width: 100%;
1876 - text-align: center;
1877 -}
1477 +}