PluginProbe
Visualizer – Tables & Charts Manager with Built-in AI Generator / 1.3.0
Visualizer – Tables & Charts Manager with Built-in AI Generator v1.3.0
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
visualizer / css / frame.css

frame.css in Visualizer – Tables & Charts Manager with Built-in AI Generator 1.3.0, at css/frame.css

416 lines 7.8 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 #content {
2 position: absolute;
3 top: 0;
4 right: 0;
5 bottom: 60px;
6 left: 0;
7 z-index: 75;
8 overflow: auto;
9 }
10
11 #canvas {
12 position: absolute;
13 left: 10px;
14 right: 310px;
15 top: 10px;
16 bottom: 10px;
17 }
18
19 .loader {
20 position: absolute;
21 left: 50%;
22 top: 50%;
23 margin-left: -16px;
24 margin-top: -16px;
25 }
26
27 /******************************************************************************/
28 /******************************** SIDEBAR ***********************************/
29 /******************************************************************************/
30
31 #sidebar {
32 position: absolute;
33 top: 0;
34 right: 0;
35 bottom: 60px;
36 width: 299px;
37 z-index: 75;
38 background: whitesmoke;
39 border-left: 1px solid #DFDFDF;
40 overflow: auto;
41 -webkit-overflow-scrolling: touch;
42 }
43
44 .group-wrapper {
45 border-top: 1px solid #DFDFDF;
46 margin: 0;
47 padding: 0;
48 list-style: none;
49 }
50
51 .group {
52 margin: 0;
53 list-style: none;
54 font-size: 12px;
55 line-height: 18px;
56 }
57
58 .group.open {
59 border-bottom: 1px solid #DFDFDF;
60 }
61
62 .group-title {
63 border-top: 1px solid white;
64 border-bottom: 1px solid #DFDFDF;
65 position: relative;
66 cursor: pointer;
67 -webkit-user-select: none;
68 -moz-user-select: none;
69 -ms-user-select: none;
70 user-select: none;
71 margin: 0;
72 padding: 10px 20px;
73 font-size: 15px;
74 font-family: Georgia, "Times New Roman", "Bitstream Charter", Times, serif;
75 font-weight: normal;
76 text-shadow: 0 1px 0 white;
77 background: whiteSmoke;
78 background-image: -webkit-gradient(linear, left bottom, left top, from(#EEE), to(whiteSmoke));
79 background-image: -webkit-linear-gradient(bottom, #EEE, whiteSmoke);
80 background-image: -moz-linear-gradient(bottom, #EEE, whiteSmoke);
81 background-image: -o-linear-gradient(bottom, #EEE, whiteSmoke);
82 background-image: -ms-linear-gradient(bottom, #EEE, whiteSmoke);
83 background-image: linear-gradient(bottom, #EEE, whiteSmoke);
84 }
85
86 .group-title:hover,
87 .group.open .group-title {
88 color: white;
89 text-shadow: 0 -1px 0 #333;
90 background: gray;
91 background-image: -webkit-gradient(linear, left bottom, left top, from(#6D6D6D), to(gray));
92 background-image: -webkit-linear-gradient(bottom, #6D6D6D, gray);
93 background-image: -moz-linear-gradient(bottom, #6D6D6D, gray);
94 background-image: -o-linear-gradient(bottom, #6D6D6D, gray);
95 background-image: -ms-linear-gradient(bottom, #6D6D6D, gray);
96 background-image: linear-gradient(bottom, #6D6D6D, gray);
97 }
98
99 .group-title::after {
100 content: '';
101 width: 0;
102 height: 0;
103 border-color: #CCC transparent;
104 border-style: solid;
105 border-width: 6px 6px 0;
106 position: absolute;
107 top: 15px;
108 right: 20px;
109 z-index: 1;
110 }
111
112 .group-title:hover::after,
113 .group.open .group-title::after {
114 border-color: #EEE transparent;
115 }
116
117 .group:hover .group-title {
118 border-top-color: gray;
119 }
120
121 .group.open .group-title {
122 border-top-color: #6D6D6D;
123 }
124
125 .group.open .group-title::after {
126 border-width: 0 6px 6px;
127 }
128
129 .group-content {
130 margin: 0;
131 display: none;
132 background-color: #FDFDFD;
133 padding: 10px 0 20px 0;
134 overflow: hidden;
135 }
136
137 div.group-content {
138 padding: 10px 20px 20px;
139 }
140
141 .group.open .group-content {
142 display: block;
143 }
144
145 .group-description {
146 font-size: 12px;
147 color: #555;
148 padding: 5px 20px 10px;
149 margin: 0;
150 }
151
152 div.group-content .group-description {
153 padding: 0;
154 margin-bottom: 20px;
155 }
156
157 .section-title {
158 display: block;
159 font-weight: bold;
160 position: relative;
161 cursor: pointer;
162 padding: 4px 20px;
163 margin-bottom: 5px;
164 background-color: rgba(0, 0, 0, 0.02);
165 border-top: 1px solid #eeeeee;
166 -webkit-box-shadow: 0 4px 4px -4px rgba(0, 0, 0, 0.1);
167 box-shadow: 0 4px 4px -4px rgba(0, 0, 0, 0.1);
168 border-bottom: 1px solid #eeeeee;
169 }
170
171 .section-title::after {
172 content: '';
173 width: 0;
174 height: 0;
175 border-color: #CCC transparent;
176 border-style: solid;
177 border-width: 4px 4px 0;
178 position: absolute;
179 top: 13px;
180 right: 20px;
181 z-index: 1;
182 }
183
184 .section-title.open::after {
185 border-width: 0 4px 4px;
186 }
187
188 .section-items {
189 display: none;
190 padding: 5px 20px 10px 20px;
191 }
192
193 .section-items.open {
194 display: block;
195 }
196
197 .more-info {
198 text-decoration: none;
199 color: #21759B;
200 font-size: 85%;
201 font-weight: normal;
202 float: right;
203 display: none;
204 }
205
206 .section-description {
207 /*display: none;*/
208 padding: 0;
209 margin: 0;
210 font-size: 11px;
211 color: gray;
212 }
213
214 .section-table {
215 width: 100%;
216 }
217
218 .section-delimiter {
219 margin: 15px 0;
220 border-top: 1px dashed #ccc;
221 }
222
223 .section-table-column {
224 width: 50%;
225 text-align: left;
226 vertical-align: top;
227 padding: 0 1px;
228 }
229
230 .section-item {
231 margin-bottom: 10px;
232 }
233
234 .control-select,
235 .control-text {
236 width: 100%;
237 }
238
239 .section-description ul {
240 margin: 0 0 0 25px;
241 list-style: circle;
242 }
243
244 .section-description li {
245 list-style: circle;
246 margin: 0;
247 }
248
249 #rate-the-plugin {
250 margin-top: 40px;
251 padding: 20px;
252 border-top: 1px dashed #ddd;
253 }
254
255 #rate-stars {
256 float: right;
257 width: 100px;
258 height: 20px;
259 background-image: url('../images/star.png');
260 background-repeat: repeat-x;
261 background-position: right center;
262 }
263
264 #rate-link {
265 text-decoration: none;
266 display: block;
267 margin-top: 3px;
268 }
269
270 /******************************************************************************/
271 /******************************** TOOLBAR ***********************************/
272 /******************************************************************************/
273
274 #toolbar {
275 height: 36px;
276 padding: 12px 16px;
277 position: absolute;
278 z-index: 100;
279 left: 0;
280 right: 0;
281 bottom: 0;
282 border-top: 1px solid #DFDFDF;
283 overflow: hidden;
284 -webkit-box-shadow: 0 -4px 4px -4px rgba(0, 0, 0, 0.1);
285 box-shadow: 0 -4px 4px -4px rgba(0, 0, 0, 0.1);
286 }
287
288 #toolbar .push-right {
289 float: right;
290 }
291
292 /******************************************************************************/
293 /******************************** TYPE PICKER ******************************/
294 /******************************************************************************/
295
296 #type-picker {
297 margin: 50px auto;
298 width: 952px;
299 }
300
301 .type-box {
302 float: left;
303 margin: 0 20px 20px 0;
304 border: 1px dashed #ddd;
305 -webkit-box-shadow: 0px 0px 8px #ddd;
306 box-shadow: 0px 0px 8px #ddd;
307 background-color: #efefef;
308 }
309
310 .type-box:nth-child(3n+3) {
311 margin-right: 0px;
312 }
313
314 .type-label {
315 display: block;
316 width: 270px;
317 height: 195px;
318 padding: 15px;
319 background-color: white;
320 background-image: url(../images/chart_types_g.png);
321 background-repeat: no-repeat;
322 background-position: center center;
323 border: 1px solid #e0e0e0;
324 }
325
326 .type-label-selected,
327 .type-label:hover {
328 background-image: url(../images/chart_types.png);
329 }
330
331 .type-box-area .type-label {
332 background-position: 0px -225px;
333 }
334
335 .type-box-line .type-label {
336 background-position: -600px 0px;
337 }
338
339 .type-box-scatter .type-label {
340 background-position: -300px 0px;
341 }
342
343 .type-box-pie .type-label {
344 background-position: 0px 0px;
345 }
346
347 .type-box-gauge .type-label {
348 background-position: 0px -450px;
349 }
350
351 .type-box-geo .type-label {
352 background-position: -600px -450px;
353 }
354
355 .type-box-candlestick .type-label {
356 background-position: -300px -450px;
357 }
358
359 .type-box-bar .type-label {
360 background-position: -300px -225px;
361 }
362
363 .type-box-column .type-label {
364 background-position: -600px -225px;
365 }
366
367 /******************************************************************************/
368 /******************************** OTHER STYLES ******************************/
369 /******************************************************************************/
370
371 #thehole {
372 position: absolute;
373 left: 0;
374 top: 0;
375 width: 1px;
376 height: 1px;
377 border: 0;
378 opacity: 0;
379 -moz-opacity: 0;
380 filter:progid:DXImageTransform.Microsoft.Alpha(opacity=0);
381 }
382
383 .locker, .locker-loader {
384 left: 0;
385 top: 0;
386 position: absolute;
387 }
388
389 .locker {
390 z-index: 1000;
391 background-color: white;
392 -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
393 filter: alpha(opacity=80);
394 opacity: 0.8;
395 }
396
397 .locker-loader {
398 z-index: 1001;
399 background: url(../images/ajax-loader.gif) no-repeat center center;
400 }
401
402 .file-wrapper {
403 position: relative;
404 margin-right: 10px !important;
405 }
406
407 .file {
408 position: absolute;
409 top: 0;
410 left: 0;
411 right: 0;
412 bottom: 0;
413 opacity: 0;
414 -moz-opacity: 0;
415 filter:progid:DXImageTransform.Microsoft.Alpha(opacity=0);
416 }