PluginProbe
Visualizer – Tables & Charts Manager with Built-in AI Generator / 1.5.5
Visualizer – Tables & Charts Manager with Built-in AI Generator v1.5.5
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 | css/frame.css +349 -1188 3.10.131.5.5 View file →
@@ -1,52 +1,29 @@
1 1 #content {
2 - overflow: auto;
3 2 position: absolute;
4 - z-index: 75;
5 3 top: 0;
6 4 right: 0;
7 5 bottom: 60px;
8 6 left: 0;
9 - width: auto;
7 + z-index: 75;
8 + overflow: auto;
10 9 background-color: white;
11 10 }
12 11
13 12 #canvas {
14 13 position: absolute;
14 + left: 10px;
15 + right: 310px;
15 16 top: 10px;
16 - right: 310px;
17 17 bottom: 10px;
18 - left: 10px;
19 18 }
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 -}
19 +
43 20 .loader {
44 21 position: absolute;
22 + left: 50%;
45 23 top: 50%;
46 - left: 50%;
24 + margin-left: -16px;
47 25 margin-top: -16px;
48 - margin-left: -16px;
49 26 }
50 27
51 28 /******************************************************************************/
52 29 /******************************** SIDEBAR ***********************************/
@@ -52,277 +29,220 @@
52 29 /******************************** SIDEBAR ***********************************/
53 30 /******************************************************************************/
54 31
55 32 #sidebar {
56 - overflow: auto;
57 33 position: absolute;
58 - z-index: 75;
59 34 top: 0;
60 35 right: 0;
61 36 bottom: 60px;
62 - width: 350px;
63 - border-left: 1px solid #dfdfdf;
37 + width: 299px;
38 + z-index: 75;
64 39 background: whitesmoke;
65 -
40 + border-left: 1px solid #DFDFDF;
41 + overflow: auto;
66 42 -webkit-overflow-scrolling: touch;
67 43 }
68 44
69 -.viz-group {
45 +.group-wrapper {
46 + border-top: 1px solid #DFDFDF;
70 47 margin: 0;
71 - font-size: 12px;
72 - line-height: 18px;
48 + padding: 0;
73 49 list-style: none;
74 50 }
75 51
76 -.viz-group .viz-group-header .viz-group-title {
77 - margin: 10px 0;
78 - padding: 15px 20px;
79 - border-top: 1px solid #ddd;
80 - border-bottom: 1px solid #ddd;
81 - color: #555d66;
82 - background: #fff;
52 +.group {
53 + margin: 0;
54 + list-style: none;
55 + font-size: 12px;
56 + line-height: 18px;
83 57 }
84 58
85 -.viz-group-wrapper ul .viz-group-title {
86 - border-top: 1px solid #ddd;
87 -}
59 +.group.open {
60 + border-bottom: 1px solid #DFDFDF;
88 61
89 -.viz-group-wrapper ul li {
90 - border-top: 1px solid #ddd;
91 62 }
92 63
93 -.viz-group-wrapper ul ul li.viz-subsection {
94 - margin: 5px;
95 - border: 1px solid #ddd;
96 -}
97 -
98 -.viz-group-wrapper .viz-group .viz-group .viz-group-title {
64 +.group-title {
65 + border-top: 1px solid white;
66 + border-bottom: 1px solid #DFDFDF;
99 67 position: relative;
68 + cursor: pointer;
69 + -webkit-user-select: none;
70 + -moz-user-select: none;
71 + -ms-user-select: none;
72 + user-select: none;
100 73 margin: 0;
101 - padding: 10px 10px 11px 14px;
102 - border-top: none;
103 - border-bottom: none;
104 - border-left: 4px solid #fff;
105 - color: #555d66;
106 - background-color: #fff;
107 - font-size: 14px;
108 - font-weight: 600;
109 - line-height: 21px;
110 - cursor: pointer;
111 - transition: 0.15s color ease-in-out,0.15s background-color ease-in-out,0.15s border-color ease-in-out;
74 + padding: 10px 20px;
75 + font-size: 15px;
76 + font-family: Georgia, "Times New Roman", "Bitstream Charter", Times, serif;
77 + font-weight: normal;
78 + text-shadow: 0 1px 0 white;
79 + background: whiteSmoke;
80 + background-image: -webkit-gradient(linear, left bottom, left top, from(#EEE), to(whiteSmoke));
81 + background-image: -webkit-linear-gradient(bottom, #EEE, whiteSmoke);
82 + background-image: -moz-linear-gradient(bottom, #EEE, whiteSmoke);
83 + background-image: -o-linear-gradient(bottom, #EEE, whiteSmoke);
84 + background-image: -ms-linear-gradient(bottom, #EEE, whiteSmoke);
85 + background-image: linear-gradient(bottom, #EEE, whiteSmoke);
86 + font-family: "Open Sans",sans-serif;
87 + font-weight: 700;
112 88 }
113 89
114 -.viz-title-small {
115 - font-size: smaller;
90 +.group-title:hover,
91 +.group.open .group-title {
92 + color: white;
93 + text-shadow: 0 -1px 0 #333;
94 + background: gray;
95 + background-image: -webkit-gradient(linear, left bottom, left top, from(#6D6D6D), to(gray));
96 + background-image: -webkit-linear-gradient(bottom, #6D6D6D, gray);
97 + background-image: -moz-linear-gradient(bottom, #6D6D6D, gray);
98 + background-image: -o-linear-gradient(bottom, #6D6D6D, gray);
99 + background-image: -ms-linear-gradient(bottom, #6D6D6D, gray);
100 + background-image: linear-gradient(bottom, #6D6D6D, gray);
101 + font-family: "Open Sans", sans-serif;
102 + font-weight: 700;
116 103 }
117 104
118 -.viz-group-wrapper .viz-group .viz-group:hover .viz-group-title,
119 -.viz-group-wrapper .viz-group .viz-group.open .viz-group-title {
120 - border-left-color: #0073aa;
121 - color: #0073aa;
122 - background: #f3f3f5;
123 -}
124 -
125 -.viz-group-wrapper .viz-group .viz-group .viz-group-title:after {
105 +.group-title::after {
106 + content: '';
107 + width: 0;
108 + height: 0;
109 + border-color: #CCC transparent;
110 + border-style: solid;
111 + border-width: 6px 6px 0;
126 112 position: absolute;
113 + top: 15px;
114 + right: 20px;
127 115 z-index: 1;
128 - top: 11px;
129 - right: 10px;
130 - color: #a0a5aa;
131 - font: 400 20px/1 dashicons;
132 - content: "\f345";
133 116 }
134 117
135 -.viz-group-wrapper .viz-group .viz-group.open .viz-group-title:after {
136 - content: "\f347";
118 +.group-title:hover::after,
119 +.group.open .group-title::after {
120 + border-color: #EEE transparent;
137 121 }
138 122
139 -.viz-group-wrapper .viz-group .customize-section-back {
140 - display: block;
141 - float: left;
142 - width: 42px;
143 - height: 49px;
144 - margin: 0 15px 0 0;
145 - padding: 0;
146 - border: none;
147 - border-top: 1px solid #ddd;
148 - border-right: 1px solid #ddd;
149 - border-left: 4px solid #fff;
150 - background: #fff;
151 - box-shadow: none;
152 - cursor: pointer;
153 - transition: color 0.15s ease-in-out,border-color 0.15s ease-in-out,background 0.15s ease-in-out;
123 +.group:hover .group-title {
124 + border-top-color: gray;
154 125 }
155 126
156 -.viz-group-wrapper .viz-group .customize-section-back:hover {
157 - border-left-color: #0073aa;
158 - outline: 0;
159 - color: #0073aa;
160 - background: #f3f3f5;
127 +.group.open .group-title {
128 + border-top-color: #6D6D6D;
161 129 }
162 130
163 -.viz-group-wrapper .viz-group .customize-section-back:before {
164 - position: relative;
165 - top: -11px;
166 - left: -2px;
167 - font: 400 20px/72px dashicons;
168 - content: "\f341";
131 +.group.open .group-title::after {
132 + border-width: 0 6px 6px;
169 133 }
170 134
171 -.viz-group-wrapper.full-height {
172 - float: left;
173 - position: relative;
174 - width: 100%;
175 - height: 100%;
135 +.group-content {
176 136 margin: 0;
177 -}
178 -
179 -.viz-group.bottom-fixed {
180 - display: block;
181 - position: absolute;
182 - bottom: 0;
183 - width: 100%;
184 -}
185 -
186 -.viz-group ul li h2,
187 -.viz-group ul li h3 {
188 - padding: 7px 15px 7px 35px;
189 -}
190 -
191 -.viz-group h2 .dashicons,
192 -.viz-group h3 .dashicons {
193 - margin-right: 5px;
194 - vertical-align: -5px;
195 -}
196 -
197 -.viz-group-content {
198 137 display: none;
199 - margin: 0;
200 - padding: 0;
201 - background-color: #fdfdfd;
138 + background-color: #FDFDFD;
139 + padding: 10px 0 20px 0;
140 + overflow: hidden;
202 141 }
203 142
204 -div.viz-group-content {
205 - padding: 15px;
143 +div.group-content {
144 + padding: 10px 20px 20px;
206 145 }
207 146
208 -.viz-group.open > .viz-group-content {
147 +.group.open .group-content {
209 148 display: block;
210 149 }
211 150
212 -.viz-group-description {
151 +.group-description {
152 + font-size: 12px;
153 + color: #555;
154 + padding: 5px 20px 10px;
213 155 margin: 0;
214 - padding: 5px;
215 - color: #555;
216 - font-size: 12px;
217 - text-align: left;
218 156 }
219 157
220 -div.viz-group-content .viz-group-description {
221 - padding: 5px;
158 +div.group-content .group-description {
159 + padding: 0;
160 + font-weight: 300;
222 161 font-family: "Montserrat",sans-serif;
223 - font-weight: 300;
224 162 }
225 163
226 -.initial-screen .viz-group-description {
164 +.initial-screen .group-description {
227 165 padding: 0;
166 + font-weight: 300;
167 + font-family: "Montserrat",sans-serif;
228 168 padding: 10px 20px 20px;
229 - font-family: "Montserrat",sans-serif;
230 - font-weight: 300;
231 169 }
232 170
233 -.viz-section-title {
171 +.section-title {
234 172 display: block;
173 + font-weight: bold;
235 174 position: relative;
175 + cursor: pointer;
176 + padding: 4px 20px;
236 177 margin-bottom: 5px;
237 - padding: 4px 20px;
238 - border-top: 1px solid #eee;
239 - border-bottom: 1px solid #eee;
240 178 background-color: rgba(0, 0, 0, 0.02);
179 + border-top: 1px solid #eeeeee;
180 + -webkit-box-shadow: 0 4px 4px -4px rgba(0, 0, 0, 0.1);
241 181 box-shadow: 0 4px 4px -4px rgba(0, 0, 0, 0.1);
242 - font-weight: bold;
243 - cursor: pointer;
182 + border-bottom: 1px solid #eeeeee;
244 183 }
245 184
246 -.viz-group-wrapper ul ul li .viz-section-title {
247 - margin-bottom: 0;
248 - border: none;
249 - box-shadow: none;
250 -}
251 -
252 -.viz-section-title::after {
185 +.section-title::after {
186 + content: '';
187 + width: 0;
188 + height: 0;
189 + border-color: #CCC transparent;
190 + border-style: solid;
191 + border-width: 4px 4px 0;
253 192 position: absolute;
254 - z-index: 1;
255 193 top: 13px;
256 194 right: 20px;
257 - width: 0;
258 - height: 0;
259 - border-width: 4px 4px 0;
260 - border-style: solid;
261 - border-color: #ccc transparent;
262 - content: "";
195 + z-index: 1;
263 196 }
264 197
265 -.viz-section-title.open::after {
198 +.section-title.open::after {
266 199 border-width: 0 4px 4px;
267 200 }
268 201
269 -.section-items,
270 -.viz-section-items {
202 +.section-items {
271 203 display: none;
272 - padding: 15px;
204 + padding: 5px 20px 10px 20px;
273 205 }
274 206
275 -.viz-section-items.open {
207 +.section-items.open {
276 208 display: block;
277 209 }
278 210
279 211 .more-info {
280 - display: none;
281 - float: right;
282 - color: #21759b;
212 + text-decoration: none;
213 + color: #21759B;
283 214 font-size: 85%;
284 215 font-weight: normal;
285 - text-decoration: none;
216 + float: right;
217 + display: none;
286 218 }
287 219
288 -.viz-info-msg {
289 - font-weight: bold !important;
290 - font-style: italic;
291 -}
292 -
293 -.viz-info-msg::before {
294 - font-family: dashicons;
295 - content: "\f488";
296 - margin-right: 5px;
297 -}
298 -
299 -.viz-section-description {
300 - margin: 0;
220 +.section-description {
301 221 /*display: none;*/
302 222 padding: 0;
223 + margin: 0;
224 + font-size: 11px;
303 225 color: gray;
304 - font-size: 11px;
305 226 }
306 227
307 -.viz-section-table {
228 +.section-table {
308 229 width: 100%;
309 230 }
310 231
311 -.section-delimiter,
312 -.viz-section-delimiter {
232 +.section-delimiter {
313 233 margin: 15px 0;
314 234 border-top: 1px dashed #ccc;
315 235 }
316 236
317 -.viz-section-table-column {
237 +.section-table-column {
318 238 width: 50%;
319 - padding: 0 1px;
320 239 text-align: left;
321 240 vertical-align: top;
241 + padding: 0 1px;
322 242 }
323 243
324 -.viz-section-item {
244 +.section-item {
325 245 margin-bottom: 10px;
326 246 }
327 247
328 248 .control-select,
@@ -329,24 +249,16 @@
329 249 .control-text {
330 250 width: 100%;
331 251 }
332 252
333 -.control-check {
334 - float: right;
335 -}
336 -
337 -.control-check::after {
338 - clear: both;
339 -}
340 -
341 -.viz-section-description ul {
253 +.section-description ul {
342 254 margin: 0 0 0 25px;
343 255 list-style: circle;
344 256 }
345 257
346 -.viz-section-description li {
258 +.section-description li {
259 + list-style: circle;
347 260 margin: 0;
348 - list-style: circle;
349 261 }
350 262
351 263 #rate-the-plugin {
352 264 margin-top: 40px;
@@ -354,26 +266,26 @@
354 266 border-top: 1px dashed #ddd;
355 267 text-align: center;
356 268 }
357 269
358 -.rate-the-plugin {
270 +.rate-the-plugin{
359 271 width: 40% !important;
360 - margin-top: -5px;
272 + margin-top: -5px;
361 273 }
362 274
363 275 #rate-stars {
276 + margin: 15px auto;
364 277 width: 100px;
365 278 height: 20px;
366 - margin: 15px auto;
367 - background-image: url("../images/star.png");
279 + background-image: url('../images/star.png');
368 280 background-repeat: repeat-x;
369 281 background-position: right center;
370 282 }
371 283
372 284 #rate-link {
285 + text-decoration: none;
373 286 font-family: "Montserrat",sans-serif;
374 - font-weight: 400;
375 - text-decoration: none;
287 + font-weight: 400;
376 288 }
377 289
378 290 #flattr {
379 291 margin-top: 15px;
@@ -379,59 +291,34 @@
379 291 margin-top: 15px;
380 292 text-align: center;
381 293 }
382 294
383 -#viz-tabs {
384 - display: none;
385 -}
386 -
387 -#viz-tabs.done {
388 - display: block;
389 -}
390 -
391 -#viz-tabs .ui-tabs-panel {
392 - padding: 0;
393 -}
394 -
395 -#viz-tabs .wp-color-picker {
396 - width: 4rem !important;
397 -}
398 295 /******************************************************************************/
399 296 /******************************** TOOLBAR ***********************************/
400 297 /******************************************************************************/
401 298
402 299 #toolbar {
403 - overflow: hidden;
300 + height: 36px;
301 + padding: 12px 16px;
404 302 position: absolute;
405 303 z-index: 100;
304 + left: 0;
406 305 right: 0;
407 306 bottom: 0;
408 - left: 0;
409 - height: 36px;
410 - padding: 12px 16px;
411 - border-top: 1px solid #dfdfdf;
307 + border-top: 1px solid #DFDFDF;
308 + overflow: hidden;
309 + -webkit-box-shadow: 0 -4px 4px -4px rgba(0, 0, 0, 0.1);
412 310 box-shadow: 0 -4px 4px -4px rgba(0, 0, 0, 0.1);
413 - text-align: center;
414 311 }
415 312
416 313 #toolbar .push-right {
417 314 float: right;
418 - margin-right: 10px;
419 315 }
420 316
421 -#toolbar .push-left {
422 - float: left;
423 -}
424 -
425 -.toolbar-div a {
426 - float: left;
427 -}
428 -
429 -.toolbar-div {
430 - display: inline-block;
431 - float: left;
317 +.toolbar-div{
318 + display: inline-block;
319 + vertical-align: top;
432 320 width: 30%;
433 - vertical-align: top;
434 321 }
435 322
436 323 /******************************************************************************/
437 324 /******************************** TYPE PICKER ******************************/
@@ -436,97 +323,61 @@
436 323 /******************************************************************************/
437 324 /******************************** TYPE PICKER ******************************/
438 325 /******************************************************************************/
439 326
440 -.type-box span {
441 - display: block;
442 - position: absolute;
443 - right: 0;
444 - bottom: -6px;
445 - width: 100%;
446 - padding: 4px 0;
447 - border-top: 1px dashed #ddd;
448 - border-bottom: 1px dashed #ddd;
449 - background: #e0e0e0;
450 - background-color: #efefef;
451 - box-shadow: 0 0 8px #ddd;
452 - font-weight: bold;
453 - text-align: center;
454 -}
455 -
456 -.type-box .pro-upsell {
457 - color: #c55555;
458 -}
459 -
460 327 #type-picker {
461 - width: 954px;
462 328 margin: 50px auto;
329 + width: 952px;
463 330 }
464 331
465 332 .type-box {
466 333 float: left;
467 - position: relative;
468 334 margin: 0 20px 20px 0;
469 335 border: 1px dashed #ddd;
336 + -webkit-box-shadow: 0px 0px 8px #ddd;
337 + box-shadow: 0px 0px 8px #ddd;
470 338 background-color: #efefef;
471 - box-shadow: 0 0 8px #ddd;
472 339 }
473 340
474 341 .type-box:nth-child(3n+3) {
475 - margin-right: 0;
342 + margin-right: 0px;
476 343 }
477 344
478 -.type-box .pro-upsell .visualizder-pro-label {
479 - display: inline;
480 - position: absolute;
481 - top: 0;
482 - width: 74px;
483 - height: 10px;
484 - height: 17px;
485 - border: none;
486 - color: #fff;
487 - z-index: 1;
488 - background: #c55555;
489 -}
490 -
491 345 .type-label {
492 346 display: block;
493 347 width: 270px;
494 - height: 205px;
348 + height: 195px;
495 349 padding: 15px;
496 - border: 1px solid #e0e0e0;
497 350 background-color: white;
498 - background-image: url(../images/chart_types_v395.png);
351 + background-image: url(../images/chart_types_g.png);
499 352 background-repeat: no-repeat;
500 353 background-position: center center;
501 - background-size: 900px 1150px;
502 - filter: grayscale(100%);
354 + border: 1px solid #e0e0e0;
503 355 }
504 356
505 357 .type-label-selected,
506 -.type-box .type-label:hover {
507 -/* background-image: url(../images/chart_types_v340.png);*/
508 - filter: grayscale(0);
358 +.type-label:hover {
359 + background-image: url(../images/chart_types.png);
509 360 }
510 361
511 362 .type-box-area .type-label {
512 - background-position: -8px -225px;
363 + background-position: 0px -225px;
513 364 }
514 365
515 366 .type-box-line .type-label {
516 - background-position: -600px 0;
367 + background-position: -600px 0px;
517 368 }
518 369
519 370 .type-box-scatter .type-label {
520 - background-position: -300px 0;
371 + background-position: -300px 0px;
521 372 }
522 373
523 374 .type-box-pie .type-label {
524 - background-position: 0 0;
375 + background-position: 0px 0px;
525 376 }
526 377
527 378 .type-box-gauge .type-label {
528 - background-position: -7px -450px;
379 + background-position: 0px -450px;
529 380 }
530 381
531 382 .type-box-geo .type-label {
532 383 background-position: -600px -450px;
@@ -532,9 +383,9 @@
532 383 background-position: -600px -450px;
533 384 }
534 385
535 386 .type-box-candlestick .type-label {
536 - background-position: -304px -450px;
387 + background-position: -300px -450px;
537 388 }
538 389
539 390 .type-box-bar .type-label {
540 391 background-position: -300px -225px;
@@ -539,38 +390,12 @@
539 390 .type-box-bar .type-label {
540 391 background-position: -300px -225px;
541 392 }
542 393
543 -.type-box-bubble .type-label {
544 - background-position: -604px -906px;
545 -}
546 -
547 394 .type-box-column .type-label {
548 395 background-position: -600px -225px;
549 396 }
550 397
551 -.type-box-dataTable .type-label,
552 -.type-box-table .type-label,
553 -.type-box-tabular .type-label {
554 - background-position: -301px -670px;
555 -}
556 -
557 -.type-box-timeline .type-label {
558 - background-position: -8px -670px;
559 -}
560 -
561 -.type-box-combo .type-label {
562 - background-position: -606px -670px;
563 -}
564 -
565 -.type-box-polarArea .type-label {
566 - background-position: -2px -912px;
567 -}
568 -
569 -.type-box-radar .type-label {
570 - background-position: -301px -899px;
571 -}
572 -
573 398 /******************************************************************************/
574 399 /******************************** OTHER STYLES ******************************/
575 400 /******************************************************************************/
576 401
@@ -575,33 +400,30 @@
575 400 /******************************************************************************/
576 401
577 402 #thehole {
578 403 position: absolute;
404 + left: 0;
579 405 top: 0;
580 - left: 0;
581 406 width: 1px;
582 407 height: 1px;
583 408 border: 0;
584 - opacity: 0;
585 -
586 - filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0);
587 - -moz-opacity: 0;
409 + opacity: 0;
410 + -moz-opacity: 0;
411 + filter:progid:DXImageTransform.Microsoft.Alpha(opacity=0);
588 412 }
589 413
590 -.locker,
591 -.locker-loader {
414 +.locker, .locker-loader {
415 + left: 0;
416 + top: 0;
592 417 position: absolute;
593 - top: 0;
594 - left: 0;
595 418 }
596 419
597 420 .locker {
598 421 z-index: 1000;
599 - opacity: 0.8;
600 422 background-color: white;
601 -
602 423 -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
603 424 filter: alpha(opacity=80);
425 + opacity: 0.8;
604 426 }
605 427
606 428 .locker-loader {
607 429 z-index: 1001;
@@ -608,210 +430,253 @@
608 430 background: url(../images/ajax-loader.gif) no-repeat center center;
609 431 }
610 432
611 433 .file-wrapper {
612 - display: inline-block;
613 - width: auto;
614 - max-width: 133px;
434 + display: inline-block;
435 + width: auto;
436 + max-width: 133px;
615 437 }
616 438
617 439 .file {
618 - position: fixed;
619 - max-width: 138px;
620 - margin-top: -6px;
621 - margin-left: -33px;
622 - opacity: 0;
623 - font-size: 22px;
624 - cursor: pointer;
625 -
626 - filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0);
627 - -moz-opacity: 0;
440 + font-size: 22px;
441 + position: fixed;
442 + opacity: 0;
443 + margin-left: -33px;
444 + margin-top: -6px;
445 + -moz-opacity: 0;
446 + filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0);
447 + cursor: pointer;
448 + max-width: 138px;
628 449 }
629 450
630 451 #remote-file {
631 - display: inline-block;
632 - float: right;
633 - margin-left: 6px;
452 + float: right;
453 + display: inline-block;
454 + margin-left: 6px;
634 455 }
635 456
636 -.form-inline {
637 - display: table;
638 - /*margin: 0 auto;*/
639 - width: 100%;
640 - vertical-align: middle;
641 -}
457 + .form-inline {
458 + /*margin: 0 auto;*/
459 + width:100%;
460 + display: table;
461 + vertical-align: middle;
462 + }
642 463
643 -.computer-btn {
644 - overflow: hidden;
645 - left: -18px;
464 + .computer-btn{
465 + color: #646464 !important;
466 + border: medium none rgb(100, 100, 100) !important;
467 + background: #E6E6E6 url("../images/computer.png") no-repeat scroll 7px 1px !important;
646 468 padding-left: 27px !important;
647 - border: medium none rgb(100, 100, 100) !important;
648 - border: 1px solid #b0b0b0 !important;
649 - color: #646464 !important;
650 - background: #e6e6e6 url("../images/computer.png") no-repeat scroll 7px 1px !important;
651 - box-shadow: none !important;
652 - text-shadow: none!important;
469 + transition: all 0.3s ease 0s;
653 470 font-family: "Open Sans",sans-serif;
654 471 font-weight: 700;
472 + border: 1px solid #B0B0B0 !important;
473 + box-shadow: none !important;
474 + text-shadow:none!important;
475 + left: -18px;
476 + overflow: hidden;
477 +
478 + }
479 +
480 + .computer-btn:hover{
481 + color: white !important;
482 + background: #2f8cea url("../images/computer.png") no-repeat scroll 7px -36px !important;
655 483 transition: all 0.3s ease 0s;
656 -}
657 -
658 -.computer-btn:hover {
659 484 padding-left: 27px !important;
485 + -webkit-transition: all .3s ease;
486 + -moz-transition: all .3s ease;
487 + -ms-transition: all .3s ease;
488 + -o-transition: all .3s ease;
489 + transition: all .3s ease;
490 + box-shadow: 0px 1px 0px rgba(171, 171, 171, 0.5) inset, 0px 1px 0px rgba(0, 0, 0, 0.15) !important;
660 491 border: 1px solid #2f8cea !important;
661 - color: white !important;
662 - background: #2f8cea url("../images/computer.png") no-repeat scroll 7px -36px !important;
663 - box-shadow: 0 1px 0 rgba(171, 171, 171, 0.5) inset, 0 1px 0 rgba(0, 0, 0, 0.15) !important;
664 492 box-shadow: none !important;
665 - transition: all 0.3s ease 0s;
666 - transition: all 0.3s ease;
667 -}
668 493
669 -.from-web {
670 - margin-top: 0;
494 +
495 + }
496 +
497 + .just-on-pro{
498 + background: #F5F5F5 url("../images/available_pro.png") no-repeat scroll 0px 1px !important;
499 + width: 250px;
500 + height: 100px;
501 + cursor:not-allowed;
502 + opacity: 0.8;
503 + margin-bottom: 10px;
504 + }
505 +
506 +
507 +
508 + .from-web{
509 + margin-top: 0px;
671 510 margin-bottom: 15px !important;
672 511 }
673 512
674 -.from-web-btn {
513 + .from-web-btn{
514 + color: #646464 !important;
515 + border: medium none #646464 !important;
516 + background: #E6E6E6 url("../images/web.png") no-repeat scroll 7px 1px !important;
675 517 padding-left: 25px !important;
676 - border: medium none #646464 !important;
677 - border: 1px solid #b0b0b0 !important;
678 - color: #646464 !important;
679 - background: #e6e6e6 url("../images/web.png") no-repeat scroll 7px 1px !important;
518 + transition: all 0.3s ease 0s;
519 + border: 1px solid #B0B0B0 !important;
680 520 box-shadow: none !important;
681 521 font-family: "Open Sans",sans-serif;
682 522 font-weight: 700;
683 - transition: all 0.3s ease 0s;
684 523 /*margin-left: 2px !important;*/
685 524 }
686 525
687 -.from-web-btn:hover {
526 + .from-web-btn:hover{
527 + color: white !important;
528 + background: #89B158 url("../images/web.png") no-repeat scroll 7px -38px !important;
529 + transition: all 0.3s ease 0s;
688 530 padding-left: 25px !important;
531 + -webkit-transition: all .3s ease;
532 + -moz-transition: all .3s ease;
533 + -ms-transition: all .3s ease;
534 + -o-transition: all .3s ease;
535 + transition: all .3s ease;
689 536 /*margin-left: 2px !important;*/
690 - border: 1px solid #89b158 !important;
691 - color: white !important;
692 - background: #89b158 url("../images/web.png") no-repeat scroll 7px -38px !important;
537 + border: 1px solid #89B158 !important;
693 538 box-shadow: none !important;
694 - transition: all 0.3s ease 0s;
695 - transition: all 0.3s ease;
696 539 }
697 540
698 -.preview {
541 +.preview{
699 542 width: 100%;
700 543 }
701 544
545 +
702 546 #sidebar > ul > div.initial-screen > div {
703 547 padding: 0 20px;
704 548 }
705 549
706 -.from-chart-btn {
550 +.from-chart-btn{
551 + color: #646464 !important;
552 + border: medium none #646464 !important;
553 + background: #E6E6E6 url("../images/from_chart.png") no-repeat scroll 7px 1px !important;
707 554 padding-left: 25px !important;
708 - border: medium none #646464 !important;
709 - border: 1px solid #b0b0b0 !important;
710 - color: #646464 !important;
711 - background: #e6e6e6 url("../images/from_chart.png") no-repeat scroll 7px 1px !important;
555 + transition: all 0.3s ease 0s;
556 + border: 1px solid #B0B0B0 !important;
712 557 box-shadow: none !important;
713 558 font-family: "Open Sans",sans-serif;
714 559 font-weight: 700;
715 - transition: all 0.3s ease 0s;
716 560 /*margin-left: 2px !important;
717 561 margin-top: 2px !important;*/
718 562 }
719 563
720 -.from-chart-btn:hover {
721 - padding-left: 25px !important;
722 - /*margin-left: 2px !important;*/
723 - border: 1px solid #10aecb !important;
724 - color: white !important;
725 - background: #10aecb url("../images/from_chart.png") no-repeat scroll 7px -36px !important;
726 - box-shadow: none !important;
727 - transition: all 0.3s ease 0s;
728 - transition: all 0.3s ease;
729 - /*margin-top: 2px !important;*/
730 -}
564 + .from-chart-btn:hover{
565 + color: white !important;
566 + background: #10aecb url("../images/from_chart.png") no-repeat scroll 7px -36px !important;
567 + transition: all 0.3s ease 0s;
568 + padding-left: 25px !important;
569 + -webkit-transition: all .3s ease;
570 + -moz-transition: all .3s ease;
571 + -ms-transition: all .3s ease;
572 + -o-transition: all .3s ease;
573 + transition: all .3s ease;
574 + /*margin-left: 2px !important;*/
575 + border: 1px solid #10aecb !important;
576 + box-shadow: none !important;
577 + /*margin-top: 2px !important;*/
578 + }
731 579
732 -input#existing-chart {
733 - /*left: 18px;
580 + input#existing-chart {
581 + /*left: 18px;
734 582 width: 110px;
735 - position: relative;*/
583 + position: relative;*/
736 584 }
737 585
738 -select#chart-id {
739 - float: right;
740 - width: 146px;
741 - margin-right: 14px;
742 -}
586 + select#chart-id {
587 + float: right;
588 + width: 95px;
589 + }
743 590
744 -button#editor-chart-button {
745 - display: block;
746 - margin: 0 auto;
591 + button#editor-chart-button {
592 + margin: 0 auto;
593 + display: block;
594 + background-color: #2f8cea !important;
595 + color: white !important;
596 + border: 1px solid #2c80d6 !important;
597 + box-shadow: none !important;
598 + -webkit-transition: all .3s ease;
599 + -moz-transition: all .3s ease;
600 + -ms-transition: all .3s ease;
601 + -o-transition: all .3s ease;
602 + transition: all .3s ease;
603 + text-shadow: none;
604 + }
605 +
606 +.preview-btn{
607 + font-family: "Open Sans",sans-serif;
608 + font-weight: 700;
609 + background-color: #2f8cea !important;
610 + color: white !important;
747 611 border: 1px solid #2c80d6 !important;
748 - color: white !important;
749 - background-color: #2f8cea !important;
750 612 box-shadow: none !important;
751 - text-shadow: none;
752 - transition: all 0.3s ease;
613 + -webkit-transition: all .3s ease;
614 + -moz-transition: all .3s ease;
615 + -ms-transition: all .3s ease;
616 + -o-transition: all .3s ease;
617 + transition: all .3s ease;
753 618 }
754 619
755 -.preview-btn {
756 - border: 1px solid #2c80d6 !important;
757 - color: white !important;
758 - background-color: #2f8cea !important;
759 - box-shadow: none !important;
620 +.preview-btn:hover{
760 621 font-family: "Open Sans",sans-serif;
761 622 font-weight: 700;
762 - transition: all 0.3s ease;
763 -}
764 -
765 -.preview-btn:hover {
623 + background-color: #2c80d6 !important;
624 + color: white !important;
766 625 border: 1px solid #2c80d6 !important;
767 - color: white !important;
768 - background-color: #2c80d6 !important;
769 626 box-shadow: none !important;
770 - font-family: "Open Sans",sans-serif;
771 - font-weight: 700;
772 - transition: all 0.3s ease;
627 + -webkit-transition: all .3s ease;
628 + -moz-transition: all .3s ease;
629 + -ms-transition: all .3s ease;
630 + -o-transition: all .3s ease;
631 + transition: all .3s ease;
773 632 }
774 633
775 -.show-live-btn {
634 +.show-live-btn{
635 + margin-top: 15px !important;
776 636 width: 100%;
777 - margin-top: 15px !important;
778 - border-color: #e98b00 !important;
779 - background-color: #f90 !important;
780 - box-shadow: none !important;
637 + background-color: #F90 !important;
638 + border-color: #E98B00 !important;
781 639 font-family: "Open Sans",sans-serif;
782 640 font-weight: 700;
641 + box-shadow: none !important;
783 642 }
784 643
785 -.show-live-btn:hover {
644 +
645 +.show-live-btn:hover{
646 + margin-top: 15px !important;
786 647 width: 100%;
787 - margin-top: 15px !important;
788 - border-color: #e98b00 !important;
789 648 background-color: #ea8c00 !important;
790 - box-shadow: none !important;
649 + border-color: #E98B00 !important;
791 650 font-family: "Open Sans",sans-serif;
792 651 font-weight: 700;
793 - transition: all 0.3s ease;
652 + box-shadow: none !important;
653 + -webkit-transition: all .3s ease;
654 + -moz-transition: all .3s ease;
655 + -ms-transition: all .3s ease;
656 + -o-transition: all .3s ease;
657 + transition: all .3s ease;
794 658 }
795 659
796 660 .check-pro-btn {
661 + height: 40px;
662 + width: 245px;
797 663 display: block;
798 - width: 245px;
799 - height: 40px;
800 664 margin: 0 auto;
801 665 }
802 666
803 -.advanced-settings-btn,
804 -.return-settings-btn {
667 +.advanced-settings-btn, .return-settings-btn {
668 + cursor: pointer;
805 669 display: block;
670 + margin: 0 auto;
671 + line-height: 34px;
672 + font-size: 17px;
806 673 height: auto;
807 - margin: 0 auto;
808 - margin-top: 5px;
674 + -webkit-border-radius: 3px;
675 + -moz-border-radius: 3px;
676 + border-radius: 3px;
809 677 margin-bottom: 20px;
810 - border-radius: 3px;
811 - font-size: 17px;
812 - line-height: 34px;
813 - cursor: pointer;
678 + margin-top:5px;
814 679 }
815 680
816 681 .return-settings-btn {
817 682 width: 90%;
@@ -825,744 +690,40 @@
825 690 margin: 10px auto;
826 691 }
827 692
828 693 .hidden-setting {
829 - display: none;
694 + display:none;
830 695 }
831 696
832 -.viz-select-library {
833 - color: #0085ba;
834 -}
835 -.viz-select-library.viz-hide-libary {
836 - display: none;
837 -}
838 697
839 -.viz-select-library option:first-child {
840 - font-weight: bold;
841 -}
842 698
843 699 /* ====== RESPONSIVE ====== */
844 700
701 +
845 702 @media (max-width: 1366px) {
846 - #rate-stars {
847 - margin: 3px 0 10px 40%;
848 - }
849 -
850 - .rate-the-plugin {
851 - margin-left: -8%;
852 - }
703 + .group-title {
704 + padding: 4px 20px;
705 + font-weight: 400;
706 + font-size: 14px;
707 + }
708 + .group-title::after {
709 + top: 10px;
710 + }
711 + #rate-stars {
712 + margin: 3px 0 10px 40%;
713 + }
714 + .rate-the-plugin {
715 + margin-left: -8%;
716 + }
853 717 }
854 718
855 719 @media screen and (max-width: 782px) {
856 - .button.button-primary.file-wrapper.computer-btn,
857 - #remote-file,
858 - #existing-chart {
859 - height: 28px;
860 - margin-bottom: 4px;
720 +.button.button-primary.file-wrapper.computer-btn, #remote-file, #existing-chart {
861 721 padding: 0 10px 1px;
862 - font-size: 13px;
863 - line-height: 26px;
864 - vertical-align: middle;
722 + line-height: 26px;
723 + font-size: 13px;
724 + vertical-align: middle;
725 + height: 28px;
726 + margin-bottom: 4px;
865 727 }
866 -}
867 728
868 -#vz-chart-settings h2:hover,
869 -#vz-chart-permissions h2:hover,
870 -.sidebar-footer-link h2:hover,
871 -#vz-chart-review a:hover {
872 - text-decoration: none;
873 -}
874 -
875 -#vz-chart-review a {
876 - color: #00a0d2;
877 - text-decoration: none;
878 -}
879 -
880 -#vz-chart-settings h2,
881 -#vz-chart-permissions h2,
882 -.sidebar-footer-link h2,
883 -#vz-chart-review h2 {
884 - padding: 0;
885 - border: none;
886 - font-size: 12px;
887 - font-weight: 400;
888 -}
889 -
890 -#vz-chart-review {
891 - right: 0;
892 - bottom: 10px;
893 - box-sizing: border-box;
894 - width: 40%;
895 - padding-right: 6px;
896 - text-align: right;
897 -}
898 -
899 -#vz-chart-settings.bottom-fixed h2 {
900 - padding-left: 6px;
901 -}
902 -
903 -#vz-chart-settings {
904 - bottom: 40px;
905 - left: 0;
906 - box-sizing: border-box;
907 - width: 33%;
908 - text-align: left;
909 -}
910 -
911 -#vz-chart-permissions:not(.open) h2 {
912 - display: inline-block;
913 - width: 100%;
914 - margin: 0;
915 - text-align: right;
916 -}
917 -
918 -#vz-chart-permissions {
919 - right: 0;
920 - bottom: 40px;
921 - box-sizing: border-box;
922 - width: 33%;
923 - text-align: left;
924 -}
925 -
926 -#vz-chart-permissions h2,
927 -#vz-chart-settings h2,
928 -.sidebar-footer-link h2 {
929 - display: inline;
930 - color: #00a0d2;
931 - background: none;
932 - font-family: "Open Sans",sans-serif;
933 - cursor: pointer;
934 -}
935 -
936 -.sidebar-footer-link,
937 -#vz-chart-review,
938 -#vz-chart-permissions,
939 -#vz-chart-settings {
940 - display: inline;
941 - background: none;
942 - cursor: pointer;
943 -}
944 -
945 -.sidebar-footer-link > ul,
946 -#vz-chart-source > ul,
947 -#vz-chart-permissions > ul,
948 -#vz-chart-settings > ul {
949 - position: relative;
950 - z-index: 10;
951 - border-bottom: 1px solid #ddd;
952 -}
953 -
954 -#vz-chart-copyright {
955 - bottom: 10px;
956 - text-align: center;
957 -}
958 -
959 -#sidebar {
960 - border-left: 1px solid #ddd;
961 - background: #f3f3f3;
962 -}
963 -
964 -#vz-chart-permissions.open h2 {
965 - position: absolute;
966 - right: 6px;
967 - bottom: 28px;
968 - left: auto;
969 - width: 50%;
970 - text-align: right;
971 -}
972 -
973 -#vz-chart-settings.open h2 {
974 - position: absolute;
975 - bottom: 28px;
976 - left: 6px;
977 -}
978 -
979 -#vz-chart-permissions .viz-group-header,
980 -#vz-chart-settings.open .viz-group-header {
981 - display: block;
982 -}
983 -
984 -#vz-chart-permissions .viz-group-header,
985 -#vz-chart-settings .viz-group-header {
986 - display: none;
987 -}
988 -
989 -.sidebar-footer-link.open h2 {
990 - position: absolute;
991 - bottom: 28px;
992 - left: 20px;
993 -}
994 -
995 -.sidebar-footer-link.open .viz-group-header {
996 - display: block;
997 -}
998 -
999 -.sidebar-footer-link .viz-group-header {
1000 - display: none;
1001 -}
1002 -
1003 -#vz-csv-file-form,
1004 -#vz-one-time-import,
1005 -#vz-schedule-import,
1006 -#vz-permissions .only-pro-content,
1007 -.edit-data-content {
1008 - text-align: center;
1009 -}
1010 -
1011 -#csv-file {
1012 - margin: 15px 0;
1013 - padding: 0;
1014 -}
1015 -
1016 -.visualizer-input,
1017 -.visualizer-select {
1018 - width: 100%;
1019 - margin: 0 0 15px;
1020 -}
1021 -
1022 -.viz-group .dashicons-lock {
1023 - display: none;
1024 -}
1025 -
1026 -.only-pro-feature .dashicons-lock {
1027 - display: inline;
1028 -}
1029 -
1030 -.viz-section-title .dashicons,
1031 -.viz-group-title .dashicons {
1032 - width: 18px;
1033 - height: 18px;
1034 - margin-left: 3px;
1035 - font-size: 18px;
1036 -}
1037 -
1038 -.only-pro-feature input,
1039 -.only-pro-feature button,
1040 -.only-pro-feature select {
1041 - cursor: not-allowed !important;
1042 - pointer-events: none;
1043 -}
1044 -
1045 -.only-pro-feature > div {
1046 - position: relative;
1047 -}
1048 -
1049 -.only-pro-content {
1050 - position: absolute;
1051 - top: 0;
1052 - bottom: 0;
1053 - left: 0;
1054 - width: 100%;
1055 - opacity: 0;
1056 - background: rgba(253,253,253,0.9);
1057 - transition: 0.5s ease;
1058 -}
1059 -
1060 -.only-pro-feature:hover .only-pro-content {
1061 - opacity: 1;
1062 -}
1063 -
1064 -.only-pro-container {
1065 - display: table;
1066 - width: 100%;
1067 - height: 100%;
1068 -}
1069 -
1070 -.only-pro-inner {
1071 - display: table-cell;
1072 - vertical-align: middle;
1073 -}
1074 -
1075 -.only-pro-content p {
1076 - margin: 0 0 15px;
1077 - font-size: 14px;
1078 - font-weight: 700;
1079 -}
1080 -
1081 -.only-pro-content a {
1082 - display: inline-block;
1083 - padding: 7px 12px;
1084 - color: #fff;
1085 - background: #3F57E1;
1086 - font-weight: 600;
1087 - text-decoration: none;
1088 - transition: 0.1s ease;
1089 - border-width: 1px;
1090 - border-style: solid;
1091 - border-radius: 3px;
1092 -}
1093 -.only-pro-content .only-pro-container a {
1094 - color: #fff !important;
1095 -}
1096 -
1097 -.only-pro-content a:hover {
1098 - background: #2D419B;
1099 -}
1100 -
1101 -#sidebar::-webkit-scrollbar {
1102 - width: 4px;
1103 -}
1104 -
1105 -#sidebar::-webkit-scrollbar-thumb {
1106 - background: #999;
1107 -}
1108 -
1109 -span.viz-section-error {
1110 - color: #ff000;
1111 -}
1112 -
1113 -#visualizer-error-manual {
1114 - color: #ff595e;
1115 -}
1116 -
1117 -#vz-chart-permissions {
1118 - width: 43%;
1119 -}
1120 -
1121 -#vz-chart-permissions {
1122 - color: #ce484c;
1123 -}
1124 -
1125 -#vz-chart-permissions {
1126 - right: 6px;
1127 - bottom: 40px;
1128 - width: 35%;
1129 -}
1130 -
1131 -#permissions-form .only-pro-feature > ul {
1132 - position: relative;
1133 - text-align: center;
1134 -}
1135 -
1136 -/******************************************************************************/
1137 -/******************************** DB WIZARD ***********************************/
1138 -/******************************************************************************/
1139 -.db-wizard-condition .select-condition {
1140 - display: none;
1141 -}
1142 -
1143 -.db-wizard-condition .select-condition.active {
1144 - display: block;
1145 - max-width: 50%;
1146 - margin-top: 10px;
1147 - padding-top: 10px;
1148 - border-top: 1px solid #eee;
1149 - font-weight: 500;
1150 -}
1151 -
1152 -.db-wizard-results {
1153 - width: calc(100% - 350px);
1154 -}
1155 -
1156 -#db-wizard-form {
1157 - padding: 25px;
1158 -}
1159 -
1160 -.db-wizard-query label {
1161 - display: block;
1162 - min-width: 150px;
1163 - padding: 20px 0 5px;
1164 - color: rgba(0,0,0,0.85);
1165 - font-size: 18px;
1166 - font-weight: 500;
1167 -}
1168 -
1169 -.db-wizard-query .db-wizard-where label,
1170 -.db-wizard-query .db-wizard-from label {
1171 - padding-top: 0;
1172 -}
1173 -
1174 -.db-wizard-query > div:not(:last-child) {
1175 - margin-bottom: 15px;
1176 -}
1177 -
1178 -.db-wizard-query .select-condition > div {
1179 - display: block;
1180 -}
1181 -
1182 -.db-wizard-query .chosen-container {
1183 - width: auto;
1184 -}
1185 -
1186 -.db-wizard-query .chosen-container-single .chosen-single {
1187 - border: 1px solid #ccc;
1188 - background: #fff;
1189 - box-shadow: none;
1190 - font-size: 13px;
1191 - font-weight: 500;
1192 -}
1193 -
1194 -.db-wizard-templates,
1195 -.db-wizard-templates > div {
1196 - display: block;
1197 -}
1198 -
1199 -.db-wizard-templates > div {
1200 - box-sizing: border-box;
1201 - width: 50%;
1202 - margin-top: 20px;
1203 - padding: 20px;
1204 - border: 1px solid #efefef;
1205 -}
1206 -
1207 -.db-wizard-templates > div:first-child {
1208 - margin-top: 0;
1209 -}
1210 -
1211 -.db-wizard-query .chosen-container-multi .chosen-choices {
1212 - padding: 5px;
1213 - border-color: #ccc;
1214 - background: #fff;
1215 - box-shadow: none;
1216 -}
1217 -
1218 -.db-wizard-results .dataTables_wrapper .dataTables_filter input,
1219 -.db-wizard-query .select-condition-operand input,
1220 -.db-wizard-limit input {
1221 - width: 50%;
1222 - padding-left: 7px;
1223 - border: 1px solid #ccc;
1224 - border-radius: 6px;
1225 - background: #fff;
1226 - box-shadow: none;
1227 - font-size: 13px;
1228 -}
1229 -
1230 -.db-wizard-limit input {
1231 - display: inline;
1232 - width: 150px;
1233 - margin: 0 0 20px 20px;
1234 -}
1235 -
1236 -.db-wizard-limit label {
1237 - display: inline;
1238 -}
1239 -
1240 -.db-wizard-query .select-condition-operand input::-webkit-input-placeholder {
1241 - color: #cdcdcd;
1242 -}
1243 -
1244 -.db-wizard-query .select-condition-operand input:-ms-input-placeholder {
1245 - color: #cdcdcd;
1246 -}
1247 -
1248 -.db-wizard-query .select-condition-operand input::placeholder {
1249 - color: #cdcdcd;
1250 -}
1251 -
1252 -.db-wizard-query .chosen-container-multi .chosen-choices li.search-choice {
1253 - padding: 5px 30px 5px 5px;
1254 - border-color: #ccc;
1255 - background: #fff;
1256 - box-shadow: none;
1257 - font-weight: 600;
1258 -}
1259 -
1260 -.db-wizard-results table > thead > tr > th {
1261 - padding: 15px 8px;
1262 - border: none;
1263 - color: #252422;
1264 - background: #fff;
1265 - font-size: 18px;
1266 - font-weight: 500;
1267 - text-align: left;
1268 -}
1269 -
1270 -.db-wizard-results table > tbody > tr > td,
1271 -.dataTables_info {
1272 - padding: 15px 8px;
1273 - border-top: 1px solid #a2a2a2;
1274 - color: #252422;
1275 - font-size: 14px;
1276 - font-weight: 300;
1277 -}
1278 -
1279 -.db-wizard-results table > tbody > tr.odd {
1280 - background-color: #f7f7f7;
1281 -}
1282 -
1283 -.db-wizard-results table.dataTable.no-footer {
1284 - border: none;
1285 -}
1286 -
1287 -.db-wizard-results .dataTables_wrapper .dataTables_info {
1288 - border-top: 1px solid #ccc5b9;
1289 - color: #a2a2a2;
1290 - font-size: 12px;
1291 - font-weight: 500;
1292 -}
1293 -
1294 -.db-wizard-results .dataTables_filter label {
1295 - font-size: 18px;
1296 - font-weight: 500;
1297 -}
1298 -
1299 -.db-wizard-where-template-remove,
1300 -.db-wizard-where-template-add {
1301 - width: auto;
1302 - height: 25px;
1303 - margin-top: 10px;
1304 - border: none;
1305 - border-radius: 3px;
1306 - color: #fff;
1307 - font-size: 12px;
1308 - cursor: pointer;
1309 - transition: 0.3s ease;
1310 -}
1311 -
1312 -.db-wizard-where-template-remove:hover,
1313 -.db-wizard-where-template-add:hover {
1314 - opacity: 0.8;
1315 -}
1316 -
1317 -.db-wizard-results .dataTables_wrapper .dataTables_filter {
1318 - float: none;
1319 - text-align: left;
1320 -}
1321 -
1322 -.db-wizard-where-template-add {
1323 - background-color: #34a85e;
1324 -}
1325 -
1326 -.db-wizard-where-template-remove {
1327 - background-color: #ff0d00;
1328 -}
1329 -
1330 -#db-query-form .CodeMirror-scroll {
1331 - overflow: hidden !important;
1332 - height: 50%;
1333 - margin: 0;
1334 - padding: 0;
1335 -}
1336 -
1337 -#db-query-form .CodeMirror-wrap {
1338 - height: 200px;
1339 - padding: 15px;
1340 - color: #fff;
1341 - background: #282923;
1342 - font-size: 15px;
1343 -}
1344 -
1345 -#db-query-form .CodeMirror-wrap .CodeMirror-cursor {
1346 - border-left: 1px solid #fff !important;
1347 -}
1348 -
1349 -#db-query-form .CodeMirror-wrap .CodeMirror-placeholder {
1350 - color: #fff;
1351 -}
1352 -
1353 -#db-query-form .CodeMirror-wrap pre {
1354 - color: #fff !important;
1355 -}
1356 -
1357 -#db-query-form .CodeMirror-wrap pre .cm-keyword {
1358 - color: #f92472 !important;
1359 -}
1360 -
1361 -#db-query-form .CodeMirror-wrap pre .cm-comment {
1362 - color: #74705d !important;
1363 -}
1364 -
1365 -#db-query-form .CodeMirror-wrap pre .cm-number,
1366 -#db-query-form .CodeMirror-wrap pre .cm-string {
1367 - color: #fff !important;
1368 -}
1369 -
1370 -.visualizer-db-query-form > div {
1371 - display: block;
1372 - width: 15%;
1373 - vertical-align: middle;
1374 -}
1375 -
1376 -#visualizer-db-query {
1377 - padding: 20px;
1378 -}
1379 -
1380 -.visualizer-db-query-form > div:first-child {
1381 - width: 100%;
1382 - margin-bottom: 20px;
1383 -}
1384 -
1385 -.db-wizard-error {
1386 - color: #f00;
1387 -}
1388 -
1389 -.db-wizard-hints,
1390 -.json-wizard-hints,
1391 -.html-table-editor-hints {
1392 - margin-bottom: 30px;
1393 - color: #0085ba;
1394 -}
1395 -
1396 -.db-wizard-hints .visualizer-emboss,
1397 -.db-wizard-hints a,
1398 -.html-table-editor-hints a,
1399 -.json-wizard-hints .visualizer-emboss,
1400 -.json-wizard-hints a {
1401 - color: #f92472;
1402 -}
1403 -
1404 -.db-wizard-hints ul,
1405 -.html-table-editor-hints ul,
1406 -.json-wizard-hints ul {
1407 - list-style: square;
1408 -}
1409 -
1410 -.db-wizard-results .dataTables_wrapper .dataTables_info {
1411 - width: calc(100% - 17px);
1412 -}
1413 -
1414 -
1415 -/******************************************************************************/
1416 -/******************************** data tables *******************************/
1417 -/******************************************************************************/
1418 -.db-wizard-results .dt-button {
1419 - display: none !important;
1420 -}
1421 -
1422 -.dt-button.buttons-print {
1423 - display: none;
1424 -}
1425 -
1426 -/******************************************************************************/
1427 -/******************************** json table *********************************/
1428 -/******************************************************************************/
1429 -#json-conclude-form .results {
1430 - min-width: 10px !important;
1431 -}
1432 -
1433 -#json-conclude-form .json-table {
1434 - width: 85%;
1435 -}
1436 -
1437 -#vz-import-json-url,
1438 -#vz-import-json-root,
1439 -#vz-import-json-paging {
1440 - width: 75%;
1441 -}
1442 -
1443 -#json-conclude-form .json-table,
1444 -#json-conclude-form button#visualizer-json-conclude {
1445 - display: inline-block;
1446 - vertical-align: middle;
1447 -}
1448 -
1449 -.viz-editor-table tbody tr:first-child {
1450 - background-color: #ececec !important;
1451 -}
1452 -
1453 -.viz-editor-table tr th {
1454 - background-color: #cccccc;
1455 -}
1456 -
1457 -.viz-editor-table thead tr th:nth-child(n+1) {
1458 - cursor: move !important;
1459 -}
1460 -
1461 -#json-conclude-form .json-wizard-hints .info,
1462 -.html-table-editor-hints .info {
1463 - margin: 1% 0px;
1464 -}
1465 -
1466 -.viz-step.ui-state-active {
1467 - border-color: #0085BA !important;
1468 - background: #0085BA !important;
1469 - color: #ffffff;
1470 -}
1471 -
1472 -.viz-substep {
1473 - outline: 0 !important;
1474 - border: 0 !important;
1475 - background: none !important;
1476 - text-transform: uppercase;
1477 -}
1478 -
1479 -.viz-substep.ui-state-active {
1480 -}
1481 -
1482 -.viz-substep ~ .ui-accordion-content {
1483 - outline: 0 !important;
1484 - border: 0 !important;
1485 - font-size: smaller;
1486 -}
1487 -
1488 -.viz-substep ~ div {
1489 - display: table;
1490 -}
1491 -
1492 -.viz-substep ~ div > div {
1493 - display: table-row;
1494 -}
1495 -
1496 -.viz-substep ~ div > div div {
1497 - display: table-cell;
1498 - padding: 5px;
1499 -}
1500 -
1501 -.json-wizard-header .field-title {
1502 - position: absolute;
1503 - left: 30px;
1504 -}
1505 -/******************************************************************************/
1506 -/******************************** html table editor **************************/
1507 -/******************************************************************************/
1508 -.viz-simple-editor-type,
1509 -.viz-simple-editor {
1510 - display: none;
1511 -}
1512 -
1513 -.viz-table-editor {
1514 - width: 75%;
1515 - margin-left: 2%;
1516 -}
1517 -
1518 -.viz-html-table,
1519 -button#visualizer-save-html-table {
1520 - display: inline-block;
1521 - vertical-align: middle;
1522 -}
1523 -
1524 -
1525 -/******************************************************************************/
1526 -/******************************** text area editor **************************/
1527 -/******************************************************************************/
1528 -.viz-text-editor {
1529 - padding: 20px;
1530 - z-index: 9999;
1531 - box-sizing: border-box;
1532 - padding-right: 320px;
1533 -}
1534 -
1535 -.viz-text-editor textarea {
1536 - width: 85%;
1537 - overflow: auto;
1538 - background: #282923;
1539 - color: #ffffff;
1540 - padding: 15px;
1541 - height: 400px;
1542 - font-size: 15px;
1543 -}
1544 -
1545 -.viz-text-editor textarea,
1546 -button#viz-text-editor-button {
1547 - display: inline-block;
1548 - vertical-align: middle;
1549 -}
1550 -
1551 -.viz-simple-editor .viz-html-table {
1552 - width: 95%;
1553 -}
1554 -
1555 -/******************************************************************************/
1556 -/******************************** chartjs ***********************************/
1557 -/******************************************************************************/
1558 -
1559 -canvas.chartjs-render-monitor {
1560 - height: 500px !important;
1561 -}
1562 -
1563 -/******************************************************************************/
1564 -/******************************** Frontend Actions ***********************************/
1565 -/******************************************************************************/
1566 -#vz-frontend-actions .only-pro-inner, #vz-data-controls .only-pro-inner {
1567 - text-align: center;
1568 729 }