PluginProbe
Floating Button – Easily Create Sticky, Fixed & Floating Buttons / 6.0.1
Floating Button – Easily Create Sticky, Fixed & Floating Buttons v6.0.1
trunk 2.0.2 3.0 4.0 4.1.2 4.3 5.0 5.0.1 5.1 5.1.1 5.2 5.3 5.3.1 6.0 6.0.1 6.0.10 6.0.11 6.0.12 6.0.13 6.0.2 6.0.3 6.0.4 6.0.5 6.0.6 6.0.7 All 31 releases
floating-button / assets / css / admin.css

admin.css in Floating Button – Easily Create Sticky, Fixed & Floating Buttons 6.0.1, at assets/css/admin.css

1,036 lines 19.5 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 @charset "UTF-8";
2 :root {
3 --wowp-blue: #005BBF;
4 --wowp-yellow: #FFD500;
5 --wowp-border: #cccccc;
6 --wowp-dark: #14102C;
7 --wowp-orange: #E86E2C;
8 --wowp-bg: #EEF3EB;
9 --wowp-success: #00BF04;
10 --wowp-danger: #BF0400;
11 }
12
13 .wowp-box {
14 padding: 1.5rem 1.25rem;
15 margin-top: 50px;
16 position: relative;
17 box-sizing: border-box;
18 background: #ffffff;
19 background-clip: padding-box;
20 border: solid 2px transparent;
21 border-radius: 4px;
22 }
23 .wowp-box::before {
24 content: "";
25 position: absolute;
26 top: 0;
27 right: 0;
28 bottom: 0;
29 left: 0;
30 z-index: -1;
31 margin: -2px;
32 border-radius: inherit;
33 background: linear-gradient(to bottom, var(--wowp-blue), var(--wowp-yellow));
34 }
35
36 .wowp-header-border {
37 height: 5px;
38 background: linear-gradient(to right, var(--wowp-blue), var(--wowp-yellow));
39 margin-left: -20px;
40 }
41
42 .wowp-header {
43 position: relative;
44 padding: 32px 20px;
45 margin-left: -20px;
46 background: #ffffff;
47 display: flex;
48 align-items: center;
49 gap: 1rem;
50 flex-wrap: wrap;
51 }
52
53 .wowp-logo {
54 display: flex;
55 align-items: center;
56 }
57
58 .wowp-logo img {
59 width: 40px;
60 }
61
62 .wowp-header h1 {
63 position: relative;
64 margin: 0 35px 0 0;
65 }
66
67 .wowp-version {
68 position: absolute;
69 transform: translateY(-50%) translateX(50%);
70 font-size: 12px;
71 font-weight: normal;
72 }
73
74 .wowp-links {
75 position: absolute;
76 top: 0;
77 right: 20px;
78 display: flex;
79 border-radius: 0 0 4px 4px;
80 border: 2px solid;
81 border-top: none;
82 background-color: #DFE2FC;
83 border-image: linear-gradient(to right, #14102C, #E86E2C);
84 border-image-slice: 1;
85 }
86 @media screen and (max-width: 850px) {
87 .wowp-links {
88 display: none;
89 }
90 }
91 .wowp-links img {
92 width: 15px;
93 height: 15px;
94 }
95
96 .wowp-links a {
97 text-decoration: none;
98 color: #14102C;
99 display: flex;
100 flex-direction: column;
101 font-size: 12px;
102 align-items: center;
103 padding: 5px;
104 transition: all 0.15s linear;
105 }
106
107 .wowp-links a:hover {
108 background-color: #F6C8AF;
109 }
110
111 .wowp-links .dashicons {
112 width: 15px;
113 height: 15px;
114 font-size: 15px;
115 color: #596FF9;
116 }
117
118 .wowp-wrap .nav-tab-wrapper .nav-tab-active {
119 color: var(--wowp-blue);
120 }
121
122 .wowp-list {
123 padding: 50px 0;
124 }
125
126 @media screen and (max-width: 782px) {
127 .wowp-list td.column-mode span:first-child {
128 margin-left: 0;
129 }
130 }
131 .wowp-list .row-actions .duplicate a {
132 color: green;
133 }
134 .wowp-list .row-actions .export a {
135 color: orange;
136 }
137
138 .wowp-status-on,
139 .wowp-status-off {
140 display: inline-block;
141 width: 14px;
142 height: 14px;
143 border-radius: 50%;
144 }
145
146 .wowp-status-on {
147 background-color: green;
148 }
149
150 .wowp-status-off {
151 background-color: red;
152 }
153
154 .wowp-settings #titlewrap input {
155 padding: 3px 8px;
156 font-size: 1.7em;
157 line-height: 100%;
158 height: 1.7em;
159 width: 100%;
160 outline: none;
161 margin: 0 0 3px;
162 background-color: #fff;
163 }
164
165 .wowp-wrap fieldset {
166 border: 2px solid var(--wowp-border);
167 padding: 20px;
168 display: flex;
169 flex-wrap: wrap;
170 gap: 15px;
171 margin-bottom: 24px;
172 }
173 .wowp-wrap legend {
174 font-weight: bold;
175 color: var(--wowp-dark);
176 padding: 0 8px;
177 font-size: 15px;
178 }
179
180 .wowp-field {
181 position: relative;
182 box-sizing: border-box;
183 }
184 .wowp-field input:not([type=checkbox], [type=radio], .wp-color-picker, .wp-picker-clear),
185 .wowp-field select {
186 height: 40px;
187 line-height: 40px;
188 width: 100%;
189 border: 1px solid var(--wowp-blue);
190 max-width: 100%;
191 }
192 .wowp-field textarea {
193 width: 100%;
194 min-height: 350px;
195 }
196 .wowp-field .label {
197 position: absolute;
198 top: 0;
199 left: 10px;
200 transform: translateY(-50%);
201 font-size: 12px;
202 font-weight: 700;
203 padding: 0 5px;
204 color: #004A9B;
205 z-index: 9;
206 }
207 .wowp-field .label:after {
208 position: absolute;
209 content: " ";
210 height: 4px;
211 background: #fff;
212 width: 100%;
213 top: 50%;
214 left: 0;
215 z-index: -1;
216 transform: translateY(-50%);
217 }
218 .wowp-field .label.wowp-info:before {
219 position: absolute;
220 content: "?";
221 top: 0;
222 left: calc(100% - 5px);
223 font-size: 10px;
224 color: var(--wowp-dark);
225 transform: translateY(calc(-50% ));
226 font-weight: bold;
227 }
228 .wowp-field .label.wowp-info:hover:before {
229 position: absolute;
230 top: 0;
231 left: 0;
232 background-color: #2B222A;
233 border-radius: 5px;
234 color: #fff;
235 content: attr(data-info);
236 padding: 5px 10px;
237 text-transform: none;
238 width: 160px;
239 transform: translateY(calc(-100% - 7px));
240 word-wrap: break-word;
241 white-space: break-spaces;
242 line-height: 1.1;
243 font-weight: normal;
244 font-size: 12px;
245 }
246 .wowp-field .wowp-download-img {
247 position: absolute;
248 top: 0;
249 right: 5px;
250 transform: translateY(-100%);
251 font-weight: 600;
252 font-size: 8px;
253 cursor: pointer;
254 color: var(--wowp-dark);
255 }
256
257 .wowp-field {
258 width: calc(100%/3 - 15px/2 - 2.5px);
259 }
260 @media screen and (max-width: 1024px) {
261 .wowp-field {
262 width: 100%;
263 }
264 }
265
266 .wowp-field.has-checkbox {
267 display: flex;
268 padding: 0 8px;
269 align-items: center;
270 border: 1px solid var(--wowp-blue);
271 border-radius: 3px;
272 height: 40px;
273 line-height: 40px;
274 gap: 8px;
275 width: calc(100%/3 - 15px/2 - 2.5px - 2.5px);
276 }
277 @media screen and (max-width: 1024px) {
278 .wowp-field.has-checkbox {
279 width: 100%;
280 }
281 }
282 .wowp-field.has-checkbox input[type=checkbox] {
283 margin: 0 8px 0 0;
284 }
285 .wowp-field.has-checkbox .label {
286 line-height: initial;
287 }
288
289 .wowp-field.has-addon {
290 display: flex;
291 align-items: center;
292 }
293 .wowp-field.has-addon .is-addon {
294 order: -1;
295 box-sizing: border-box;
296 height: 40px;
297 line-height: 40px;
298 padding: 0 8px;
299 background-color: #ffffff;
300 color: var(--wowp-dark);
301 border: 1px solid var(--wowp-blue);
302 border-radius: 3px 0 0 3px;
303 border-right: none;
304 margin-right: -2px;
305 }
306 .wowp-field.has-addon select,
307 .wowp-field.has-addon input:not([type=checkbox], [type=radio]) {
308 box-sizing: border-box;
309 border-radius: 0 3px 3px 0;
310 border-left: none;
311 }
312 .wowp-field.has-addon select[readonly] + .is-addon,
313 .wowp-field.has-addon input:not([type=checkbox], [type=radio])[readonly] + .is-addon {
314 background-color: #f0f0f1;
315 }
316 .wowp-field.has-addon select:focus,
317 .wowp-field.has-addon input:not([type=checkbox], [type=radio]):focus {
318 box-shadow: none;
319 }
320 .wowp-field.has-addon:has(input:focus) {
321 box-shadow: 0 0 0 1px #2271b1;
322 border-radius: 3px;
323 }
324 .wowp-field.has-addon.has-background .is-addon {
325 background-color: #DFE2FC;
326 }
327
328 .wowp-field.has-addon-right label {
329 display: flex;
330 align-items: center;
331 }
332 .wowp-field.has-addon-right label .is-addon {
333 order: 1;
334 box-sizing: border-box;
335 height: 40px;
336 line-height: 40px;
337 padding: 0 8px;
338 background-color: #ffffff;
339 color: var(--wowp-dark);
340 border: 1px solid var(--wowp-blue);
341 border-radius: 0 3px 3px 0;
342 border-left: none;
343 margin-left: -2px;
344 }
345 .wowp-field.has-addon-right label select,
346 .wowp-field.has-addon-right label input:not([type=checkbox], [type=radio]) {
347 border-radius: 3px 0 0 3px;
348 }
349 .wowp-field.has-addon-right label select:focus + .is-addon,
350 .wowp-field.has-addon-right label input:not([type=checkbox], [type=radio]):focus + .is-addon {
351 box-shadow: 0 0 0 1px #2271b1;
352 }
353 .wowp-field.has-addon-right:has(input:focus) {
354 box-shadow: 0 0 0 1px #2271b1;
355 border-radius: 3px;
356 }
357 .wowp-field.has-addon-right.has-background .is-addon {
358 background-color: #DFE2FC;
359 }
360
361 .wowp-field.has-addon .is-addon .dashicons {
362 line-height: 40px;
363 }
364
365 .wowp-field.border-default .is-addon {
366 background-color: #dcdcde;
367 color: #50575e;
368 border-color: #8c8f94;
369 }
370 .wowp-field.border-default input:not([type=checkbox], [type=radio]) {
371 border: 1px solid #8c8f94;
372 }
373
374 .wowp-field.is-full {
375 width: 100%;
376 }
377
378 .wowp-fields-group {
379 position: relative;
380 display: flex;
381 gap: 15px;
382 flex-wrap: wrap;
383 width: 100%;
384 box-sizing: border-box;
385 }
386
387 .wowp-wrap .large-text.code {
388 background: #32373c;
389 color: rgba(240, 245, 250, 0.7);
390 font-size: 12px;
391 font-family: Menlo, Monaco, monospace;
392 display: block;
393 overflow: auto;
394 white-space: pre;
395 width: 100%;
396 height: 450px;
397 padding: 10px;
398 outline: none;
399 }
400
401 .wowp-notice {
402 padding: 0.75rem 1.25rem;
403 }
404
405 .wowp-error {
406 background: #FAD0D0;
407 color: #14102C;
408 border-left: 6px solid #E82C2C;
409 }
410
411 .wowp-success {
412 padding: 1.25rem;
413 background: #D0FAD0;
414 color: #14102C;
415 border-left: 6px solid #109610;
416 }
417
418 .wowp-file input::file-selector-button {
419 color: #14102C;
420 padding: 0.5em;
421 border: thin solid var(--wowp-yellow);
422 border-radius: 4px;
423 }
424
425 .wowp-file input[type=file]:valid {
426 color: var(--wowp-orange);
427 }
428
429 .wowp-settings h4 {
430 display: flex;
431 width: max-content;
432 gap: 8px;
433 align-items: center;
434 margin: 0 0 1.5rem 0;
435 font-weight: 800;
436 box-sizing: border-box;
437 color: var(--wowp-blue);
438 font-size: 16px;
439 letter-spacing: -1.08px;
440 line-height: 18px;
441 text-align: left;
442 -webkit-font-smoothing: antialiased;
443 background-color: var(--wowp-bg);
444 padding: 4px 8px;
445 border-radius: 25px;
446 }
447 .wowp-settings .wp-picker-container {
448 margin-top: 8px;
449 }
450
451 .wowp-icon {
452 color: var(--wowp-orange);
453 }
454
455 .nav-tab-wrapper.wowp-tab {
456 cursor: pointer;
457 }
458
459 .wowp-tab .nav-tab-active {
460 background-color: #ffffff;
461 border-bottom: 1px solid #ffffff;
462 }
463
464 .wowp-tab-content {
465 padding: 1.5rem 1.25rem;
466 background-color: #ffffff;
467 border-width: 1px;
468 border-style: solid;
469 border-image: linear-gradient(to bottom, var(--wowp-blue), var(--wowp-yellow)) 1 100%;
470 }
471 .wowp-tab-content .tab-content {
472 display: none;
473 }
474 .wowp-tab-content .tab-content.tab-content-active {
475 display: block;
476 }
477
478 .wowp-text-helper {
479 width: 100%;
480 }
481
482 .CodeMirror {
483 border: 1px solid var(--wowp-border);
484 font-size: 13px;
485 resize: vertical;
486 overflow: auto;
487 }
488
489 .wowp-sidebar-pub-section {
490 display: flex;
491 flex-direction: column;
492 gap: 15px;
493 }
494
495 .wowp-sidebar-pub-section .wowp-field {
496 width: 100%;
497 }
498
499 .wowp-sidebar-pub-section .wowp-field .is-addon {
500 height: 32px;
501 line-height: 32px;
502 }
503 .wowp-sidebar-pub-section .wowp-field .is-addon .dashicons {
504 line-height: 32px;
505 }
506 .wowp-sidebar-pub-section .wowp-field .is-addon a {
507 text-decoration: none;
508 }
509 .wowp-sidebar-pub-section .wowp-field input:not([type=checkbox], [type=radio]) {
510 height: 32px;
511 }
512
513 .wowp-sidebar-pub-section [list]::-webkit-calendar-picker-indicator {
514 display: none !important;
515 }
516
517 .wowp-sidebar #major-publishing-actions {
518 margin: 0 -12px -12px -12px;
519 padding: 12px 24px;
520 }
521
522 .wowp-sidebar #minor-publishing-actions {
523 padding: 0;
524 }
525
526 .button._is-success {
527 background-color: var(--wowp-success);
528 border-color: var(--wowp-success);
529 color: #ffffff;
530 }
531 .button._is-success:focus, .button._is-success:hover {
532 background-color: #007602;
533 border-color: #007602;
534 color: #ffffff;
535 }
536
537 .button._is-danger {
538 background-color: var(--wowp-danger);
539 border-color: var(--wowp-danger);
540 color: #ffffff;
541 }
542 .button._is-danger:focus, .button._is-danger:hover {
543 background-color: #760200;
544 border-color: #760200;
545 color: #ffffff;
546 }
547
548 .has-tooltip {
549 position: relative;
550 cursor: help;
551 }
552 .has-tooltip::before, .has-tooltip::after {
553 color: #efefef;
554 font-family: monospace;
555 font-size: 12px;
556 opacity: 0;
557 pointer-events: none;
558 text-align: center;
559 }
560 .has-tooltip::before {
561 position: absolute;
562 top: 0;
563 left: 50%;
564 background-color: #2B222A;
565 border-radius: 5px;
566 color: #fff;
567 content: attr(data-tooltip);
568 padding: 5px 10px;
569 text-transform: none;
570 transition: all 0.5s ease;
571 width: 160px;
572 transform: translateY(calc(-100% - 7px)) translateX(-50%);
573 word-wrap: break-word;
574 white-space: break-spaces;
575 line-height: 1.1;
576 }
577 .has-tooltip::after {
578 position: absolute;
579 top: -7px;
580 left: 50%;
581 border-left: 5px solid transparent;
582 border-right: 5px solid transparent;
583 border-top: 5px solid #2B222A;
584 content: " ";
585 font-size: 0;
586 line-height: 0;
587 margin-left: -5px;
588 width: 0;
589 transform: translateX(-50%);
590 }
591 .has-tooltip:focus::before, .has-tooltip:focus::after, .has-tooltip:hover::before, .has-tooltip:hover::after {
592 opacity: 1;
593 transition: all 0.75s ease;
594 }
595 .has-tooltip.on-right::before {
596 top: 50%;
597 left: 100%;
598 transform: translateY(-50%) translateX(4px);
599 }
600 .has-tooltip.on-right::after {
601 top: 50%;
602 left: calc(100% + 2px);
603 rotate: 90deg;
604 transform: translateX(calc(-50% + 2.5px));
605 }
606 .has-tooltip.on-left::before {
607 top: 50%;
608 left: -2px;
609 transform: translateY(-50%) translateX(-100%);
610 }
611 .has-tooltip.on-left::after {
612 top: 50%;
613 left: 0;
614 rotate: -90deg;
615 transform: translateX(calc(-50% + 7px));
616 }
617
618 .wowp-toogle {
619 display: flex;
620 align-items: center;
621 position: relative;
622 text-decoration: none;
623 color: #ffffff;
624 width: 40px;
625 height: 28px;
626 border-radius: 50px;
627 padding: 0 4px;
628 }
629 .wowp-toogle:focus, .wowp-toogle:hover {
630 color: #ffffff;
631 }
632
633 .wowp-toogle span {
634 height: 20px;
635 width: 20px;
636 display: flex;
637 align-items: center;
638 justify-content: center;
639 border-radius: 50%;
640 font-size: 8px;
641 }
642
643 .wowp-toogle.is-on {
644 background-color: #BFFFC0;
645 }
646
647 .wowp-toogle.is-on span {
648 background-color: #00BF04;
649 }
650 .wowp-toogle.is-on:focus span, .wowp-toogle.is-on:hover span {
651 background-color: #007602;
652 }
653
654 .wowp-toogle.is-off {
655 flex-direction: row-reverse;
656 background-color: #FFC0BF;
657 }
658
659 .wowp-toogle.is-off span {
660 background-color: #BF0400;
661 }
662 .wowp-toogle.is-off:focus span, .wowp-toogle.is-off:hover span {
663 background-color: #760200;
664 }
665
666 .wowp-details {
667 width: 100%;
668 box-sizing: border-box;
669 }
670 .wowp-details summary {
671 height: 20px;
672 color: var(--wowp-dark);
673 font-weight: 500;
674 cursor: pointer;
675 font-size: 14px;
676 }
677 .wowp-details[open] summary {
678 color: var(--wowp-orange);
679 }
680 .wowp-details > div {
681 padding: 0 10px;
682 margin: 15px 0;
683 }
684
685 .wowp-wrap .has-shadow {
686 box-shadow: 0 0 10px 3px rgba(0, 91, 191, 0.1);
687 }
688 .wowp-wrap .has-padding {
689 padding: 10px;
690 margin: 0 -10px;
691 }
692 .wowp-wrap .is-hidden {
693 display: none;
694 }
695 .wowp-wrap .has-radius {
696 border-radius: 4px;
697 }
698 .wowp-wrap .w_has-border {
699 border: 2px solid;
700 border-image: linear-gradient(to bottom, var(--wowp-blue), var(--wowp-yellow)) 1;
701 }
702 .wowp-wrap .w_width-750 {
703 max-width: 750px;
704 }
705 .wowp-wrap .has-mt {
706 margin-top: 24px;
707 }
708
709 .w_block {
710 background-color: #ebf3ff;
711 padding: 50px 32px;
712 max-width: 1200px;
713 margin: 50px auto;
714 }
715 .w_block-titles {
716 position: relative;
717 width: max-content;
718 margin: 0 auto;
719 display: flex;
720 flex-direction: column;
721 gap: 15px;
722 }
723 .w_block-subtitle {
724 color: #f16046;
725 font-size: 16px;
726 font-weight: 700;
727 line-height: 20px;
728 margin: 0;
729 }
730 .w_block-title {
731 position: relative;
732 font-size: 40px;
733 font-weight: 600;
734 line-height: 45px;
735 margin: 0;
736 background: linear-gradient(to right, #14102C 0%, #14102C 30%, #E86E2C 81%, #14102C 100%);
737 -webkit-background-clip: text;
738 -webkit-text-fill-color: transparent;
739 color: #14102C;
740 }
741 .w_block-btns {
742 width: max-content;
743 margin: 48px auto 68px;
744 display: flex;
745 gap: 25px;
746 }
747 @media screen and (max-width: 768px) {
748 .w_block-btns {
749 flex-direction: column;
750 }
751 }
752 .w_block-btns [class^=w_btn] {
753 display: inline-block;
754 width: 220px;
755 height: 50px;
756 margin: 0 15px;
757 line-height: 50px;
758 font-size: 20px;
759 text-decoration: none;
760 color: #fff;
761 border-width: 1px;
762 border-style: solid;
763 text-align: center;
764 border-radius: 8px;
765 text-transform: uppercase;
766 transition: 0.5s;
767 background-size: 200% auto;
768 }
769 .w_block-btns [class^=w_btn]:hover {
770 background-position: right center;
771 }
772 .w_block-btns .w_btn-pro {
773 background-image: linear-gradient(to right, #FFD500 0%, #E86E2C 51%, #FFD500 100%);
774 }
775 .w_block-btns .w_btn-demo {
776 background-image: linear-gradient(to right, #005BBF 0%, #800080 51%, #005BBF 100%);
777 }
778
779 h4.wowp-title {
780 font-size: 28px;
781 font-weight: 600;
782 line-height: 1.125;
783 margin: 0 0 48px;
784 padding: 0;
785 color: var(--wowp-dark);
786 }
787
788 .w_card {
789 position: relative;
790 background-color: #fff;
791 border-radius: 6px;
792 box-shadow: 0 0.5em 1em -0.125em rgba(10, 10, 10, 0.1), 0 0 0 1px rgba(10, 10, 10, 0.02);
793 padding: 15px;
794 text-decoration: none;
795 color: #363636;
796 }
797 .w_card-media {
798 position: absolute;
799 top: -6px;
800 left: -12px;
801 background-color: #fdf2ed;
802 width: 56px;
803 height: 56px;
804 border-radius: 6px;
805 display: flex;
806 align-items: center;
807 color: orange;
808 font-size: 32px;
809 justify-content: center;
810 margin: 0;
811 }
812 .w_card-content {
813 display: flex;
814 gap: 28px;
815 flex-direction: column;
816 }
817 .w_card-title {
818 font-size: 22px;
819 font-weight: 700;
820 margin: 0 0 0 44px;
821 }
822 .w_card-description {
823 font-size: 16px;
824 display: -webkit-box;
825 -webkit-line-clamp: 2;
826 -webkit-box-orient: vertical;
827 overflow: hidden;
828 text-overflow: ellipsis;
829 cursor: pointer;
830 margin: 0;
831 }
832 .w_card-description.is-open {
833 overflow: visible;
834 display: block;
835 -webkit-line-clamp: unset;
836 }
837
838 [class^=w_boxes] {
839 display: grid;
840 gap: 22px;
841 }
842
843 .w_boxes__3-col {
844 grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));
845 }
846
847 .menu-items {
848 display: flex;
849 flex-direction: column;
850 gap: 25px;
851 max-width: 750px;
852 }
853
854 .wowp-item {
855 max-width: 750px;
856 background-color: #ffffff;
857 }
858 .wowp-item fieldset {
859 border: none;
860 margin-bottom: 0;
861 }
862 .wowp-item .wowp-item_heading_toogle {
863 display: flex;
864 width: 40px;
865 height: 40px;
866 align-items: center;
867 cursor: pointer;
868 justify-content: center;
869 background-color: #f7f7f7;
870 color: var(--wowp-orange);
871 }
872 .wowp-item .wowp-item_heading_toogle:hover {
873 background-color: #c7c7c7;
874 }
875 .wowp-item .wowp-item_heading_toogle span:last-child {
876 display: none;
877 }
878 .wowp-item[open] .wowp-item_heading_toogle span:last-child {
879 display: block;
880 }
881 .wowp-item[open] .wowp-item_heading_toogle span:first-child {
882 display: none;
883 }
884
885 .wowp-item_heading {
886 display: flex;
887 gap: 15px;
888 height: 48px;
889 align-items: center;
890 background-color: var(--wowp-bg);
891 list-style: none;
892 }
893 .wowp-item_heading .dashicons-move {
894 cursor: move;
895 color: var(--wowp-blue);
896 }
897 .wowp-item_heading .dashicons-trash {
898 color: var(--wowp-danger);
899 cursor: pointer;
900 }
901 .wowp-item_heading::-webkit-details-marker {
902 display: none;
903 }
904
905 .wowp-item_heading_type {
906 margin-left: auto;
907 padding: 0 10px;
908 }
909
910 .wowp-item_content fieldset {
911 border-top: none;
912 }
913
914 .wowp-item_heading_icon {
915 display: flex;
916 width: 48px;
917 height: 48px;
918 align-items: center;
919 justify-content: center;
920 font-size: 16px;
921 }
922 .wowp-item_heading_icon img {
923 max-width: 20px;
924 max-height: 20px;
925 }
926
927 .btn-add-item {
928 max-width: 750px;
929 margin-top: 48px;
930 }
931
932 .wowp-tabs {
933 display: flex;
934 flex-direction: column;
935 gap: 25px;
936 width: 100%;
937 margin-top: 25px;
938 }
939
940 .wowp-tabs-link {
941 display: flex;
942 align-items: center;
943 justify-content: center;
944 font-size: 18px;
945 }
946 .wowp-tabs-link a {
947 position: relative;
948 color: var(--wowp-dark);
949 text-decoration: none;
950 cursor: pointer;
951 padding: 10px;
952 }
953 .wowp-tabs-link a.is-active {
954 color: var(--wowp-blue);
955 }
956 .wowp-tabs-link a.is-active:after {
957 position: absolute;
958 left: 0;
959 content: " ";
960 width: 100%;
961 height: 2px;
962 background-color: var(--wowp-yellow);
963 bottom: 0;
964 }
965
966 .wowp-tabs-content {
967 display: none;
968 gap: 15px;
969 flex-wrap: wrap;
970 width: 100%;
971 box-sizing: border-box;
972 }
973 .wowp-tabs-content.is-active {
974 display: flex;
975 }
976
977 #schedule .dashicons,
978 #display-rules .dashicons {
979 color: var(--wowp-danger);
980 cursor: pointer;
981 position: absolute;
982 right: 0;
983 top: 0;
984 transform: translateX(calc(100% + 5px));
985 }
986
987 .changelog-list {
988 max-width: 750px;
989 margin-inline: auto;
990 }
991 .changelog-list details {
992 margin-top: 25px;
993 }
994 .changelog-list details[open] summary {
995 color: var(--wowp-orange);
996 }
997 .changelog-list summary {
998 font-size: 20px;
999 font-weight: 500;
1000 cursor: pointer;
1001 color: var(--wowp-blue);
1002 }
1003 .changelog-list h4 {
1004 font-size: 22px;
1005 padding-bottom: 0.75rem;
1006 border-bottom: 2px solid #FADFD0;
1007 margin-bottom: 1rem;
1008 display: inline-block;
1009 }
1010 .changelog-list ul {
1011 margin-left: 25px;
1012 }
1013 .changelog-list ul li {
1014 font-size: 16px;
1015 line-height: 1.5;
1016 padding-left: 8px;
1017 }
1018 .changelog-list ul li::marker {
1019 font-size: 12px;
1020 }
1021 .changelog-list ul li.changed::marker {
1022 content: "↩️";
1023 }
1024 .changelog-list ul li.updated::marker {
1025 content: "🔄";
1026 }
1027 .changelog-list ul li.added::marker {
1028 content: "�
1029 ";
1030 }
1031 .changelog-list ul li.fixed::marker {
1032 content: "🛠";
1033 }
1034 .changelog-list ul li.initial::marker {
1035 content: "📢";
1036 }