PluginProbe
Visualizer – Tables & Charts Manager with Built-in AI Generator / 3.0.2
Visualizer – Tables & Charts Manager with Built-in AI Generator v3.0.2
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 +40 -284 3.1.03.0.2 View file →
@@ -5,9 +5,8 @@
5 5 top: 0;
6 6 right: 0;
7 7 bottom: 60px;
8 8 left: 0;
9 - width: auto;
10 9 background-color: white;
11 10 }
12 11
13 12 #canvas {
@@ -85,8 +84,9 @@
85 84 font-size: 14px;
86 85 font-weight: 600;
87 86 line-height: 21px;
88 87 cursor: pointer;
88 + -webkit-transition: 0.15s color ease-in-out,0.15s background-color ease-in-out,0.15s border-color ease-in-out;
89 89 transition: 0.15s color ease-in-out,0.15s background-color ease-in-out,0.15s border-color ease-in-out;
90 90 }
91 91
92 92 .viz-group-wrapper .viz-group .viz-group:hover .viz-group-title,
@@ -121,10 +121,12 @@
121 121 border-top: 1px solid #ddd;
122 122 border-right: 1px solid #ddd;
123 123 border-left: 4px solid #fff;
124 124 background: #fff;
125 + -webkit-box-shadow: none;
125 126 box-shadow: none;
126 127 cursor: pointer;
128 + -webkit-transition: color 0.15s ease-in-out,border-color 0.15s ease-in-out,background 0.15s ease-in-out;
127 129 transition: color 0.15s ease-in-out,border-color 0.15s ease-in-out,background 0.15s ease-in-out;
128 130 }
129 131
130 132 .viz-group-wrapper .viz-group .customize-section-back:hover {
@@ -211,8 +213,9 @@
211 213 padding: 4px 20px;
212 214 border-top: 1px solid #eee;
213 215 border-bottom: 1px solid #eee;
214 216 background-color: rgba(0, 0, 0, 0.02);
217 + -webkit-box-shadow: 0 4px 4px -4px rgba(0, 0, 0, 0.1);
215 218 box-shadow: 0 4px 4px -4px rgba(0, 0, 0, 0.1);
216 219 font-weight: bold;
217 220 cursor: pointer;
218 221 }
@@ -219,8 +222,9 @@
219 222
220 223 .viz-group-wrapper ul ul li .viz-section-title {
221 224 margin-bottom: 0;
222 225 border: none;
226 + -webkit-box-shadow: none;
223 227 box-shadow: none;
224 228 }
225 229
226 230 .viz-section-title::after {
@@ -239,10 +243,9 @@
239 243 .viz-section-title.open::after {
240 244 border-width: 0 4px 4px;
241 245 }
242 246
243 -.section-items,
244 -.viz-section-items {
247 +.section-items, .viz-section-items {
245 248 display: none;
246 249 padding: 15px;
247 250 }
248 251
@@ -270,10 +273,9 @@
270 273 .viz-section-table {
271 274 width: 100%;
272 275 }
273 276
274 -.section-delimiter,
275 -.viz-section-delimiter {
277 +.section-delimiter, .viz-section-delimiter {
276 278 margin: 15px 0;
277 279 border-top: 1px dashed #ccc;
278 280 }
279 281
@@ -356,8 +358,9 @@
356 358 left: 0;
357 359 height: 36px;
358 360 padding: 12px 16px;
359 361 border-top: 1px solid #dfdfdf;
362 + -webkit-box-shadow: 0 -4px 4px -4px rgba(0, 0, 0, 0.1);
360 363 box-shadow: 0 -4px 4px -4px rgba(0, 0, 0, 0.1);
361 364 text-align: center;
362 365 }
363 366
@@ -364,12 +367,8 @@
364 367 #toolbar .push-right {
365 368 float: right;
366 369 }
367 370
368 -#toolbar .push-left {
369 - float: left;
370 -}
371 -
372 371 .toolbar-div a {
373 372 float: left;
374 373 }
375 374
@@ -394,8 +393,9 @@
394 393 border-top: 1px dashed #ddd;
395 394 border-bottom: 1px dashed #ddd;
396 395 background: #e0e0e0;
397 396 background-color: #efefef;
397 + -webkit-box-shadow: 0 0 8px #ddd;
398 398 box-shadow: 0 0 8px #ddd;
399 399 font-weight: bold;
400 400 text-align: center;
401 401 }
@@ -414,8 +414,9 @@
414 414 position: relative;
415 415 margin: 0 20px 20px 0;
416 416 border: 1px dashed #ddd;
417 417 background-color: #efefef;
418 + -webkit-box-shadow: 0 0 8px #ddd;
418 419 box-shadow: 0 0 8px #ddd;
419 420 }
420 421
421 422 .type-box:nth-child(3n+3) {
@@ -486,12 +487,8 @@
486 487 .type-box-column .type-label {
487 488 background-position: -600px -225px;
488 489 }
489 490
490 -.type-box-dataTable .type-label {
491 - background-position: -301px -670px;
492 -}
493 -
494 491 .type-box-table .type-label {
495 492 background-position: -301px -670px;
496 493 }
497 494
@@ -580,12 +577,14 @@
580 577 border: medium none rgb(100, 100, 100) !important;
581 578 border: 1px solid #b0b0b0 !important;
582 579 color: #646464 !important;
583 580 background: #e6e6e6 url("../images/computer.png") no-repeat scroll 7px 1px !important;
581 + -webkit-box-shadow: none !important;
584 582 box-shadow: none !important;
585 583 text-shadow: none!important;
586 584 font-family: "Open Sans",sans-serif;
587 585 font-weight: 700;
586 + -webkit-transition: all 0.3s ease 0s;
588 587 transition: all 0.3s ease 0s;
589 588 }
590 589
591 590 .computer-btn:hover {
@@ -592,10 +591,14 @@
592 591 padding-left: 27px !important;
593 592 border: 1px solid #2f8cea !important;
594 593 color: white !important;
595 594 background: #2f8cea url("../images/computer.png") no-repeat scroll 7px -36px !important;
595 + -webkit-box-shadow: 0 1px 0 rgba(171, 171, 171, 0.5) inset, 0 1px 0 rgba(0, 0, 0, 0.15) !important;
596 + -webkit-box-shadow: none !important;
596 597 box-shadow: 0 1px 0 rgba(171, 171, 171, 0.5) inset, 0 1px 0 rgba(0, 0, 0, 0.15) !important;
597 598 box-shadow: none !important;
599 + -webkit-transition: all 0.3s ease 0s;
600 + -webkit-transition: all 0.3s ease;
598 601 transition: all 0.3s ease 0s;
599 602 transition: all 0.3s ease;
600 603 }
601 604
@@ -609,11 +612,13 @@
609 612 border: medium none #646464 !important;
610 613 border: 1px solid #b0b0b0 !important;
611 614 color: #646464 !important;
612 615 background: #e6e6e6 url("../images/web.png") no-repeat scroll 7px 1px !important;
616 + -webkit-box-shadow: none !important;
613 617 box-shadow: none !important;
614 618 font-family: "Open Sans",sans-serif;
615 619 font-weight: 700;
620 + -webkit-transition: all 0.3s ease 0s;
616 621 transition: all 0.3s ease 0s;
617 622 /*margin-left: 2px !important;*/
618 623 }
619 624
@@ -622,9 +627,12 @@
622 627 /*margin-left: 2px !important;*/
623 628 border: 1px solid #89b158 !important;
624 629 color: white !important;
625 630 background: #89b158 url("../images/web.png") no-repeat scroll 7px -38px !important;
631 + -webkit-box-shadow: none !important;
626 632 box-shadow: none !important;
633 + -webkit-transition: all 0.3s ease 0s;
634 + -webkit-transition: all 0.3s ease;
627 635 transition: all 0.3s ease 0s;
628 636 transition: all 0.3s ease;
629 637 }
630 638
@@ -641,11 +649,13 @@
641 649 border: medium none #646464 !important;
642 650 border: 1px solid #b0b0b0 !important;
643 651 color: #646464 !important;
644 652 background: #e6e6e6 url("../images/from_chart.png") no-repeat scroll 7px 1px !important;
653 + -webkit-box-shadow: none !important;
645 654 box-shadow: none !important;
646 655 font-family: "Open Sans",sans-serif;
647 656 font-weight: 700;
657 + -webkit-transition: all 0.3s ease 0s;
648 658 transition: all 0.3s ease 0s;
649 659 /*margin-left: 2px !important;
650 660 margin-top: 2px !important;*/
651 661 }
@@ -655,9 +665,12 @@
655 665 /*margin-left: 2px !important;*/
656 666 border: 1px solid #10aecb !important;
657 667 color: white !important;
658 668 background: #10aecb url("../images/from_chart.png") no-repeat scroll 7px -36px !important;
669 + -webkit-box-shadow: none !important;
659 670 box-shadow: none !important;
671 + -webkit-transition: all 0.3s ease 0s;
672 + -webkit-transition: all 0.3s ease;
660 673 transition: all 0.3s ease 0s;
661 674 transition: all 0.3s ease;
662 675 /*margin-top: 2px !important;*/
663 676 }
@@ -679,10 +692,12 @@
679 692 margin: 0 auto;
680 693 border: 1px solid #2c80d6 !important;
681 694 color: white !important;
682 695 background-color: #2f8cea !important;
696 + -webkit-box-shadow: none !important;
683 697 box-shadow: none !important;
684 698 text-shadow: none;
699 + -webkit-transition: all 0.3s ease;
685 700 transition: all 0.3s ease;
686 701 }
687 702
688 703 .preview-btn {
@@ -688,11 +703,13 @@
688 703 .preview-btn {
689 704 border: 1px solid #2c80d6 !important;
690 705 color: white !important;
691 706 background-color: #2f8cea !important;
707 + -webkit-box-shadow: none !important;
692 708 box-shadow: none !important;
693 709 font-family: "Open Sans",sans-serif;
694 710 font-weight: 700;
711 + -webkit-transition: all 0.3s ease;
695 712 transition: all 0.3s ease;
696 713 }
697 714
698 715 .preview-btn:hover {
@@ -698,11 +715,13 @@
698 715 .preview-btn:hover {
699 716 border: 1px solid #2c80d6 !important;
700 717 color: white !important;
701 718 background-color: #2c80d6 !important;
719 + -webkit-box-shadow: none !important;
702 720 box-shadow: none !important;
703 721 font-family: "Open Sans",sans-serif;
704 722 font-weight: 700;
723 + -webkit-transition: all 0.3s ease;
705 724 transition: all 0.3s ease;
706 725 }
707 726
708 727 .show-live-btn {
@@ -709,8 +728,9 @@
709 728 width: 100%;
710 729 margin-top: 15px !important;
711 730 border-color: #e98b00 !important;
712 731 background-color: #f90 !important;
732 + -webkit-box-shadow: none !important;
713 733 box-shadow: none !important;
714 734 font-family: "Open Sans",sans-serif;
715 735 font-weight: 700;
716 736 }
@@ -719,11 +739,13 @@
719 739 width: 100%;
720 740 margin-top: 15px !important;
721 741 border-color: #e98b00 !important;
722 742 background-color: #ea8c00 !important;
743 + -webkit-box-shadow: none !important;
723 744 box-shadow: none !important;
724 745 font-family: "Open Sans",sans-serif;
725 746 font-weight: 700;
747 + -webkit-transition: all 0.3s ease;
726 748 transition: all 0.3s ease;
727 749 }
728 750
729 751 .check-pro-btn {
@@ -811,8 +833,9 @@
811 833
812 834 #vz-chart-review {
813 835 right: 0;
814 836 bottom: 10px;
837 + -webkit-box-sizing: border-box;
815 838 box-sizing: border-box;
816 839 width: 40%;
817 840 padding-right: 6px;
818 841 text-align: right;
@@ -824,8 +847,9 @@
824 847
825 848 #vz-chart-settings {
826 849 bottom: 40px;
827 850 left: 0;
851 + -webkit-box-sizing: border-box;
828 852 box-sizing: border-box;
829 853 width: 33%;
830 854 text-align: left;
831 855 }
@@ -839,8 +863,9 @@
839 863
840 864 #vz-chart-permissions {
841 865 right: 0;
842 866 bottom: 40px;
867 + -webkit-box-sizing: border-box;
843 868 box-sizing: border-box;
844 869 width: 33%;
845 870 text-align: left;
846 871 }
@@ -974,8 +999,9 @@
974 999 left: 0;
975 1000 width: 100%;
976 1001 opacity: 0;
977 1002 background: rgba(253,253,253,0.9);
1003 + -webkit-transition: 0.5s ease;
978 1004 transition: 0.5s ease;
979 1005 }
980 1006
981 1007 .only-pro-feature:hover .only-pro-content {
@@ -1006,8 +1032,9 @@
1006 1032 background: #ff595e;
1007 1033 font-weight: 600;
1008 1034 text-decoration: none;
1009 1035 text-transform: uppercase;
1036 + -webkit-transition: 0.1s ease;
1010 1037 transition: 0.1s ease;
1011 1038 }
1012 1039
1013 1040 .only-pro-content a:hover {
@@ -1047,275 +1074,4 @@
1047 1074 #permissions-form .only-pro-feature > ul {
1048 1075 position: relative;
1049 1076 text-align: center;
1050 1077 }
1051 -
1052 -/******************************************************************************/
1053 -/******************************** DB WIZARD ***********************************/
1054 -/******************************************************************************/
1055 -.db-wizard-condition .select-condition {
1056 - display: none;
1057 -}
1058 -
1059 -.db-wizard-condition .select-condition.active {
1060 - display: block;
1061 - max-width: 50%;
1062 - margin-top: 10px;
1063 - padding-top: 10px;
1064 - border-top: 1px solid #eee;
1065 - font-weight: 500;
1066 -}
1067 -
1068 -.db-wizard-results {
1069 - width: calc(100% - 350px);
1070 -}
1071 -
1072 -#db-wizard-form {
1073 - padding: 25px;
1074 -}
1075 -
1076 -.db-wizard-query label {
1077 - display: block;
1078 - min-width: 150px;
1079 - padding: 20px 0 5px;
1080 - color: rgba(0,0,0,0.85);
1081 - font-size: 18px;
1082 - font-weight: 500;
1083 -}
1084 -
1085 -.db-wizard-query .db-wizard-where label,
1086 -.db-wizard-query .db-wizard-from label {
1087 - padding-top: 0;
1088 -}
1089 -
1090 -.db-wizard-query > div:not(:last-child) {
1091 - margin-bottom: 15px;
1092 -}
1093 -
1094 -.db-wizard-query .select-condition > div {
1095 - display: block;
1096 -}
1097 -
1098 -.db-wizard-query .chosen-container {
1099 - width: auto;
1100 -}
1101 -
1102 -.db-wizard-query .chosen-container-single .chosen-single {
1103 - border: 1px solid #ccc;
1104 - background: #fff;
1105 - box-shadow: none;
1106 - font-size: 13px;
1107 - font-weight: 500;
1108 -}
1109 -
1110 -.db-wizard-templates,
1111 -.db-wizard-templates > div {
1112 - display: block;
1113 -}
1114 -
1115 -.db-wizard-templates > div {
1116 - box-sizing: border-box;
1117 - width: 50%;
1118 - margin-top: 20px;
1119 - padding: 20px;
1120 - border: 1px solid #efefef;
1121 -}
1122 -
1123 -.db-wizard-templates > div:first-child {
1124 - margin-top: 0;
1125 -}
1126 -
1127 -.db-wizard-query .chosen-container-multi .chosen-choices {
1128 - padding: 5px;
1129 - border-color: #ccc;
1130 - background: #fff;
1131 - box-shadow: none;
1132 -}
1133 -
1134 -.db-wizard-results .dataTables_wrapper .dataTables_filter input,
1135 -.db-wizard-query .select-condition-operand input,
1136 -.db-wizard-limit input {
1137 - width: 50%;
1138 - padding-left: 7px;
1139 - border: 1px solid #ccc;
1140 - border-radius: 6px;
1141 - background: #fff;
1142 - box-shadow: none;
1143 - font-size: 13px;
1144 -}
1145 -
1146 -.db-wizard-limit input {
1147 - display: inline;
1148 - width: 150px;
1149 - margin: 0 0 20px 20px;
1150 -}
1151 -
1152 -.db-wizard-limit label {
1153 - display: inline;
1154 -}
1155 -
1156 -.db-wizard-query .select-condition-operand input::-webkit-input-placeholder {
1157 - color: #cdcdcd;
1158 -}
1159 -
1160 -.db-wizard-query .select-condition-operand input:-ms-input-placeholder {
1161 - color: #cdcdcd;
1162 -}
1163 -
1164 -.db-wizard-query .select-condition-operand input::placeholder {
1165 - color: #cdcdcd;
1166 -}
1167 -
1168 -.db-wizard-query .chosen-container-multi .chosen-choices li.search-choice {
1169 - padding: 5px 30px 5px 5px;
1170 - border-color: #ccc;
1171 - background: #fff;
1172 - box-shadow: none;
1173 - font-weight: 600;
1174 -}
1175 -
1176 -.db-wizard-results table > thead > tr > th {
1177 - padding: 15px 8px;
1178 - border: none;
1179 - color: #252422;
1180 - background: #fff;
1181 - font-size: 18px;
1182 - font-weight: 500;
1183 - text-align: left;
1184 -}
1185 -
1186 -.db-wizard-results table > tbody > tr > td,
1187 -.dataTables_info {
1188 - padding: 15px 8px;
1189 - border-top: 1px solid #a2a2a2;
1190 - color: #252422;
1191 - font-size: 14px;
1192 - font-weight: 300;
1193 -}
1194 -
1195 -.db-wizard-results table > tbody > tr.odd {
1196 - background-color: #f7f7f7;
1197 -}
1198 -
1199 -.db-wizard-results table.dataTable.no-footer {
1200 - border: none;
1201 -}
1202 -
1203 -.db-wizard-results .dataTables_wrapper .dataTables_info {
1204 - border-top: 1px solid #ccc5b9;
1205 - color: #a2a2a2;
1206 - font-size: 12px;
1207 - font-weight: 500;
1208 -}
1209 -
1210 -.db-wizard-results .dataTables_filter label {
1211 - font-size: 18px;
1212 - font-weight: 500;
1213 -}
1214 -
1215 -.db-wizard-where-template-remove,
1216 -.db-wizard-where-template-add {
1217 - width: auto;
1218 - height: 25px;
1219 - margin-top: 10px;
1220 - border: none;
1221 - border-radius: 3px;
1222 - color: #fff;
1223 - font-size: 12px;
1224 - cursor: pointer;
1225 - transition: 0.3s ease;
1226 -}
1227 -
1228 -.db-wizard-where-template-remove:hover,
1229 -.db-wizard-where-template-add:hover {
1230 - opacity: 0.8;
1231 -}
1232 -
1233 -.db-wizard-results .dataTables_wrapper .dataTables_filter {
1234 - float: none;
1235 - text-align: left;
1236 -}
1237 -
1238 -.db-wizard-where-template-add {
1239 - background-color: #34a85e;
1240 -}
1241 -
1242 -.db-wizard-where-template-remove {
1243 - background-color: #ff0d00;
1244 -}
1245 -
1246 -#db-query-form .CodeMirror-scroll {
1247 - overflow: hidden !important;
1248 - height: 50%;
1249 - margin: 0;
1250 - padding: 0;
1251 -}
1252 -
1253 -#db-query-form .CodeMirror-wrap {
1254 - height: 200px;
1255 - padding: 15px;
1256 - color: #fff;
1257 - background: #282923;
1258 - font-size: 15px;
1259 -}
1260 -
1261 -#db-query-form .CodeMirror-wrap .CodeMirror-cursor {
1262 - border-left: 1px solid #fff !important;
1263 -}
1264 -
1265 -#db-query-form .CodeMirror-wrap .CodeMirror-placeholder {
1266 - color: #fff;
1267 -}
1268 -
1269 -#db-query-form .CodeMirror-wrap pre {
1270 - color: #fff !important;
1271 -}
1272 -
1273 -#db-query-form .CodeMirror-wrap pre .cm-keyword {
1274 - color: #f92472 !important;
1275 -}
1276 -
1277 -#db-query-form .CodeMirror-wrap pre .cm-comment {
1278 - color: #74705d !important;
1279 -}
1280 -
1281 -#db-query-form .CodeMirror-wrap pre .cm-number,
1282 -#db-query-form .CodeMirror-wrap pre .cm-string {
1283 - color: #fff !important;
1284 -}
1285 -
1286 -.visualizer-db-query-form > div {
1287 - display: block;
1288 - width: 15%;
1289 - vertical-align: middle;
1290 -}
1291 -
1292 -#visualizer-db-query {
1293 - padding: 20px;
1294 -}
1295 -
1296 -.visualizer-db-query-form > div:first-child {
1297 - width: 100%;
1298 - margin-bottom: 20px;
1299 -}
1300 -
1301 -.db-wizard-error {
1302 - color: #f00;
1303 -}
1304 -
1305 -.db-wizard-hints {
1306 - margin-bottom: 30px;
1307 - color: #0085ba;
1308 -}
1309 -
1310 -.db-wizard-hints .visualizer-emboss,
1311 -.db-wizard-hints a {
1312 - color: #f92472;
1313 -}
1314 -
1315 -.db-wizard-hints ul {
1316 - list-style: square;
1317 -}
1318 -
1319 -.db-wizard-results .dataTables_wrapper .dataTables_info {
1320 - width: calc(100% - 17px);
1321 -}