PluginProbe
Buttonizer – Floating Menus, Sticky Buttons, & Popup Builder / 1.0.4
Buttonizer – Floating Menus, Sticky Buttons, & Popup Builder v1.0.4
3.6.0 3.5.0 trunk 1.0.10 1.0.2 1.0.3 1.0.4 1.0.5 1.0.6 1.0.6.1 1.0.7 1.0.8 1.0.9 1.1 1.1.1 1.2 1.3 1.4 1.4.1 1.4.2 1.4.3 1.4.4 1.4.5 1.5 1.5.1 All 110 releases
buttonizer-multifunctional-button / trunk / css / style.css

style.css in Buttonizer – Floating Menus, Sticky Buttons, & Popup Builder 1.0.4, at trunk/css/style.css

660 lines 12.8 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 /*
2 * Buttonizer
3 */
4 .opening_hours {
5 width: 100%;
6 }
7
8 .opening_hours td {
9 padding: 5px;
10 }
11
12 h2 .button {
13 float: right;
14 }
15
16 .buttonizer-logo {
17 display: inline-block;
18 margin-top: 20px;
19 margin-right: 20px;
20 padding-left: 10px;
21 float: left;
22 }
23
24 .buttonizer-logo img {
25 max-width: 200px;
26 }
27
28 .buttonizer-no-buttons {
29 width: 100%;
30 }
31
32 .clear {
33 clear: both;
34 }
35
36 .fs-modal .fs-modal-header .fs-close {
37 text-decoration: none;
38 }
39
40 .info-class {
41 position: relative;
42 display: inline-block;
43 }
44
45 .info-class >i {
46 color: #9d8a7e;
47 padding: 3px 5px;
48 margin-right: 4px;
49 }
50
51 .info-class >span {
52 opacity: 0;
53 position: absolute;
54 visibility: hidden;
55 z-index: 100;
56 top: 19px;
57 left: 0px;
58 border-radius: 3px;
59 -moz-border-radius: 3px;
60 -webkit-border-radius: 3px;
61 -edge-border-radius: 3px;
62
63 border-top-left-radius: 0;
64 -moz-border-top-left-radius: 0;
65 -webkit-border-top-left-radius: 0;
66 min-width: 200px;
67 padding: 10px;
68 background-color: rgba(0, 0, 0, 0.56);
69 color: #FFFFFF;
70 font-weight: 200;
71 }
72
73 .info-class:hover >i {
74 background-color: rgba(0, 0, 0, 0.56);
75 color: rgba(255, 255, 255, 0.5);
76
77 border-top-left-radius: 3px;
78 -moz-border-top-left-radius: 3px;
79 -webkit-border-top-left-radius: 3px;
80
81 border-top-right-radius: 3px;
82 -moz-border-top-right-radius: 3px;
83 -webkit-border-top-right-radius: 3px;
84
85 }
86
87 .info-class:hover >span {
88 opacity: 1;
89 visibility: visible;
90 }
91
92 #buttonizer h2 {
93 margin-bottom: 20px !important;
94 }
95
96 .savebutton_margin {
97 margin-left: 10px !important;
98 }
99
100 .savebutton span {
101 margin-left: 5px;
102 }
103
104 .button-row {
105 border: 1px solid #c4c4c4;
106 margin-bottom: 10px;
107 }
108
109 .button-row.opened .button-data {
110 display: block;
111 }
112
113 .button-row.button-row-disabled .row-info {
114 position: relative;
115 }
116
117 .button-row.button-row-disabled .row-info .button-locked {
118 position: absolute;
119 left: 0;
120 right: 0;
121 top: 0;
122 bottom: 0;
123 background: rgba(238, 238, 238, 0.74);
124 color: #6b6b6b;
125 text-align: center;
126 padding: 12px;
127 font-size: 16px;
128 }
129
130 .button-row.button-row-disabled.opened .button-data {
131 display: none !important;
132 }
133
134 .button-row .row-info {
135 padding: 12px 15px;
136 background-color: #e6e6e6;
137 cursor: pointer;
138 font-size: 18px;
139 position: relative;
140 }
141
142 .button-row .row-info .mover {
143 position: absolute;
144 left: 0;
145 top: 0;
146 bottom: 0;
147 width: 65px;
148 cursor: move;
149 }
150
151 .button-row .row-info span i {
152 cursor: move;
153 }
154
155 .button-row .row-info i {
156 font-size: 18px;
157 margin-left: 10px;
158 margin-right: 20px;
159 }
160
161 .button-row .row-info .pencil-edit {
162 font-size: 15px;
163 color: #7d7d7d;
164 }
165
166 .button-row .row-info .pencil-edit:hover {
167 color: #333333;
168 }
169
170 .button-row .row-info .mobiledesktop {
171 font-size: 15px;
172 color: #4876ff;
173 float: right;
174 text-decoration: none;
175 outline: none;
176 box-shadow: none;
177 -webkit-box-shadow: none;
178 }
179
180 .button-row .row-info .mobiledesktop i {
181 margin: 0 10px !important;
182 }
183
184 .button-row .row-info .mobiledesktop.selected {
185 color: #7d7d7d;
186 }
187
188 .button-row .row-info .delete-button {
189 color: #c31414;
190 float: right;
191 font-size: 13px;
192 text-decoration: none;
193 margin-left: 15px;
194 }
195
196 .button-row .row-info .delete-button i {
197 font-size: 14px;
198 margin-right: 5px;
199 }
200
201 .button-row .row-info .delete-button:hover {
202 text-decoration: underline;
203 }
204
205 .button-row .row-info .is-live-button, .button-row .row-info .must-save-button {
206 border: 1px solid #dc2323;
207 color: #dc2323;
208 border-radius: 4px;
209 -moz-border-radius: 4px;
210 -webkit-border-radius: 4px;
211 padding: 3px 15px;
212 float: right;
213 font-size: 11px;
214 text-transform: uppercase;
215 font-weight: 600;
216 text-decoration: none;
217 margin-top: -3px;
218 margin-right: 10px;
219 }
220
221 .button-row .row-info .is-live-button i, .button-row .row-info .must-save-button i {
222 font-size: 9px;
223 margin: -3px 5px 0 0;
224 padding: 0;
225 vertical-align: middle;
226 }
227
228 .button-row .row-info .is-live-button {
229 cursor: default;
230 }
231
232 .button-row .row-info .must-save-button {
233 color: #4575fe;
234 border-color: #4575fe;
235 padding: 6px 15px;
236 margin-top: -5px;
237 cursor: pointer;
238 }
239
240 .button-row .row-info .must-save-button i {
241 font-size: 14px;
242 }
243
244 .button-row.button-row-disabled .row-info >.delete-button {
245 opacity: 0.2;
246 }
247
248 .button-row:hover .row-info, .button-row.opened .row-info {
249 background-color: #dbdbdb;
250 }
251
252 .button-row .button-data {
253 padding: 20px;
254 display: none;
255 }
256
257 .button-row .button-data table {
258 width: 100%;
259 }
260
261 .button-row .button-data .label-top {
262 font-weight: bold;
263 margin-bottom: 5px;
264 display: block;
265 }
266
267 .button-row .button-data input[type=text],
268 .button-row .button-data select {
269 width: 100%;
270 height: auto;
271 padding: 8px 10px;
272 }
273
274 .button-row .button-data .fontawesome-searcher-clicker {
275 display: block !important;
276 }
277
278 .button-row .button-data table .button-pdr {
279 padding-right: 15px;
280 }
281
282 .button-row .button-data table .settings-row td {
283 padding: 5px 0;
284 }
285
286 .button-row .button-data .setting-icon {
287 width: 23px;
288 text-align: center;
289 margin-right: 4px;
290 }
291
292 .button-preview {
293 border-radius: 50%;
294 width: 56px;
295 height: 56px;
296 display: block;
297 vertical-align: middle;
298 text-align: center;
299 color: #FFFFFF;
300 box-shadow: 0 2px 5px 0 rgba(0,0,0,0.16), 0 2px 10px 0 rgba(0,0,0,0.12);
301 cursor: pointer;
302 outline: none;
303 position: relative;
304 transition: all 0.2s ease-out;
305 -moz-transition: all 0.2s ease-out;
306 -webkit-transition: all 0.2s ease-out;
307 -o-transition: all 0.2s ease-out;
308 margin-top: 5px;
309 line-height: 56px;
310 }
311
312 /* General settings tabs */
313 .vertical-tabs {
314 display: block;
315 width: 100%;
316 border-spacing: 0;
317 }
318
319 .vertical-tabs tr td {
320 vertical-align: top;
321 padding: 0;
322 }
323
324 .vertical-tabs .tabs {
325 width: 200px;
326 }
327
328 .vertical-tabs .tabs a {
329 display: block;
330 float: none !important;
331 margin: 0px;
332 padding: 10px 20px;
333 border: 1px solid #cccccc;
334 border-top: 0;
335 box-shadow: none !important;
336 }
337
338 .vertical-tabs .tabs a.first {
339 border-top: 1px solid #cccccc;
340 }
341
342 .vertical-tabs .tabs a.nav-tab-active {
343 border-right: 0;
344 }
345
346 .vertical-tabs .tabsholder {
347 width: 85%;
348 }
349
350 .vertical-tabs .tab-container {
351 display: block;
352 border: 1px solid #cccccc;
353 margin-left: -1px;
354 min-height: 200px;
355 padding: 0 20px 20px 40px;
356 border-left: 0;
357 border-bottom: 0;
358 }
359
360 .form-table td {
361 vertical-align: middle !important;
362 }
363
364 /* Categories */
365 .categories-load-more {
366 display: block;
367
368 background-color: #e6e6e6;
369 border: 1px solid #c4c4c4;
370
371 padding: 10px 15px;
372 margin-top: 20px;
373
374 font-size: 15px;
375 text-align: center;
376 cursor: pointer;
377
378 color: #444444;
379
380 text-decoration: none;
381 }
382
383 .categories-load-more:hover {
384 color: #888888;
385 }
386
387 .page-categorie-styling {
388 background: #FFFFFF;
389 border-radius: 5px;
390 margin-top: 20px;
391 border: 1px solid #c4c4c4;
392 border-spacing: 0;
393 overflow: hidden;
394 }
395
396 .page-categorie-styling thead {
397 background-color: #f1f1f1;
398 }
399
400 .page-categorie-styling thead td {
401 border-bottom: 2px solid #dcdcdc;
402 padding: 8px 11px !important;
403 }
404
405 .page-categorie-styling tr {
406 border-bottom: 1px solid #333333;
407 }
408
409 .page-categorie-styling tr td {
410 padding: 14px 11px;
411 border-bottom: 1px solid #dcdcdc;
412 }
413
414 .page-categorie-styling .text-centered {
415 text-align: center;
416 }
417
418 .page-categorie-styling .is-clickable {
419 cursor: pointer;
420 }
421
422 /* FontAwesome searcher */
423 .fontawesome-searcher-clicker {
424 display: inline-block;
425 background-color: #ffffff;
426 border: 1px solid #cccccc;
427 color: #333333;
428 padding: 6px 16px;
429 text-decoration: none;
430 }
431
432 .fontawesome-searcher {
433 position: absolute;
434 left: 0;
435 top: 0;
436 background: #FFFFFF;
437 box-shadow: 0px 0px 10px rgba(183, 183, 183, 0.18);
438 min-width: 250px;
439 border: 1px solid #e7e7e7;
440 z-index: 999;
441 }
442
443 .fontawesome-searcher .fontawesome-searcher-searchbar {
444 padding: 20px;
445 text-align: center;
446 }
447
448 .fontawesome-searcher .fontawesome-searcher-searchbar input {
449 border-radius: 50px;
450 -moz-border-radius: 50px;
451 -webkit-border-radius: 50px;
452 padding: 7px 20px;
453 font-weight: 200;
454 outline: none;
455 }
456
457 .fontawesome-searcher .fontawesome-searcher-icons {
458 background-color: #f5f5f5;
459
460 border-top: 1px solid #e7e7e7;
461
462 overflow: auto;
463 max-height: 150px;
464 }
465
466 .fontawesome-searcher .fontawesome-searcher-icons table {
467 width: 100%;
468 }
469
470 .fontawesome-searcher .fontawesome-searcher-icons table table td {
471 border-bottom: 1px solid #e7e7e7;
472 border-right: 1px solid #e7e7e7;
473 border-left: 1px solid #ffffff;
474 }
475
476 .fontawesome-searcher .fontawesome-searcher-icons a {
477 background-color: #f5f5f5;
478 color: #464646;
479 font-size: 16px;
480 padding: 12px 0;
481 text-decoration: none;
482 display: block;
483 text-align: center;
484 outline: none;
485 }
486
487 .fontawesome-searcher .fontawesome-searcher-icons a:hover {
488 background-color: #e7e7e7;
489 }
490
491 .fontawesome-searcher .no-matches-found {
492 padding: 0 0 15px;
493 text-align: center;
494 font-style: italic;
495 color: #8b8b8b;
496 }
497
498 /* Pro */
499 .color-buttonizer {
500 color: #2a7688;
501 text-transform: uppercase;
502 }
503
504 .color-buttonizer span {
505 color: #ef8419;
506 }
507
508 .color-buttonizer-blue {
509 color: #2a7688;
510 }
511
512 .color-buttonizer-orange {
513 color: #ef8419;
514 }
515
516 .buttonizer-pro-checklist {
517 font-size: 16px;
518 line-height: 25px;
519 font-weight: 400;
520 }
521
522 .buttonizer-pro-checklist .fa-check {
523 margin-right: 10px;
524 font-size: 17px;
525 }
526
527 .buttonizer-pro-feature {
528 background: #2d7688;
529 background: -moz-linear-gradient(-45deg, #2d7688 0%, #187287 50%, #187287 50%, #f0841a 51%, #e8832c 98%);
530 background: -webkit-linear-gradient(-45deg, #2d7688 0%,#187287 50%,#187287 50%,#f0841a 51%,#e8832c 98%);
531 background: linear-gradient(135deg, #2d7688 0%,#187287 50%,#187287 50%,#f0841a 51%,#e8832c 98%);
532 filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2d7688', endColorstr='#e8832c',GradientType=1 );
533 color: #FFFFFF;
534 font-weight: 500;
535 font-size: 13px;
536 padding: 4px 20px;
537 display: inline-block;
538 border-radius: 4px;
539 -moz-border-radius: 4px;
540 -webkit-border-radius: 4px;
541 margin-left: 10px;
542 }
543
544 .buttonizer-pro-text {
545 border: 1px solid #eeeeee;
546 color: #999999;
547 padding: 20px 0;
548 font-size: 16px;
549 }
550
551 .buttonizer-pro-text a {
552 color: #999999;
553 }
554
555 .buttonizer-pro-text .fa-lock {
556 margin-right: 10px;
557 }
558
559 /* */
560 .icon-or-image {
561
562 }
563
564 .icon-or-image .placeholder-choose {
565 padding: 5px 5px 10px 5px;
566 display: block;
567 }
568
569 .icon-or-image .placeholder-choose a {
570 color: #147aae;
571 text-decoration: none;
572
573 }
574
575 .icon-or-image .placeholder-choose a:hover {
576 text-decoration: underline;
577 }
578
579 /*
580 * Red button
581 */
582 .wp-core-ui .button-red {
583 background: #ba0000;
584 border-color: #aa0000 #990000 #990000;
585 -webkit-box-shadow: 0 1px 0 #990000;
586 box-shadow: 0 1px 0 #990000;
587 color: #fff;
588 text-decoration: none;
589 text-shadow: 0 -1px 1px #990000, 1px 0 1px #990000, 0 1px 1px #990000, -1px 0 1px #990000;
590 }
591
592 .wp-core-ui .button-red:hover {
593 background: #c20000 !important;
594 border-color: #990000 !important;
595 color: #fff;
596 }
597
598 .wp-core-ui .button-red:active, .wp-core-ui .button-red:focus {
599 background: #aa0000 !important;
600 border-color: #990000 !important;
601 -webkit-box-shadow: inset 0 2px 0 #990000;
602 box-shadow: inset 0 2px 0 #990000;
603 vertical-align: top;
604 color: #FFFFFF;
605 }
606
607 .time-table {
608 max-width: 700px;
609 }
610
611 /* jQuery slider */
612 .ui-slider {
613 position: relative;
614 text-align: left;
615 height: 4px;
616 border: 1px solid rgba(46, 119, 137, 0.17);
617 background-color: #e5e5e5;
618 border-radius: 3px;
619 -webkit-border-radius: 3px;
620 -moz-border-radius: 3px;
621 }
622
623 .ui-slider.ui-slider-disabled {
624 opacity: 0.5;
625 }
626
627 .ui-slider .ui-slider-handle {
628 position: absolute;
629 z-index: 2;
630 width: 25px;
631 height: 25px;
632 cursor: default;
633 -ms-touch-action: none;
634 touch-action: none;
635
636 border-radius: 100%;
637 -webkit-border-radius: 100%;
638 -moz-border-radius: 100%;
639
640 margin-left: -8px;
641
642 border: 1px solid #c5c5c5;
643 background: #f6f6f6;
644 font-weight: normal;
645 color: #454545;
646
647 top: -12px;
648 }
649
650 .ui-slider .ui-slider-range {
651 position: absolute;
652 z-index: 1;
653 height: 4px;
654 top: -1px;
655 font-size: .7em;
656 display: block;
657 border: 1px solid rgba(48, 120, 138, 0.29);
658 background: #ee8216;
659 }
660