PluginProbe
AutomatorWP – No-Code Workflow Automation, Integration & Webhooks Plugin, now with AI / 5.8.5
AutomatorWP – No-Code Workflow Automation, Integration & Webhooks Plugin, now with AI v5.8.5
6.0.3 6.0.2 6.0.1 6.0.0 5.8.6 5.8.5 5.8.4 5.8.3 5.8.2 5.8.1 5.8.0 5.7.9.2 5.7.9.1 5.7.8 5.7.9 5.7.6 5.7.7 5.7.5 5.7.4 5.7.3 5.7.2 5.7.1 trunk 5.6.0 5.6.1 All 34 releases
automatorwp / assets / css / automatorwp-admin.css

automatorwp-admin.css in AutomatorWP – No-Code Workflow Automation, Integration & Webhooks Plugin, now with AI 5.8.5, at assets/css/automatorwp-admin.css

3,466 lines 90.2 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 /* -------------------------------------------
2 AutomatorWP Icon
3 ------------------------------------------- */
4
5 @font-face {
6 font-family: 'AutomatorWP';
7 src: url('../fonts/automatorwp.eot?6ncb0e');
8 src: url('../fonts/automatorwp.eot?6ncb0e#iefix') format('embedded-opentype'),
9 url('../fonts/automatorwp.ttf?6ncb0e') format('truetype'),
10 url('../fonts/automatorwp.woff?6ncb0e') format('woff'),
11 url('../fonts/automatorwp.svg?6ncb0e#automatorwp') format('svg');
12 font-weight: normal;
13 font-style: normal;
14 }
15
16 .dashicons-automatorwp, .dashicons-automatorwp:before {
17 font-family: 'AutomatorWP' !important;
18 speak: none;
19 font-style: normal;
20 font-weight: normal;
21 font-variant: normal;
22 text-transform: none;
23 line-height: 1;
24
25 -webkit-font-smoothing: antialiased;
26 -moz-osx-font-smoothing: grayscale;
27
28 content: "\e900";
29 }
30
31 /* -------------------------------------------
32 General
33 ------------------------------------------- */
34
35 /* Admin Menu */
36 .toplevel_page_automatorwp .wp-submenu li:nth-child(8) {
37 border-top: 1px solid #666;
38 }
39
40 /* -------------------------------------------
41 Automations Edit Screen
42 ------------------------------------------- */
43
44 .admin_page_edit_automatorwp_automations .postbox .inside {
45 overflow: inherit !important;
46 }
47
48 /* Make title appear like WordPress title */
49 #automatorwp-automations-title.postbox {
50 border: 0;
51 box-shadow: none;
52 background: transparent;
53 }
54
55 #automatorwp-automations-title .postbox-header,
56 #automatorwp-automations-title .handlediv,
57 #automatorwp-automations-title .hndle,
58 #automatorwp-automations-title .cmb-th {
59 display: none;
60 }
61
62 #automatorwp-automations-title .inside {
63 padding: 0;
64 margin: 0;
65 }
66
67 #automatorwp-automations-title .cmb-td {
68 width: 100%;
69 max-width: 100% !important;
70 padding: 0;
71 }
72
73 #automatorwp-automations-title .cmb-td input {
74 padding: 3px 8px;
75 font-size: 1.7em;
76 line-height: 100%;
77 height: 1.7em;
78 width: 100%;
79 outline: none;
80 margin: 0 0 3px;
81 background-color: #fff;
82 }
83
84 /* Side boxes */
85 #post-body.columns-2 #postbox-container-1 .automatorwp-box-form input:not([type="checkbox"]):not([type="radio"]),
86 #post-body.columns-2 #postbox-container-1 .automatorwp-box-form select,
87 #post-body.columns-2 #postbox-container-1 .automatorwp-box-form .automatorwp-select2,
88 #post-body.columns-2 #postbox-container-1 .automatorwp-box-form textarea {
89 width: 100%;
90 }
91
92 #post-body.columns-2 #postbox-container-1 .automatorwp-box-form .automatorwp-select2 {
93 width: 100% !important;
94 }
95
96 #post-body.columns-2 #postbox-container-1 .automatorwp-box-form .cmb-type-text-datetime-timestamp input.cmb2-datepicker {
97 max-width: 110px;
98 }
99
100 #post-body.columns-2 #postbox-container-1 .automatorwp-box-form .cmb-type-text-datetime-timestamp input.cmb2-timepicker {
101 display: inline;
102 max-width: 90px;
103 margin-top: 0;
104 }
105
106 #post-body.columns-2 #postbox-container-1 .automatorwp-box-form .cmb-th,
107 #post-body.columns-2 #postbox-container-1 .automatorwp-box-form .cmb-td {
108 padding: 0;
109 }
110
111 #post-body.columns-2 #postbox-container-1 .automatorwp-box-form .cmb-td:not(.cmb-remove-row),
112 #post-body.columns-2 #postbox-container-1 .automatorwp-box-form .cmb-th,
113 #post-body.columns-2 #postbox-container-1 .automatorwp-box-form .cmb-td:not(.cmb-remove-row),
114 #post-body.columns-2 #postbox-container-1 .automatorwp-box-form .cmb-th + .cmb-td {
115 padding: 0;
116 }
117
118 #post-body.columns-2 #postbox-container-1 .cmb-row:not(:last-of-type) {
119 padding-bottom: 0;
120 }
121
122 #post-body.columns-2 #postbox-container-1 .automatorwp-box-form .cmb-td .cmb2-metabox-description {
123 padding-bottom: 0;
124 }
125
126 /* Automation actions */
127 #automatorwp-automations-save-changes #automatorwp-automation-actions .automatorwp-automation-action {
128 margin-bottom: 6px;
129 }
130
131 /* Publishing actions */
132 #automatorwp-automations-save-changes #major-publishing-actions,
133 #automatorwp-automations-execution-options #major-publishing-actions {
134 margin: 20px -12px -12px -12px;
135 display: block;
136 }
137
138 #automatorwp-automations-save-changes #major-publishing-actions .automatorwp-save-and-activate {
139 float: right;
140 margin-bottom: 4px;
141 margin-top: 4px;
142 }
143
144 #automatorwp-automations-save-changes #major-publishing-actions .automatorwp-save-and-activate + #publishing-action {
145 float: left;
146 margin-top: 4px;
147 }
148
149 #automatorwp-automations-save-changes .submitdelete {
150 color: #a00;
151 }
152
153 /* Triggers and actions box */
154 #automatorwp_triggers.postbox,
155 #automatorwp_actions.postbox {
156 border: none;
157 background: transparent;
158 box-shadow: none;
159 }
160
161 #automatorwp_triggers.postbox .postbox-header,
162 #automatorwp_triggers.postbox .handlediv,
163 #automatorwp_triggers.postbox .hndle,
164 #automatorwp_actions.postbox .postbox-header,
165 #automatorwp_actions.postbox .handlediv,
166 #automatorwp_actions.postbox .hndle {
167 display: none;
168 }
169
170 #automatorwp_triggers.postbox .inside,
171 #automatorwp_actions.postbox .inside {
172 padding: 0;
173 margin: 0;
174 }
175
176 .automatorwp-title {
177 font-size: 23px;
178 }
179
180 .automatorwp-subtitle {
181 font-size: 16px;
182 margin-bottom: 1em;
183 color: #72777c;
184 }
185
186 /* Sequential field */
187 .automatorwp-sequential-field {
188 float: left;
189 width: 100%;
190 padding-bottom: 1.2em;
191 font-size: 14px;
192 }
193
194 .automatorwp-sequential-field > label {
195 float: left;
196 font-weight: 500;
197 padding-right: 8px;
198 }
199
200 .automatorwp-sequential-field .cmb-td {
201 float: left;
202 padding: 0;
203 }
204
205 /* Integration icon */
206 .automatorwp-integration-icon {
207 background-image: url('../img/integration-default.svg');
208 background-repeat: no-repeat;
209 background-position: center;
210 background-size: cover;
211 background-color: #fff;
212 border: 1px solid #ccd0d4;
213 box-shadow: 0 1px 1px rgba(0, 0, 0, 0.04);
214 border-radius: 8px;
215 margin: 0 auto;
216 max-width: 55px;
217 max-height: 55px;
218 height: 55px;
219 }
220
221 .automatorwp-integration-icon img {
222 width: 100%;
223 border-radius: 8px;
224 }
225
226 .automatorwp-integration-icon + .automatorwp-integration-label {
227 font-size: 14px;
228 margin-top: .8em;
229 }
230
231 /* Select integration + trigger or action */
232 .automatorwp-select-integration-label,
233 .automatorwp-select-trigger-label,
234 .automatorwp-select-action-label {
235 font-size: 16px;
236 margin-bottom: 0.5em;
237 }
238
239 .automatorwp-integrations {
240 display: flex;
241 flex-wrap: wrap;
242 }
243
244 .automatorwp-integrations .automatorwp-integration {
245 position: relative;
246 width: 150px;
247 text-align: center;
248 padding: 1em;
249 border-radius: 8px;
250 cursor: pointer;
251 }
252
253 .automatorwp-integrations .automatorwp-integration:hover {
254 background: rgba(0, 124, 186, 0.1);
255 }
256
257 .automatorwp-all-integrations-choices + .automatorwp-select2 {
258 margin-bottom: 1em;
259 }
260
261 .automatorwp-integration-choices-container {
262 position: relative;
263 }
264
265 .automatorwp-integration-choices-container .automatorwp-integration-choices + .automatorwp-select2 {
266 position: absolute !important;
267 visibility: hidden;
268 }
269
270 .automatorwp-integration-choices-container .automatorwp-select2-dropdown-container .select2-dropdown {
271 border: none;
272 }
273
274 .automatorwp-integration-choices-container .automatorwp-select2-dropdown-container .select2-search--dropdown {
275 padding: 0;
276 }
277
278 .automatorwp-integration-choices-container .automatorwp-select2-dropdown-container .select2-search__field {
279 width: 100% !important;
280 border-radius: 4px 4px 0 0;
281 margin: 0;
282 }
283
284 .automatorwp-integration-choices-container .automatorwp-select2-dropdown-container .select2-results {
285 border: 1px solid #ccd0d4;
286 box-shadow: 0 1px 1px rgba(0, 0, 0, 0.04);
287 font-size: 14px;
288 margin-top: -1px;
289 }
290
291 .automatorwp-integration-choices-container .select2-container--disabled + .automatorwp-select2-dropdown-container .select2-search__field,
292 .automatorwp-integration-choices-container .select2-container--disabled + .automatorwp-select2-dropdown-container .select2-results__option:not(.select2-results__option--highlighted) {
293 background: #f5f5f5;
294 }
295
296 /* Inline select2 dropdown */
297 .automatorwp-select2-dropdown-container {
298 margin-bottom: 1em;
299 }
300
301 .automatorwp-select2-dropdown-container .select2-container {
302 position: relative !important;
303 top: 0 !important;
304 left: 0 !important;
305 }
306
307 .automatorwp-select2-dropdown-container .select2-dropdown {
308 position: relative !important;
309 }
310
311 /* Pro integrations */
312 .automatorwp-integration-pro-badge {
313 position: absolute;
314 top: 4px;
315 right: 40px;
316 z-index: 1;
317 background: #46b450;
318 color: #fff;
319 padding: 3px 5px;
320 border-radius: 4px;
321 font-weight: 500;
322 font-size: 11px;
323 }
324
325 /* Pro trigger and actions options */
326 .automatorwp-select2-dropdown-container .select2-results__option[aria-disabled="true"] {
327 color: #666 !important;
328 background: #eee;
329 }
330 .automatorwp-select2-dropdown-container .select2-results__option[aria-disabled="true"]:before {
331 content: 'PRO';
332 display: inline-block;
333 background: #46b450;
334 color: #fff;
335 padding: 3px 5px;
336 border-radius: 4px;
337 font-weight: 500;
338 font-size: 11px;
339 margin-right: 4px;
340 }
341
342 /* Automation items */
343 .automatorwp-automation-item {
344 display: flex;
345 border: 1px solid #ccd0d4;
346 box-shadow: 0 1px 1px rgba(0, 0, 0, 0.04);
347 background: #fff;
348 padding: 1em 1em 1em 0;
349 margin-bottom: 1em;
350
351 cursor: grab; /* To notice that items are draggable */
352 }
353
354 .automatorwp-automation-item .button + .button {
355 margin-left: 2px;
356 }
357
358 .automatorwp-automation-item-details {
359 text-align: center;
360 width: 80px;
361 }
362
363 .automatorwp-automation-item-content {
364 width: calc( 100% - 80px );
365 }
366
367 .automatorwp-automation-item-content > .automatorwp-integration-label {
368 font-weight: 500;
369 color: #72777c;
370 border: 1px solid #ccd0d4;
371 border-radius: 50px;
372 display: inline-block;
373 padding: 0 0.6em;
374 margin-bottom: 0.5em;
375 }
376
377 .automatorwp-automation-item-position {
378 float: left;
379 clear: both;
380 font-size: 16px;
381 line-height: 32px;
382 font-weight: 500;
383 margin-right: 4px;
384 }
385
386 .automatorwp-actions .automatorwp-automation-item-position {
387 display: none;
388 }
389
390 .automatorwp-automation-item-label {
391 font-size: 16px;
392 line-height: 32px;
393 }
394
395 .automatorwp-automation-item-label > .button {
396 min-height: 32px;
397 line-height: 2;
398 padding: 0 12px;
399 margin: 0 !important;
400 font-size: 14px;
401 }
402
403 .automatorwp-no-grab {
404 cursor: auto; /* Disable cursor grab */
405 }
406
407 /* Automation item actions */
408 .automatorwp-automation-item-actions {
409 float: right;
410 margin-top: -4px;
411 margin-right: -4px;
412 }
413
414 .automatorwp-automation-item-actions .automatorwp-automation-item-action {
415 display: inline-block;
416 width: 25px;
417 height: 25px;
418 text-align: center;
419 cursor: pointer;
420 }
421
422 .automatorwp-automation-item-actions .automatorwp-automation-item-action .dashicons {
423 line-height: 25px;
424 }
425
426 .automatorwp-automation-item:first-child .automatorwp-automation-item-action-move-up,
427 .automatorwp-automation-item:last-child .automatorwp-automation-item-action-move-down {
428 color: #a0a5aa;
429 cursor: default;
430 }
431
432 .automatorwp-automation-item-actions .automatorwp-automation-item-action-delete {
433 color: #e15151;
434 }
435
436 /* Automation item options */
437
438 .button.automatorwp-button,
439 .automatorwp-option.button:not(.button-primary):not(.automatorwp-button-success):not(.automatorwp-button-danger):not(.automatorwp-button-dark) {
440 border: none;
441 color: #444;
442 background: #e5e5e5;
443 }
444
445 .button.automatorwp-button:hover,
446 .automatorwp-option.button:not(.button-primary):not(.automatorwp-button-success):not(.automatorwp-button-danger):not(.automatorwp-button-dark):hover {
447 background: #ddd;
448 color: #444;
449 }
450
451 .button.automatorwp-button:focus,
452 .button.automatorwp-button:active,
453 .automatorwp-option.button:not(.button-primary):not(.automatorwp-button-success):not(.automatorwp-button-danger):not(.automatorwp-button-dark):focus,
454 .automatorwp-option.button:not(.button-primary):not(.automatorwp-button-success):not(.automatorwp-button-danger):not(.automatorwp-button-dark):active {
455 background: #cfcfcf;
456 color: #444;
457 }
458
459 /* Option form */
460 .automatorwp-option-form-container {
461 background: #f5f5f5;
462 border: 1px solid #ccd0d4;
463 box-shadow: 0 1px 1px rgba(0, 0, 0, 0.04);
464 padding: 1em 1.5em 1.5em;
465 margin-top: 1em;
466 cursor: auto; /* Disable cursor grab */
467 }
468
469 .automatorwp-option-form .cmb-th {
470 width: 100%;
471 padding: 0;
472 }
473
474 .automatorwp-option-form .cmb-td {
475 width: 100%;
476 padding: 0 0 1em 0;
477 }
478
479 .automatorwp-option-form .mce-container iframe {
480 min-height: 200px;
481 }
482
483 /* Automation missing plugin item */
484 .automatorwp-automation-missing-integration-item .automatorwp-automation-item-label {
485 opacity: 0.6;
486 }
487
488 .automatorwp-automation-missing-integration-item .automatorwp-notice-warning {
489 margin: 0;
490 }
491
492 /* Recommended integrations */
493 .automatorwp-recommended-integrations {
494 margin-top: 8px;
495 }
496
497 .automatorwp-recommended-integrations-label {
498 font-size: 16px;
499 }
500
501 .automatorwp-recommended-integrations-label span {
502 color: #72777c;
503 }
504
505 .automatorwp-recommended-integrations .automatorwp-integrations {
506 margin-top: 8px;
507 }
508
509 .automatorwp-recommended-integrations .automatorwp-integration {
510 text-decoration: none;
511 color: #444;
512 }
513
514 .automatorwp-recommended-integrations .automatorwp-integration-triggers-and-actions {
515 color: #72777c;
516 }
517
518 /* More integrations */
519 .automatorwp-more-integrations {
520 font-size: 13px;
521 margin-top: 8px;
522 }
523
524 .automatorwp-more-integrations span {
525 color: #72777c;
526 }
527
528 /* Prevent to show the "Now" button in time pickers */
529 .admin_page_edit_automatorwp_automations #ui-datepicker-div .ui-datepicker-buttonpane button.ui-datepicker-current {
530 display: none;
531 }
532
533 /* -------------------------------------------
534 Anonymous Automations
535 ------------------------------------------- */
536
537 /* Anonymous automations edit screen */
538 body.edit-anonymous-automation .automatorwp-sequential-field,
539 body.edit-anonymous-automation .automatorwp-add-trigger,
540 body.edit-anonymous-automation #automatorwp_triggers .automatorwp-add-filter,
541 body.edit-anonymous-automation #cmb-field-js-controls-times_per_user-before,
542 body.edit-anonymous-automation .cmb2-id-times-per-user,
543 body.edit-anonymous-automation #cmb-field-js-controls-times_per_user-after {
544 display: none;
545 }
546
547 body:not(.edit-anonymous-automation) .automatorwp-automation-ui-anonymous-notice {
548 display: none;
549 }
550
551 .automatorwp-automation-ui-anonymous-notice {
552 font-size: 16px;
553 color: #72777c;
554 }
555
556 .automatorwp-automation-ui-anonymous-notice .dashicons {
557 color: #007cba;
558 vertical-align: text-bottom;
559 margin-right: 2px;
560 }
561
562 /* Anonymous automations user action */
563 .automatorwp-action-automatorwp-anonymous-user .automatorwp-integration-label {
564 display: none;
565 }
566
567 .automatorwp-action-automatorwp-anonymous-user .automatorwp-anonymous-user-label {
568 line-height: 1;
569 margin-bottom: 8px;
570 }
571
572 .automatorwp-action-automatorwp-anonymous-user .automatorwp-anonymous-user-choice {
573 display: inline-block;
574 width: 120px;
575 border: 1px solid #ccd0d4;
576 box-shadow: 0 1px 1px rgba(0, 0, 0, 0.04);
577 border-radius: 8px;
578 font-size: 14px;
579 line-height: 1;
580 text-align: center;
581 padding: 8px;
582 cursor: pointer;
583 }
584
585 .automatorwp-action-automatorwp-anonymous-user .automatorwp-anonymous-user-choice + .automatorwp-anonymous-user-choice {
586 margin-left: 6px;
587 }
588
589 .automatorwp-action-automatorwp-anonymous-user .automatorwp-anonymous-user-choice:hover {
590 background: rgba(0, 124, 186, 0.1);
591 border-color: #88ccef;
592 }
593
594 .automatorwp-action-automatorwp-anonymous-user .automatorwp-anonymous-user-choice img {
595 display: block;
596 width: 40%;
597 margin: 0 auto 8px;
598 }
599
600 /* Anonymous automations user action form */
601 .automatorwp-action-automatorwp-anonymous-user .cmb2-id-run-actions-on {
602 display: none;
603 }
604
605 .automatorwp-action-automatorwp-anonymous-user .cmb2-id-search-field,
606 .automatorwp-action-automatorwp-anonymous-user .cmb2-id-search-field-value {
607 width: 49%;
608 float: left;
609 }
610
611 .automatorwp-action-automatorwp-anonymous-user .cmb2-id-search-field-value {
612 margin-left: 2% !important;
613 }
614
615 .automatorwp-anonymous-user-resume {
616 background: rgb(245, 245, 245);
617 border: 1px solid rgb(204, 208, 212);
618 box-shadow: rgba(0, 0, 0, 0.04) 0px 1px 1px;
619 padding: 1em;
620 margin-top: 1em;
621 }
622
623 .automatorwp-anonymous-user-resume div {
624 margin-bottom: 4px;
625 }
626
627 .automatorwp-anonymous-user-resume img {
628 width: 30px;
629 vertical-align: bottom;
630 margin-right: 4px;
631 }
632
633 .automatorwp-anonymous-user-resume strong {
634 border: none;
635 background: #404459;
636 color: #fff;
637 line-height: 2.15384615;
638 min-height: 32px;
639 margin: 0;
640 padding: 0 10px;
641 display: inline-block;
642 border-radius: 3px;
643 font-size: 14px;
644 cursor: pointer;
645 }
646
647 /* -------------------------------------------
648 Automation Loop (All Users & All Posts)
649 ------------------------------------------- */
650
651 body.is-automatorwp-loop .automatorwp-sequential-field,
652 body.is-automatorwp-loop #automatorwp_triggers .automatorwp-add-trigger,
653 body.is-automatorwp-loop #cmb-field-js-controls-times_per_user-before,
654 body.is-automatorwp-loop .cmb2-id-times-per-user,
655 body.is-automatorwp-loop #cmb-field-js-controls-times_per_user-after {
656 display: none;
657 }
658
659 /* Execution options box */
660 #automatorwp-automations-execution-options #items_per_loop {
661 width: 80px !important;
662 margin: 0 4px;
663 }
664
665 #automatorwp-automations-execution-options #delay_amount {
666 width: 60px !important;
667 margin: 0 4px;
668 }
669
670 #automatorwp-automations-execution-options .automatorwp-items-per-loop-label-before .dashicons,
671 #automatorwp-automations-execution-options .automatorwp-delay-amount-label-before .dashicons {
672 color: #82878c;
673 margin-top: 8px;
674 margin-left: -1px;
675 margin-right: 5px;
676 }
677
678 #automatorwp-automations-execution-options .cmb2-id-delay-amount {
679 display: inline-block;
680 }
681
682 #automatorwp-automations-execution-options .cmb2-id-delay-seconds {
683 display: inline-block;
684 width: 126px;
685 padding-bottom: 12px !important;
686 }
687
688 #automatorwp-automations-execution-options .cmb2-id-schedule-run,
689 #automatorwp-automations-execution-options .cmb2-id-recurring-run {
690 padding-top: 6px !important;
691 }
692
693 #automatorwp-automations-execution-options .cmb2-id-schedule-run .cmb-th,
694 #automatorwp-automations-execution-options .cmb2-id-recurring-run .cmb-th {
695 float: left;
696 width: auto;
697 margin-right: 6px;
698 }
699
700 #automatorwp-automations-execution-options .cmb2-id-schedule-run .cmb-th label,
701 #automatorwp-automations-execution-options .cmb2-id-recurring-run .cmb-th label {
702 font-weight: 400;
703 }
704
705 #automatorwp-automations-execution-options .cmb2-id-schedule-run .dashicons,
706 #automatorwp-automations-execution-options .cmb2-id-recurring-run .dashicons {
707 color: #82878c;
708 margin-right: 4px;
709 }
710
711 #automatorwp-automations-execution-options .cmb2-id-schedule-run .cmb-td,
712 #automatorwp-automations-execution-options .cmb2-id-recurring-run .cmb-td {
713 float: left !important;
714 width: auto !important;
715 }
716
717 #automatorwp-automations-execution-options .cmb2-id-schedule-run-datetime {
718 padding: 4px 0 12px 0 !important;
719 }
720
721 #automatorwp-automations-execution-options .cmb2-id-recurring-run-day,
722 #automatorwp-automations-execution-options .cmb2-id-recurring-run-period {
723 float: left;
724 padding-top: 10px !important;
725 padding-bottom: 12px !important;
726 }
727
728 #automatorwp-automations-execution-options label[for="recurring_run_day"] {
729 color: #222222;
730 }
731
732 #automatorwp-automations-execution-options .cmb2-id-recurring-run-period {
733 width: 114px;
734 margin-left: 4px;
735 margin-right: 4px;
736 }
737
738 #automatorwp-automations-execution-options .cmb2-id-recurring-run-day .cmb2-metabox-description {
739 display: inline-block !important;
740 }
741
742 #automatorwp-automations-execution-options .cmb2-id-recurring-run-day input {
743 width: 65px !important;
744 margin-left: 4px;
745 }
746
747 #automatorwp-automations-execution-options .cmb2-id-recurring-run-day .cmb-th,
748 #automatorwp-automations-execution-options .cmb2-id-recurring-run-period .cmb-th {
749 display: none;
750 }
751
752 #automatorwp-automations-execution-options .cmb2-id-recurring-run-time {
753 margin-bottom: 10px;
754 padding-top: 10px !important;
755 }
756
757 #automatorwp-automations-execution-options .cmb2-id-recurring-run-time .cmb-th {
758 float: left !important;
759 width: auto !important;
760 }
761
762 #automatorwp-automations-execution-options .cmb2-id-recurring-run-time .cmb-td {
763 float: left !important;
764 width: 90px !important;
765 margin-left: 4px;
766 }
767
768 #automatorwp-automations-execution-options .cmb2-id-recurring-run-time .cmb-th label {
769 font-weight: 400;
770 padding-top: 8px;
771 color: #666;
772 }
773
774 #automatorwp-automations-execution-options .automatorwp-next-run-date .dashicons {
775 color: #82878c;
776 }
777
778 #automatorwp-automations-execution-options .automatorwp-run-automation button {
779 display: block;
780 margin: 0 auto 0 0;
781 }
782
783 #automatorwp-automations-execution-options .automatorwp-run-automation button .dashicons {
784 vertical-align: middle;
785 opacity: 0.8;
786 }
787
788 #automatorwp-automations-execution-options .automatorwp-run-automation button .dashicons.dashicons-controls-play {
789 margin-top: -4px;
790 line-height: 1.1;
791 }
792
793 #automatorwp-automations-execution-options .automatorwp-run-automation button .dashicons.dashicons-update {
794 -webkit-animation: rotation 2s linear infinite;
795 -moz-animation: rotation 2s linear infinite;
796 animation: rotation 2s linear infinite;
797 line-height: 1 !important;
798 }
799
800 #automatorwp-automations-execution-options .automatorwp-run-automation.automatorwp-is-running,
801 #automatorwp-automations-execution-options .automatorwp-cancel-automation-run {
802 float: left;
803 width: 50%;
804 }
805
806 #automatorwp-automations-execution-options .automatorwp-cancel-automation-run button {
807 display: block;
808 margin: 0 0 0 auto;
809 }
810
811 #automatorwp-automations-execution-options .automatorwp-run-automation-progress {
812 margin-top: 12px;
813 }
814
815 #automatorwp-automations-execution-options .automatorwp-run-automation-progress .automatorwp-run-automation-progress-bar {
816 height: 12px;
817 background: rgba(0,0,0,0.1);
818 }
819
820 #automatorwp-automations-execution-options .automatorwp-run-automation-progress .automatorwp-run-automation-progress-bar .automatorwp-run-automation-progress-current-progress {
821 height: 12px;
822 width: 0;
823 background-color: var(--wp-admin-theme-color, #2d8bd7);
824 transition: width 0.5s ease-out;
825 }
826
827 #automatorwp-automations-execution-options .automatorwp-run-automation-progress-completed .automatorwp-run-automation-progress-bar .automatorwp-run-automation-progress-current-progress {
828 background-color: #30c03c;
829 }
830
831 #automatorwp-automations-execution-options .automatorwp-run-automation-progress .automatorwp-run-automation-progress-text {
832 font-size: 13px;
833 color: #666;
834 }
835
836 #automatorwp-automations-execution-options .automatorwp-notice-error {
837 margin: 14px 0 6px 0;
838 }
839
840 /* -------------------------------------------
841 Filters
842 ------------------------------------------- */
843
844 .automatorwp-automation-item-filter {
845 position: relative;
846 margin-left: 20px;
847 margin-bottom: 0.6em;
848 }
849
850 .automatorwp-automation-item:not(.automatorwp-automation-item-filter) + .automatorwp-automation-item-filter {
851 margin-top: -4px;
852 }
853
854 .automatorwp-automation-item-filter:before {
855 content: "";
856 display: block;
857 border-left: 2px dashed #ccd0d4;
858 border-bottom: 2px dashed #ccd0d4;
859 width: 12px;
860 height: 38px;
861 position: absolute;
862 top: -10px;
863 left: -14px;
864 }
865
866 .automatorwp-automation-item-filter + .automatorwp-automation-item-filter:after {
867 content: "";
868 display: block;
869 border-left: 2px dashed #ccd0d4;
870 height: 29px;
871 position: absolute;
872 left: -14px;
873 top: -45px;
874 }
875
876 .automatorwp-automation-item-filter .automatorwp-automation-item-details {
877 width: 60px;
878 }
879
880 .automatorwp-automation-item-filter .automatorwp-automation-item-content {
881 width: calc( 100% - 60px );
882 }
883
884 .automatorwp-automation-item-filter .automatorwp-integration-icon {
885 border: none !important;
886 box-shadow: none !important;
887 max-width: 32px;
888 max-height: 32px;
889 height: 32px;
890 }
891
892 .automatorwp-automation-item-filter .automatorwp-integration-label,
893 .automatorwp-automation-item-filter .automatorwp-automation-item-position {
894 display: none !important;
895 }
896
897 .automatorwp-filter-select2 .select2-dropdown li[role="group"] > strong {
898 background: #fff;
899 border-bottom: 1px solid #ccd0d4;
900 padding: 6px 8px;
901 line-height: 24px;
902 }
903
904 .automatorwp-filter-select2 .select2-dropdown li[role="group"] > strong img {
905 display: inline-block;
906 float: left;
907 width: 24px;
908 height: 24px;
909 border-radius: 6px;
910 border: 1px solid #ccd0d4;
911 box-shadow: 0 1px 1px rgba(0, 0, 0, 0.04);
912 margin-right: 8px;
913 }
914
915 /* -------------------------------------------
916 Forms Columns
917 ------------------------------------------- */
918 .automatorwp-form .cmb-row[class*="automatorwp-col-"] {
919 float: left;
920 }
921
922 .automatorwp-form .cmb-row.automatorwp-col-3 {
923 width: 24%;
924 }
925
926 .automatorwp-form .cmb-row.automatorwp-col-4 {
927 width: 32%;
928 }
929
930 .automatorwp-form .cmb-row.automatorwp-col-6 {
931 width: 49%;
932 }
933
934 /* 6 | 6 */
935 .automatorwp-form .cmb-row.automatorwp-col-6 + .cmb-row.automatorwp-col-6 {
936 margin-left: 2%;
937 }
938
939 /* 6 | 3 | 3 */
940 .automatorwp-form .cmb-row.automatorwp-col-6 + .cmb-row.automatorwp-col-3,
941 .automatorwp-form .cmb-row.automatorwp-col-6 + .cmb-row.automatorwp-col-3 + .cmb-row.automatorwp-col-3 {
942 width: 23%;
943 margin-left: 2%;
944 }
945
946 /* 3 | 3 | 3 | 3 */
947 .automatorwp-form .cmb-row.automatorwp-col-3 + .cmb-row.automatorwp-col-3,
948 .automatorwp-form .cmb-row.automatorwp-col-3 + .cmb-row.automatorwp-col-3 + .cmb-row.automatorwp-col-3,
949 .automatorwp-form .cmb-row.automatorwp-col-3 + .cmb-row.automatorwp-col-3 + .cmb-row.automatorwp-col-3 + .cmb-row.automatorwp-col-3 {
950 width: 23%;
951 margin-left: 2%;
952 }
953
954 /* 4 | 4 | 4 */
955 .automatorwp-form .cmb-row.automatorwp-col-4 + .cmb-row.automatorwp-col-4,
956 .automatorwp-form .cmb-row.automatorwp-col-4 + .cmb-row.automatorwp-col-4 + .cmb-row.automatorwp-col-4 {
957 width: 32%;
958 margin-left: 2%;
959 }
960
961 /* -------------------------------------------
962 Forms
963 ------------------------------------------- */
964 .automatorwp-form input:not([type="button"]):not([type="submit"]),
965 .automatorwp-form textarea:not(.wp-editor-area),
966 .automatorwp-form select,
967 .automatorwp-form .automatorwp-select2 .select2-selection--single,
968 .automatorwp-select2 .select2-search--dropdown .select2-search__field {
969 border: 1px solid #ccd0d4;
970 box-shadow: 0 1px 1px rgba(0, 0, 0, 0.04);
971 padding: 4px 12px;
972 }
973
974 .automatorwp-form select {
975 margin-top: 0 !important;
976 }
977
978 .automatorwp-form input::placeholder,
979 .automatorwp-form textarea::placeholder,
980 .automatorwp-form select::placeholder {
981 opacity: 0.5;
982 }
983
984 .automatorwp-select2 .select2-search--dropdown .select2-search__field {
985 border: 1px solid #ccd0d4 !important;
986 }
987
988 .automatorwp-form input:not([type="button"]):not([type="submit"]):hover,
989 .automatorwp-form textarea:not(.wp-editor-area):hover,
990 .automatorwp-form select:hover,
991 .automatorwp-form .automatorwp-select2 .select2-selection--single:hover,
992 .automatorwp-select2 .select2-search--dropdown .select2-search__field:hover {
993 border-color: #bbc;
994 }
995
996 .automatorwp-form input:not([type="button"]):not([type="submit"]):focus,
997 .automatorwp-form select:focus,
998 .automatorwp-form textarea:not(.wp-editor-area):focus,
999 .automatorwp-form .automatorwp-select2 .select2-selection--single:focus,
1000 .automatorwp-select2 .select2-search--dropdown .select2-search__field:focus {
1001 border-color: #aab;
1002 }
1003
1004 .automatorwp-form input:disabled, .automatorwp-form input.disabled,
1005 .automatorwp-form select:disabled, .automatorwp-form select.disabled,
1006 .automatorwp-form textarea:not(.wp-editor-area):disabled, .automatorwp-form textarea.disabled:not(.wp-editor-area) {
1007 background: #f5f5f5;
1008 }
1009
1010 .automatorwp-form .cmb-th .cmb-group-name {
1011 padding: 5px 0 !important;
1012 font-weight: 500;
1013 }
1014
1015 .automatorwp-form .cmb-th .cmb-group-name + .cmb2-metabox-description {
1016 font-weight: 400;
1017 padding: 0 !important;
1018 }
1019
1020 .automatorwp-automation-item input[type="text"],
1021 .automatorwp-automation-item input[type="number"],
1022 .automatorwp-automation-item input[type="email"],
1023 .automatorwp-automation-item select,
1024 .automatorwp-automation-item .automatorwp-select2,
1025 .automatorwp-automation-item textarea {
1026 width: 100% !important;
1027 }
1028
1029 .automatorwp-automation-item .cmb2-switch .cmb-td {
1030 margin-top: 5px;
1031 }
1032
1033 .automatorwp-option-form .cmb2-switch.cmb-type-checkbox input {
1034 top: -2px !important;
1035 }
1036
1037 .automatorwp-option-form .cmb2-switch.cmb-type-checkbox input + label:before,
1038 .automatorwp-option-form .cmb2-switch.cmb-type-checkbox input + label:after {
1039 top: 0 !important;
1040 }
1041
1042 /* Repeatable */
1043 .automatorwp-form .cmb-repeat-row .cmb-td {
1044 width: calc( 100% - 25px );
1045 }
1046
1047 .automatorwp-form .cmb-repeat-row .cmb-remove-row {
1048 position: absolute !important;
1049 display: block !important;
1050 width: 24px !important;
1051 }
1052
1053 .automatorwp-form .cmb-repeat-row .cmb-remove-row .cmb-remove-row-button {
1054 border: none;
1055 padding: 12px 12px;
1056 background: transparent;
1057 color: #72777c;
1058 }
1059
1060 .automatorwp-form .cmb-repeat-row .cmb-remove-row .cmb-remove-row-button:hover {
1061 color: #444;
1062 }
1063
1064 .automatorwp-form .cmb-repeat-row .cmb-remove-row .cmb-remove-row-button:before {
1065 line-height: 44px;
1066 }
1067
1068 /* Compatibility fix between CMB2 & WP 7.0 */
1069 .cmb2-wrap input[type=radio]:checked:focus {
1070 background: var(--wp-admin-theme-color);
1071 }
1072
1073 /* Groups */
1074 .cmb-type-group .cmb-group-description,
1075 .cmb-type-group .cmb-row:not(.cmb-repeatable-grouping) {
1076 border-bottom: 0 !important;
1077 }
1078
1079 .cmb-type-group .cmb-group-description .cmb-th {
1080 padding: 0 !important;
1081 }
1082
1083 .cmb-type-group .cmb-repeatable-grouping {
1084 border: 1px solid #ccd0d4 !important;
1085 box-shadow: 0 1px 1px rgba(0, 0, 0, 0.04);
1086 }
1087
1088 /* File */
1089 .automatorwp-form .cmb-type-file .cmb2-upload-button {
1090 margin-left: 0 !important;
1091 margin-top: 8px;
1092 }
1093
1094 .automatorwp-form .cmb-type-file .cmb2-upload-button {
1095 background: #404459;
1096 border: #404459;
1097 color: #fff;
1098 }
1099
1100 .automatorwp-form .cmb-type-file .cmb2-upload-button :hover {
1101 background: #4b5068;
1102 border: #4b5068;
1103 color: #fff;
1104 }
1105
1106 .automatorwp-form .cmb-type-file .cmb2-upload-button :focus,
1107 .automatorwp-form .cmb-type-file .cmb2-upload-button :active {
1108 background: #36394a;
1109 border: #36394a;
1110 color: #fff;
1111 }
1112
1113 .automatorwp-form .cmb-type-file .cmb2-metabox-description {
1114 width: calc(100% - 38px) !important;
1115 padding-bottom: .5em;
1116 }
1117
1118 .automatorwp-form .cmb-type-file.automatorwp-hide-preview .cmb2-media-status {
1119 display: none !important;
1120 }
1121
1122 .automatorwp-form .cmb-type-file .cmb2-media-status {
1123 display: inline-block;
1124 width: calc(100% - 38px) !important;
1125 }
1126
1127
1128 .automatorwp-form .cmb-type-file .cmb2-remove-file-button {
1129 color: #a00;
1130 }
1131 /* -------------------------------------------
1132 Select2
1133 ------------------------------------------- */
1134 .automatorwp-select2 .select2-selection--single {
1135 height: auto !important;
1136 }
1137
1138 .automatorwp-select2 .select2-selection--single .select2-selection__rendered {
1139 padding-left: 0 !important;
1140 }
1141
1142 .automatorwp-select2 .select2-selection--single .select2-selection__arrow {
1143 height: 38.5px !important;
1144 width: 30px !important;
1145 }
1146
1147 .automatorwp-select2 .select2-dropdown {
1148 border: 1px solid #ccd0d4;
1149 box-shadow: 0 1px 1px rgba(0, 0, 0, 0.04);
1150 }
1151
1152 .automatorwp-select2 .select2-results__option {
1153 padding: 10px;
1154 margin: 0;
1155 background: #f5f5f5;
1156 }
1157
1158 .automatorwp-select2 .select2-results__option:not(:last-child) {
1159 border-bottom: 1px solid #ccd0d4;
1160 }
1161
1162 .automatorwp-select2 .select2-results .select2-results__option .result-description {
1163 display: block;
1164 position: relative;
1165 color: #aaaaaa;
1166 }
1167
1168 .automatorwp-select2 .select2-results .select2-results__option .result-description.align-right,
1169 .automatorwp-select2 .select2-results .select2-results__option .result-description .align-right {
1170 float: right;
1171 }
1172
1173 .automatorwp-select2 .select2-results__option--highlighted[aria-selected] {
1174 background-color: var(--wp-admin-theme-color, #5897fb) !important;
1175 }
1176
1177 .automatorwp-select2 .select2-results__option--highlighted[aria-selected] .result-description {
1178 color: rgba(255,255,255,0.7);
1179 }
1180
1181 /* -------------------------------------------
1182 Select2 Multiple
1183 ------------------------------------------- */
1184 .automatorwp-select2 .select2-selection--multiple,
1185 .automatorwp-select2.select2-container--focus .select2-selection--multiple {
1186 border: 1px solid #ccd0d4 !important;
1187 box-shadow: 0 1px 1px rgba(0, 0, 0, 0.04);
1188 }
1189
1190 .automatorwp-select2 .select2-search--inline {
1191 width: 100% !important;
1192 margin: 0;
1193 }
1194
1195 .automatorwp-select2 .select2-search--inline .select2-search__field {
1196 width: 100% !important;
1197 margin: 4px 0 0 0;
1198 }
1199
1200 .automatorwp-select2 .select2-selection--multiple .select2-selection__choice {
1201 background: #f5f5f5 !important;
1202 border: 1px solid #ccd0d4 !important;
1203 box-shadow: 0 1px 1px rgba(0, 0, 0, 0.04);
1204 border-radius: 2px !important;
1205 padding: 4px 8px !important;
1206 }
1207
1208 .automatorwp-select2 .select2-selection--multiple .select2-selection__choice__remove {
1209 font-size: 16px;
1210 margin-left: -2px;
1211 }
1212
1213 .automatorwp-select2 .select2-selection--multiple .select2-selection__rendered {
1214 padding: 4px 8px !important;
1215 }
1216
1217 /* -------------------------------------------
1218 Tags Selector
1219 ------------------------------------------- */
1220 .automatorwp-automation-item .cmb-td {
1221 position: relative;
1222 z-index: 1;
1223 }
1224
1225 .automatorwp-automation-item .cmb-td .cmb2-metabox-description {
1226 display: inline-block;
1227 }
1228
1229 .automatorwp-automation-item input:not([type="button"]):not([type="submit"]):not([type="checkbox"]):not([type="radio"]):not([type="search"]),
1230 .automatorwp-automation-item textarea:not(.wp-editor-area) {
1231 width: calc( 100% - 38px ) !important;
1232 border-radius: 4px 0 0 4px;
1233 }
1234
1235 .automatorwp-automation-item .wp-editor-wrap {
1236 width: calc( 100% - 44px );
1237 display: inline-block;
1238 }
1239
1240 .automatorwp-automation-tag-selector {
1241 display: none;
1242 }
1243
1244 .automatorwp-automation-tag-selector + .automatorwp-select2 {
1245 position: absolute;
1246 top: 0;
1247 left: 0;
1248 height: 38px;
1249 z-index: -1;
1250 outline: 0;
1251 }
1252
1253 .automatorwp-automation-tag-selector + .automatorwp-select2:focus {
1254 outline: 0;
1255 border: none;
1256 }
1257
1258 .automatorwp-automation-tag-selector + .automatorwp-select2 .select2-selection--single {
1259 border: none;
1260 box-shadow: none;
1261 background: transparent;
1262 }
1263
1264 .automatorwp-automation-tag-selector + .automatorwp-select2 .select2-selection--single:focus {
1265 outline: 0;
1266 border: none;
1267 }
1268
1269 .automatorwp-automation-tag-selector + .automatorwp-select2 .select2-selection__arrow {
1270 font-family: 'dashicons';
1271 display: inline-block;
1272 line-height: 1;
1273 font-weight: 400;
1274 font-style: normal;
1275 speak: none;
1276 text-decoration: inherit;
1277 text-transform: none;
1278 text-rendering: auto;
1279 -webkit-font-smoothing: antialiased;
1280 -moz-osx-font-smoothing: grayscale;
1281 width: 20px;
1282 height: 20px;
1283 font-size: 20px;
1284 vertical-align: top;
1285 text-align: center;
1286 transition: color 0.1s ease-in;
1287
1288 top: 0 !important;
1289 right: 0 !important;
1290 padding: 0 3px;
1291 border: 1px solid #ccd0d4;
1292 border-radius: 0 4px 4px 0;
1293 box-shadow: 0 1px 1px rgba(0, 0, 0, 0.04);
1294 color: #72777c;
1295 background: #f3f5f6;
1296 }
1297
1298 .cmb-type-wysiwyg .automatorwp-automation-tag-selector + .automatorwp-select2 .select2-selection__arrow {
1299 border-radius: 4px;
1300 }
1301
1302 .cmb-type-wysiwyg .automatorwp-automation-tag-selector + .automatorwp-select2 .select2-selection__rendered {
1303 display: none;
1304 }
1305
1306 .automatorwp-automation-tag-selector + .automatorwp-select2 .select2-selection__arrow:hover {
1307 border-color: #bbc;
1308 background: #f1f1f1;
1309 }
1310
1311 .automatorwp-automation-tag-selector + .automatorwp-select2 .select2-selection__arrow:before {
1312 content: "\f206";
1313 display: inline-block;
1314 margin-top: 9px;
1315 }
1316
1317 .automatorwp-automation-tag-selector + .automatorwp-select2 .select2-selection__arrow b {
1318 display: none;
1319 }
1320
1321 .automatorwp-tags-select2 .select2-dropdown li[role="group"] > strong {
1322 cursor: pointer;
1323 }
1324
1325 .automatorwp-tags-select2 .select2-dropdown li[role="group"] > strong img {
1326 display: inline-block;
1327 float: left;
1328 width: 24px;
1329 height: 24px;
1330 border-radius: 6px;
1331 border: 1px solid #ccd0d4;
1332 box-shadow: 0 1px 1px rgba(0, 0, 0, 0.04);
1333 margin-right: 8px;
1334 }
1335
1336 .automatorwp-tags-select2 .select2-dropdown li[role="group"] > strong {
1337 font-size: 14px;
1338 font-weight: 400;
1339 padding: 10px 12px;
1340 line-height: 24px;
1341 /* The SVG is arrow-down-alt2 from Dashicons. */
1342 background: #fff url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20width%3D%2220%22%20height%3D%2220%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M5%206l5%205%205-5%202%201-7%207-7-7%202-1z%22%20fill%3D%22%23555%22%2F%3E%3C%2Fsvg%3E') no-repeat right 8px top 55%;
1343 }
1344
1345 .automatorwp-tags-select2 .select2-dropdown li[role="group"]:last-child > strong {
1346 border-bottom: 0;
1347 }
1348
1349 .automatorwp-tags-select2 .select2-dropdown li[role="group"] > strong .automatorwp-option {
1350 padding: 0px 8px !important;
1351 min-height: 26px !important;
1352 line-height: 22px !important;
1353 }
1354
1355 .automatorwp-tags-select2 .select2-dropdown li[role="group"] > ul {
1356 display: none;
1357 background: #f5f5f5;
1358 font-size: 14px;
1359 }
1360
1361 .automatorwp-tags-select2 .select2-dropdown .select2-results__option[aria-selected=true]:not(.select2-results__option--highlighted) {
1362 background: transparent;
1363 }
1364
1365 .automatorwp-tags-select2 .select2-dropdown .select2-results > .select2-results__options,
1366 .automatorwp-select2 .select2-dropdown .select2-results > .select2-results__options {
1367 max-height: 350px;
1368 overflow-x: hidden;
1369 }
1370
1371 /*.automatorwp-tags-select2 .select2-dropdown li[role="group"] > ul li:first-child {*/
1372 .automatorwp-tags-select2 .select2-dropdown li[role="group"] > ul {
1373 border-top: 1px solid #ccd0d4;
1374 }
1375
1376 .automatorwp-tags-select2 .select2-dropdown li[role="group"] > ul li {
1377 display: inline-block;
1378 position: relative;
1379 border: none;
1380 background: #e0e0e0;
1381 font-size: 12px;
1382 padding: 6px 8px;
1383 border-radius: 2px;
1384 margin: 6px;
1385 }
1386
1387 .automatorwp-tags-select2 .select2-dropdown li[role="group"] > ul li:not(.select2-results__option--highlighted) {
1388
1389 }
1390
1391 .automatorwp-tags-select2 .select2-dropdown li[role="group"] > ul li strong {
1392 /*display: inline-block;*/
1393 /*min-width: 130px;*/
1394 }
1395
1396 .automatorwp-tags-select2 .select2-dropdown li[role="group"] > ul li > span {
1397 font-size: 12px;
1398 bottom: 125%;
1399 left: 0;
1400 min-width: 200px;
1401 background: #2c3338;
1402 color: #ccc !important;
1403 padding: 4px 6px;
1404 border-radius: 4px;
1405
1406 display: none;
1407 }
1408
1409 .automatorwp-tags-select2 .select2-dropdown li[role="group"] > ul li:hover > span {
1410 display: block;
1411 position: absolute;
1412 z-index: 99999;
1413 }
1414
1415 .automatorwp-tags-select2 .select2-dropdown li[role="group"] > ul li > span:before {
1416 content: '';
1417 display: block;
1418 width: 0;
1419 height: 0;
1420 position: absolute;
1421 border-bottom: 8px solid transparent;
1422 border-top: 8px solid #2c3338;
1423 border-left: 8px solid transparent;
1424 border-right: 8px solid transparent;
1425 left: 8px;
1426 bottom: -14px;
1427 }
1428
1429 .automatorwp-tags-select2 .select2-dropdown li[role="group"]:first-of-type > ul li > span {
1430 top: 125%;
1431 bottom: auto;
1432 }
1433
1434 .automatorwp-tags-select2 .select2-dropdown li[role="group"]:first-of-type > ul li > span:before {
1435 border-bottom: 8px solid #2c3338;
1436 border-top: 8px solid transparent;
1437 top: -14px;
1438 bottom: auto;
1439 }
1440
1441 .automatorwp-tags-select2 .select2-dropdown li[role="group"] > ul li > span span {
1442 display: block;
1443 font-weight: 700;
1444 font-size: 11px;
1445 }
1446
1447 .automatorwp-tags-select2 .select2-dropdown li[role="group"] > ul li.select2-results__option--highlighted span {
1448 color: rgba(255,255,255,0.7);
1449 }
1450
1451 .automatorwp-tags-select2 .select2-results__option[aria-disabled=true] {
1452 color: #777 !important;
1453 font-weight: 500;
1454 }
1455
1456 /* -------------------------------------------
1457 Selector Custom Input
1458 ------------------------------------------- */
1459 .automatorwp-selector-custom-input .cmb-td {
1460 margin-left: 30px;
1461 width: calc(100% - 30px);
1462 margin-top: -4px;
1463 }
1464
1465 .automatorwp-selector-custom-input .cmb-td:before {
1466 content: "\f474";
1467 transform: scaleX(-1);
1468 opacity: 0.7;
1469 position: absolute;
1470 top: 6px;
1471 left: -23px;
1472
1473 font-family: dashicons;
1474 display: inline-block;
1475 line-height: 1;
1476 font-weight: 400;
1477 font-style: normal;
1478 speak: never;
1479 text-decoration: inherit;
1480 text-transform: none;
1481 text-rendering: auto;
1482 -webkit-font-smoothing: antialiased;
1483 -moz-osx-font-smoothing: grayscale;
1484 width: 20px;
1485 height: 20px;
1486 font-size: 20px;
1487 vertical-align: top;
1488 text-align: center;
1489 transition: color .1s ease-in;
1490 }
1491
1492 .automatorwp-selector-custom-input .cmb-td input {
1493 margin-top: -4px;
1494 }
1495
1496 /* -------------------------------------------
1497 JS Controls
1498 ------------------------------------------- */
1499
1500 .automatorwp-form .cmb-field-js-controls-before + .cmb-row {
1501 background: #f5f5f5;
1502 border: 1px solid #ccd0d4 !important;
1503 box-shadow: 0 1px 1px rgba(0, 0, 0, 0.04);
1504 border-bottom: 0 !important;
1505 padding: 8px 6px !important;
1506 }
1507
1508 .automatorwp-form .cmb-field-js-controls-after {
1509 background: #f5f5f5;
1510 border: 1px solid #ccd0d4;
1511 box-shadow: 0 1px 1px rgba(0, 0, 0, 0.04);
1512 margin-top: 0;
1513 border-top: 0;
1514 padding: 4px 6px 8px;
1515 }
1516
1517 /* -------------------------------------------
1518 Colorpicker
1519 ------------------------------------------- */
1520
1521 .automatorwp-form .wp-picker-container .wp-color-result.button {
1522 padding: 0 0 0 17px;
1523 }
1524
1525 /* -------------------------------------------
1526 Automations List
1527 ------------------------------------------- */
1528
1529 .automatorwp-automation-completions,
1530 .automatorwp-automation-status {
1531 font-size: 12px;
1532 font-weight: 600;
1533 color: #444;
1534 background: #e5e5e5;
1535 display: inline-block;
1536 padding: 2px 6px;
1537 border-radius: 4px;
1538 }
1539
1540 .automatorwp-automation-completions-completed,
1541 .automatorwp-automation-status-active {
1542 color: #269630;
1543 background: #d6fdd1;
1544 }
1545
1546 .automatorwp-automation-status-inactive {
1547 color: #dc3232;
1548 background: #ffdddd;
1549 }
1550
1551 .wp-list-table.automatorwp_automations .column-type .automatorwp-integration-icon,
1552 .wp-list-table.automatorwp_automations .column-triggers .automatorwp-integration-icon,
1553 .wp-list-table.automatorwp_automations .column-actions .automatorwp-integration-icon {
1554 display: inline-block;
1555 width: 22px;
1556 max-width: 22px;
1557 max-height: 22px;
1558 height: 22px;
1559 border-radius: 4px;
1560 margin-bottom: 2px;
1561 vertical-align: middle;
1562 }
1563
1564 .wp-list-table.automatorwp_automations .column-type .automatorwp-integration-icon {
1565 padding: 2px;
1566 width: 18px;
1567 height: 18px;
1568 }
1569
1570 .wp-list-table.automatorwp_automations .cmb-tooltip-desc,
1571 .wp-list-table.automatorwp_logs .cmb-tooltip-desc {
1572 white-space: nowrap;
1573 text-align: center;
1574 width: auto;
1575 padding: 4px 8px !important;
1576 }
1577
1578 .wp-list-table.automatorwp_logs .cmb-tooltip-desc.cmb-tooltip-top {
1579 bottom: 130%;
1580 }
1581
1582 .automatorwp_page_automatorwp_logs .subsubsub .filter {
1583 float: none !important;
1584 }
1585
1586 /* -------------------------------------------
1587 Logs Edit Screen
1588 ------------------------------------------- */
1589 #post-body .misc-pub-post-user:before {
1590 content: "\f110";
1591 }
1592
1593 #post-body .misc-pub-post-user:before {
1594 font: normal 20px/1 dashicons;
1595 speak: none;
1596 display: inline-block;
1597 margin-left: -1px;
1598 padding-right: 3px;
1599 vertical-align: top;
1600 -webkit-font-smoothing: antialiased;
1601 -moz-osx-font-smoothing: grayscale;
1602 }
1603 #post-body .misc-pub-post-user:before {
1604 color: #82878c;
1605 }
1606
1607 #post-user-display {
1608 font-weight: 600;
1609 }
1610
1611 #automatorwp_log_data .cmb-th,
1612 #automatorwp_log_data .cmb-td {
1613 padding: 10px;
1614 }
1615
1616 #automatorwp_log_data .cmb-th label {
1617 padding-top: 0px;
1618 }
1619
1620 #automatorwp_log_data .cmb-type-title {
1621 border: 1px solid #ddd;
1622 border-left: 0;
1623 border-right: 0;
1624 background: #f5f5f5;
1625 margin: 5px -12px;
1626 }
1627
1628 #automatorwp_log_data .cmb-type-title .cmb-td {
1629 padding: 10px 20px;
1630 }
1631
1632 #automatorwp_log_data .cmb-type-title .cmb2-metabox-title,
1633 #automatorwp_log_data .cmb-type-title .cmb2-metabox-description {
1634 padding: 0;
1635 margin: 0;
1636 }
1637
1638 .automatorwp-log-title-preview .automatorwp-integration-icon {
1639 position: relative;
1640 float: left;
1641 margin-right: 6px;
1642 width: 40px;
1643 max-width: 40px;
1644 max-height: 40px;
1645 height: 40px;
1646 margin-top: -6px;
1647 }
1648
1649 /* Logs list screen */
1650 .wp-list-table.automatorwp_logs .column-title .automatorwp-integration-icon {
1651 position: relative;
1652 float: left;
1653 margin-right: 6px;
1654 width: 40px;
1655 max-width: 40px;
1656 max-height: 40px;
1657 height: 40px;
1658 margin-top: 1px;
1659 }
1660
1661 .automatorwp-log-title-preview .automatorwp-integration-icon .automatorwp-filter-icon,
1662 .wp-list-table.automatorwp_logs .column-title .automatorwp-integration-icon .automatorwp-filter-icon,
1663 .automatorwp-dashboard .automatorwp-integration-icon .automatorwp-filter-icon {
1664 position: absolute;
1665 top: 23px;
1666 left: 23px;
1667 width: 16px;
1668 height: 16px;
1669 border-width: 1px;
1670 border-style: solid;
1671 }
1672
1673 .automatorwp-log-title-preview .automatorwp-integration-icon .automatorwp-filter-icon,
1674 .automatorwp-log-title-preview .automatorwp-integration-icon .automatorwp-filter-icon img,
1675 .wp-list-table.automatorwp_logs .column-title .automatorwp-integration-icon .automatorwp-filter-icon,
1676 .wp-list-table.automatorwp_logs .column-title .automatorwp-integration-icon .automatorwp-filter-icon img,
1677 .automatorwp-dashboard .automatorwp-integration-icon .automatorwp-filter-icon,
1678 .automatorwp-dashboard .automatorwp-integration-icon .automatorwp-filter-icon img {
1679 display: block;
1680 border-radius: 4px;
1681 }
1682
1683 .automatorwp-integration-icon .automatorwp-filter-icon-passed {
1684 background: #46b450;
1685 border-color: #46b450;
1686 }
1687
1688 .automatorwp-integration-icon .automatorwp-filter-icon-not-passed {
1689 background: #dc3232;
1690 border-color: #dc3232;
1691 }
1692
1693 .automatorwp-clear-all-logs-button {
1694 float: right;
1695 margin-left: 4px !important;
1696 margin-top: 11px !important;
1697 }
1698
1699 /* -------------------------------------------
1700 Field Required
1701 ------------------------------------------- */
1702 .automatorwp-field-required {
1703 color: #dc3232;
1704 font-weight: 700;
1705 font-size: 18px;
1706 line-height: 0;
1707 }
1708
1709 /* -------------------------------------------
1710 Spinner
1711 ------------------------------------------- */
1712 .automatorwp-spinner {
1713 float: right;
1714 }
1715
1716 .automatorwp-spinner .spinner {
1717 float: none;
1718 margin-top: 0;
1719 }
1720
1721 .automatorwp-spinner .spinner-label {
1722 display: inline-block;
1723 float: right;
1724 font-size: 14px;
1725 margin-top: 0;
1726 color: #72777c;
1727 }
1728
1729 .automatorwp-box-spinner {
1730 display: inline-block;
1731 float: none;
1732 }
1733
1734 /* -------------------------------------------
1735 Buttons
1736 ------------------------------------------- */
1737 .button.automatorwp-button-success {
1738 background: #46b450;
1739 border: #46b450;
1740 color: #fff;
1741 }
1742
1743 .button.automatorwp-button-success:hover {
1744 background: #40a549;
1745 border: #40a549;
1746 color: #fff;
1747 }
1748
1749 .button.automatorwp-button-success:focus,
1750 .button.automatorwp-button-success:active {
1751 background: #399341;
1752 border: #399341;
1753 color: #fff;
1754 }
1755
1756 .button.automatorwp-button-danger {
1757 background: #e15151;
1758 border: #e15151;
1759 color: #fff;
1760 }
1761
1762 .button.automatorwp-button-danger:hover {
1763 background: #de3b3b;
1764 border: #de3b3b;
1765 color: #fff;
1766 }
1767
1768 .button.automatorwp-button-danger:focus,
1769 .button.automatorwp-button-danger:active {
1770 background: #da2525;
1771 border: #da2525;
1772 color: #fff;
1773 }
1774
1775 .button.automatorwp-button-dark {
1776 background: #404459;
1777 border: #404459;
1778 color: #fff;
1779 }
1780
1781 .button.automatorwp-button-dark:hover {
1782 background: #4b5068;
1783 border: #4b5068;
1784 color: #fff;
1785 }
1786
1787 .button.automatorwp-button-dark:focus,
1788 .button.automatorwp-button-dark:active {
1789 background: #36394a;
1790 border: #36394a;
1791 color: #fff;
1792 }
1793
1794 .automatorwp-add-trigger,
1795 .automatorwp-add-action,
1796 .automatorwp-add-filter {
1797 min-height: 32px !important;
1798 line-height: 2 !important;
1799 padding: 0 12px !important;
1800 }
1801
1802 .automatorwp-add-trigger.button .dashicons,
1803 .automatorwp-add-action.button .dashicons,
1804 .automatorwp-add-filter.button .dashicons {
1805 opacity: 0.8;
1806 margin-right: 4px;
1807 margin-left: -4px;
1808 line-height: 1 !important;
1809 vertical-align: middle !important;
1810 color: #fff !important; /* Fix for Elementor */
1811 }
1812
1813 .automatorwp-add-filter.button:disabled .dashicons,
1814 .automatorwp-add-filter.button.disabled .dashicons {
1815 color: #949494 !important;
1816 }
1817
1818 .automatorwp-add-filter.button .dashicons {
1819 line-height: 1.7;
1820 font-size: 16px;
1821 }
1822
1823 /* -------------------------------------------
1824 Notices
1825 ------------------------------------------- */
1826 .automatorwp-notice-info,
1827 .automatorwp-notice-warning,
1828 .automatorwp-notice-error,
1829 .automatorwp-notice-success {
1830 font-weight: 500;
1831 padding: 10px 12px;
1832 border-radius: 4px;
1833 margin-bottom: 15px;
1834 }
1835
1836 .automatorwp-notice-info {
1837 color: #007cba;
1838 background: #d9f1fd;
1839 }
1840
1841 .automatorwp-notice-warning {
1842 color: #a27806;
1843 background: #fff0c9;
1844 }
1845
1846 .automatorwp-notice-error {
1847 color: #dc3232;
1848 background: #ffdddd;
1849 }
1850
1851 .automatorwp-notice-success {
1852 color: #269630;
1853 background: #d6fdd1;
1854 }
1855
1856
1857 /* -------------------------------------------
1858 Tooltip
1859 ------------------------------------------- */
1860 .automatorwp-tooltip {
1861 position: absolute;
1862 right: -4px;
1863 top: 6px;
1864 cursor: help;
1865 }
1866
1867 .automatorwp-tooltip .dashicons {
1868 width: 24px;
1869 height: 24px;
1870 font-size: 24px;
1871 }
1872
1873 /* Desktop */
1874 @media screen and (min-width: 768px) {
1875 .automatorwp-has-tooltip .cmb2-metabox-description:not(.automatorwp-tooltip-dialog) {
1876 display: none !important;
1877 }
1878
1879 .cmb2-metabox-description.automatorwp-tooltip-dialog {
1880 position: absolute;
1881 top: -4px;
1882 right: 25px;
1883 left: -25px;
1884 z-index: 9999;
1885 padding: 10px !important;
1886 font-style: normal !important;
1887 font-size: 13px;
1888 border-radius: 4px;
1889 box-shadow: 0 3px 5px rgba(0, 0, 0, 0.2);
1890 background: #2c3338;
1891 color: #ccc !important;
1892 }
1893
1894 .cmb2-metabox-description.automatorwp-tooltip-dialog:before {
1895 content: '';
1896 display: block;
1897 width: 0;
1898 height: 0;
1899 position: absolute;
1900 border-bottom: 8px solid transparent;
1901 border-top: 8px solid transparent;
1902 border-left: 8px solid #2c3338;
1903 right: -7px;
1904 top: 14px;
1905 }
1906
1907 .automatorwp-has-tooltip .cmb-td {
1908 position: relative;
1909 }
1910
1911 #post-body.columns-2 #postbox-container-1 .automatorwp-has-tooltip input,
1912 #post-body.columns-2 #postbox-container-1 .automatorwp-has-tooltip select,
1913 #post-body.columns-2 #postbox-container-1 .automatorwp-has-tooltip .automatorwp-select2,
1914 .automatorwp-has-tooltip input,
1915 .automatorwp-has-tooltip select {
1916 width: calc( 100% - 25px ) !important;
1917 }
1918
1919 #post-body.columns-2 #postbox-container-1 .automatorwp-has-tooltip .automatorwp-select2 .select2-search--inline .select2-search__field {
1920 width: 100% !important;
1921 }
1922 }
1923
1924 /* Smartphone */
1925 @media screen and (max-width: 768px) {
1926 .automatorwp-has-tooltip .automatorwp-tooltip {
1927 display: none;
1928 }
1929 }
1930
1931 /* -------------------------------------------
1932 Options List
1933 ------------------------------------------- */
1934 .cmb2-metabox-description + .automatorwp-toggleable-options-list {
1935 color: #757575;
1936 font-style: italic;
1937 margin-top: 5px;
1938 }
1939
1940 .cmb2-metabox-description + .automatorwp-toggleable-options-list code {
1941 color: #444;
1942 font-weight: 600;
1943 }
1944
1945 /* -------------------------------------------
1946 Fields Table
1947 ------------------------------------------- */
1948 .automatorwp-fields-table .inside {
1949 overflow: inherit !important;
1950 }
1951
1952 .automatorwp-fields-table .cmb-row {
1953 border-bottom: 0;
1954 }
1955
1956 .automatorwp-fields-table .cmb-repeatable-grouping > .cmb-remove-group-row,
1957 .automatorwp-fields-table .cmb-repeatable-grouping > .cmbhandle,
1958 .automatorwp-fields-table .cmb-repeatable-grouping:not(:nth-child(2)) > .cmb-group-title {
1959 display: none;
1960 }
1961
1962 .automatorwp-fields-table .cmb-repeatable-grouping .cmb-group-title {
1963 border-bottom: 1px solid #ccd0d4;
1964 background: #fff;
1965 margin: 0 !important;
1966 padding: 10px;
1967 border-radius: 4px 4px 0 0;
1968 }
1969
1970 .automatorwp-fields-table .cmb-repeatable-grouping {
1971 padding: 0 !important;
1972 margin: 0 !important;
1973 border-radius: 4px 4px 0 0;
1974 }
1975
1976 .automatorwp-fields-table .cmb-repeatable-grouping:not(:nth-child(2)) {
1977 border-top: 0 !important;
1978 }
1979
1980 .automatorwp-fields-table .cmb-repeatable-grouping .cmb-field-list {
1981 display: flex;
1982 background: #f5f5f5;
1983 }
1984
1985 .automatorwp-fields-table.automatorwp-fields-table-col-1 .cmb-repeatable-grouping .cmb-field-list .cmb-row:not(.cmb-remove-field-row) {
1986 width: 100%;
1987 }
1988 .automatorwp-fields-table .cmb-repeatable-grouping .cmb-field-list .cmb-row:not(.cmb-remove-field-row) {
1989 width: 50%;
1990 }
1991
1992 .automatorwp-fields-table .cmb-repeatable-grouping .cmb-field-list .cmb-row:not(:first-child) {
1993 border-left: 1px solid #ccd0d4 !important;
1994 }
1995
1996 .automatorwp-fields-table .cmb-repeatable-grouping .cmb-field-list .cmb-row {
1997 padding: 10px 10px;
1998 margin: 0;
1999 }
2000
2001 .automatorwp-fields-table .cmb-repeatable-grouping .cmb-field-list .cmb-th {
2002 width: auto;
2003 }
2004
2005 .automatorwp-fields-table .cmb-repeatable-grouping:not(:nth-child(2)) .cmb-field-list .cmb-th {
2006 display: none;
2007 }
2008
2009 .automatorwp-fields-table .cmb-repeatable-grouping:nth-child(2) .cmb-field-list .cmb-th {
2010 margin-top: -52px;
2011 margin-left: -11px;
2012 padding: 8px 0 8px 12px;
2013 }
2014
2015 .automatorwp-fields-table .cmb-repeatable-grouping:nth-child(2) .cmb-field-list .cmb-row:not(:first-child) .cmb-th {
2016 border-left: 1px solid #ccd0d4 !important;
2017 }
2018
2019 .automatorwp-fields-table .cmb-repeatable-grouping .cmb-field-list .cmb-td {
2020 width: 100%;
2021 }
2022
2023 /* Fields table remove button */
2024 .automatorwp-fields-table .cmb-repeatable-grouping .cmb-field-list .cmb-row.cmb-remove-field-row .cmb-remove-group-row-button {
2025 color: #72777c;
2026 border: none;
2027 background: transparent;
2028 padding: 8px 0;
2029 }
2030
2031 .automatorwp-fields-table .cmb-repeatable-grouping .cmb-field-list .cmb-row.cmb-remove-field-row .cmb-remove-group-row-button:hover {
2032 color: #444;
2033 }
2034
2035 /* Fields table add button */
2036 .automatorwp-fields-table .cmb-repeatable-group > .cmb-row:last-child {
2037 background: #fff;
2038 border: 1px solid #ccd0d4 !important;
2039 border-top: 0 !important;
2040 padding: 8px 10px;
2041 margin-bottom: 15px;
2042 border-radius: 0 0 4px 4px;
2043 }
2044
2045 .automatorwp-fields-table .cmb-repeatable-group > .cmb-row:last-child .cmb-add-row {
2046 margin: 0;
2047 }
2048
2049 .automatorwp-fields-table .cmb-repeatable-group > .cmb-row:last-child .cmb-add-group-row {
2050 font-size: 12px;
2051 min-height: 20px;
2052 }
2053
2054 /* -------------------------------------------
2055 Dialog
2056 ------------------------------------------- */
2057 .automatorwp-dialog {
2058 font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif !important;
2059 border: 1px solid #ccd0d4;
2060 box-shadow: 0 1px 1px rgba(0, 0, 0, 0.04);
2061 background: #fff;
2062 padding: 15px;
2063 font-size: 14px;
2064 z-index: 999999;
2065 border-radius: 8px;
2066 }
2067
2068 .automatorwp-dialog + .ui-widget-overlay {
2069 opacity: 0.7;
2070 background: #000;
2071 position: fixed;
2072 top: 0;
2073 left: 0;
2074 height: 100%;
2075 width: 100%;
2076 z-index: 99999;
2077 }
2078
2079 .automatorwp-dialog .ui-widget-content {
2080 border: none;
2081 }
2082
2083 .automatorwp-dialog .ui-dialog-titlebar {
2084 border: none;
2085 background: transparent;
2086 padding: 0;
2087 }
2088
2089 .automatorwp-dialog .ui-dialog-title {
2090 display: none;
2091 }
2092
2093 .automatorwp-dialog h2 {
2094 margin-top: 0;
2095 font-size: 1.5em;
2096 }
2097
2098 .automatorwp-dialog .button {
2099 font-size: 14px;
2100 }
2101
2102 .automatorwp-dialog .button + .button {
2103 margin-left: 4px;
2104 }
2105
2106 /* Dialog close button */
2107 .automatorwp-dialog .ui-dialog-titlebar-close {
2108 float: right;
2109 border: none;
2110 background: transparent;
2111 color: #72777c;
2112 margin-top: -10px;
2113 margin-right: -14px;
2114 cursor: pointer;
2115 }
2116
2117 .automatorwp-dialog .ui-dialog-titlebar-close:hover {
2118 color: #444;
2119 }
2120
2121 .automatorwp-dialog .ui-dialog-titlebar-close:before {
2122 content: "\f335";
2123
2124 font-family: dashicons;
2125 display: inline-block;
2126 line-height: 1;
2127 font-weight: 400;
2128 font-style: normal;
2129 speak: none;
2130 text-decoration: inherit;
2131 text-transform: none;
2132 text-rendering: auto;
2133 -webkit-font-smoothing: antialiased;
2134 -moz-osx-font-smoothing: grayscale;
2135 width: 20px;
2136 height: 20px;
2137 font-size: 20px;
2138 vertical-align: top;
2139 text-align: center;
2140 transition: color .1s ease-in;
2141 }
2142
2143 .automatorwp-dialog .ui-dialog-titlebar-close .ui-button-text {
2144 display: none;
2145 }
2146
2147 /* Dialog bottom button */
2148 .automatorwp-dialog .automatorwp-dialog-bottom:after {
2149 content: '';
2150 display: block;
2151 clear: both;
2152 }
2153
2154 .automatorwp-dialog .automatorwp-dialog-buttons {
2155 float: right;
2156 }
2157
2158 .automatorwp-dialog .automatorwp-dialog-buttons .automatorwp-dialog-cancel {
2159 line-height: 32px;
2160 }
2161
2162 /* -------------------------------------------
2163 Automation type dialog
2164 ------------------------------------------- */
2165 .automatorwp-automation-type-dialog .automatorwp-automation-types {
2166 display: flex;
2167 flex-wrap: wrap;
2168 margin-left: -6px;
2169 margin-right: -6px;
2170 }
2171
2172 .automatorwp-automation-type-dialog .automatorwp-automation-types .automatorwp-automation-type {
2173 position: relative;
2174 width: 21%;
2175 padding: 1em 0.5em;
2176 border: 2px solid #efefef;
2177 border-radius: 8px;
2178 cursor: pointer;
2179 margin-left: 6px;
2180 margin-right: 6px;
2181 margin-bottom: 12px;
2182 text-align: center;
2183 }
2184
2185 .automatorwp-automation-type-dialog .automatorwp-automation-types .automatorwp-automation-type:hover {
2186 background: rgba(0, 124, 186, 0.1);
2187 border-color: #88ccef;
2188 }
2189
2190 .automatorwp-automation-type-dialog .automatorwp-automation-types .automatorwp-automation-type.automatorwp-automation-type-selected {
2191 border-color: #008fd6;
2192 background: rgba(0, 124, 186, 0.2);
2193 }
2194
2195 .automatorwp-automation-type-dialog .automatorwp-automation-types .automatorwp-automation-type img {
2196 width: 38%;
2197 margin-bottom: 6px;
2198 }
2199
2200 .automatorwp-automation-type-dialog .automatorwp-automation-types .automatorwp-automation-type strong {
2201 display: block;
2202 font-size: 16px;
2203 margin-bottom: 8px;
2204 }
2205
2206 .automatorwp-automation-type-dialog .automatorwp-automation-types .automatorwp-automation-type .automatorwp-automation-type-description {
2207 font-size: 12px;
2208 margin-top: 6px;
2209 }
2210
2211 .automatorwp-automation-type-dialog .automatorwp-automation-type-dialog-automation-loop-title {
2212 margin: 0;
2213 margin-bottom: 12px;
2214 }
2215
2216 .automatorwp-automation-type-dialog .automatorwp-automation-type-dialog-automation-loop-title .cmb-tooltip {
2217 vertical-align: baseline;
2218 }
2219 .automatorwp-automation-type-dialog .automatorwp-automation-type-dialog-automation-loop-title .cmb-tooltip .dashicons {
2220 opacity: 0.3;
2221 }
2222
2223 .automatorwp-automation-type-dialog .automatorwp-automation-type-dialog-automation-loop-desc {
2224 margin-top: 2px;
2225 }
2226
2227 /* -------------------------------------------
2228 Automation URL export dialog
2229 ------------------------------------------- */
2230
2231 .automatorwp-automation-url-export-dialog label {
2232 display: block;
2233 font-weight: 500;
2234 margin-bottom: 6px;
2235 }
2236
2237 .automatorwp-automation-url-export-dialog .automatorwp-notice-error {
2238 margin-top: 1em;
2239 }
2240
2241 .automatorwp-automation-url-export-dialog .automatorwp-automation-url-export-dialog-input,
2242 .automatorwp-automation-url-export-dialog .automatorwp-automation-url-export-dialog-url {
2243 margin-bottom: 1em;
2244 }
2245
2246 .automatorwp-automation-url-export-dialog input {
2247 width: 100%;
2248 font-size: 18px !important;
2249 border: 2px solid #ccc;
2250 margin: 0;
2251 }
2252
2253 .automatorwp-automation-url-export-dialog .automatorwp-automation-url-export-dialog-desc {
2254 display: block;
2255 margin-top: 6px;
2256 font-style: italic;
2257 }
2258
2259 .automatorwp-automation-url-export-dialog-url input {
2260 width: calc( 100% - 40px );
2261 margin: 0;
2262 border-radius: 4px 0 0 4px;
2263 }
2264
2265 .automatorwp-automation-url-export-dialog-url-copy {
2266 position: relative;
2267 float: right;
2268 height: 36px;
2269 width: 38px;
2270 border: 2px solid #ccc;
2271 border-left: none;
2272 border-radius: 0 4px 4px 0;
2273 }
2274
2275 .automatorwp-automation-url-export-dialog-url-copy-icon {
2276 padding: 8px;
2277 cursor: pointer;
2278 opacity: 0.7;
2279 }
2280
2281 .automatorwp-automation-url-export-dialog-url-copy-text {
2282 opacity: 0;
2283 -webkit-transition: opacity 0.5s ease-in-out;
2284 -moz-transition: opacity 0.5s ease-in-out;
2285 transition: opacity 0.5s ease-in-out;
2286 }
2287
2288 .automatorwp-automation-url-export-dialog-url-copy:hover .automatorwp-automation-url-export-dialog-url-copy-text {
2289 opacity: 1;
2290 }
2291
2292 .automatorwp-automation-url-export-dialog-url-copy-text {
2293 position: absolute;
2294 top: -34px;
2295 width: 60px;
2296 font-size: 11px;
2297 text-align: center;
2298 right: -10px;
2299 z-index: 9999;
2300 padding: 4px;
2301 font-style: normal;
2302 border-radius: 4px;
2303 box-shadow: 0 3px 5px rgba(0, 0, 0, 0.2);
2304 background: #000;
2305 color: #fff;
2306 }
2307
2308 .automatorwp-automation-url-export-dialog-url-copy-text:before {
2309 content: '';
2310 display: block;
2311 width: 0;
2312 height: 0;
2313 position: absolute;
2314 border-top: 8px solid #000;
2315 border-left: 8px solid transparent;
2316 border-right: 8px solid transparent;
2317 bottom: -7px;
2318 left: 44%;
2319 }
2320
2321 /* -------------------------------------------
2322 Dashboard
2323 ------------------------------------------- */
2324
2325 body.toplevel_page_automatorwp,
2326 body.automatorwp_page_automatorwp_add_ons {
2327 background: #f5f5f5;
2328 }
2329
2330 .automatorwp-dashboard .wp-heading-inline {
2331 display: none !important;
2332 }
2333
2334 .automatorwp-dashboard .meta-box-sortables {
2335 margin-bottom: 0 !important;
2336 }
2337
2338 .automatorwp-dashboard .postbox .inside,
2339 .automatorwp-dashboard .postbox .inside p {
2340 font-size: 14px;
2341 }
2342
2343 .automatorwp-dashboard .postbox,
2344 .automatorwp-dashboard .automatorwp-plugin-card {
2345 border: none;
2346 border-radius: 6px;
2347 box-shadow: 0px 0px 16px rgba(0, 0, 0, 0.1);
2348 }
2349
2350 .automatorwp-dashboard #automatorwp-dashboard-videos.postbox,
2351 .automatorwp-dashboard #automatorwp-dashboard-plugins.postbox,
2352 .automatorwp-dashboard #automatorwp-dashboard-team.postbox,
2353 .automatorwp-dashboard #automatorwp-dashboard-social.postbox,
2354 .automatorwp-dashboard #automatorwp-dashboard-involved.postbox {
2355 background: transparent;
2356 box-shadow: none;
2357 }
2358
2359 .automatorwp-dashboard .postbox .hndle {
2360 display: block;
2361 cursor: auto;
2362 user-select: auto;
2363 font-size: 16px;
2364 }
2365
2366 .automatorwp-dashboard .postbox .hndle .button {
2367 text-decoration: none !important;
2368 float: right;
2369 margin-bottom: -7px;
2370 min-height: 30px;
2371 line-height: 2.30769231;
2372 padding: 0 12px;
2373 }
2374
2375 .automatorwp-dashboard .postbox .hndle .dashicons {
2376 opacity: 0.4;
2377 margin-right: 4px;
2378 }
2379
2380 .automatorwp-dashboard .postbox-header {
2381 border: none;
2382 }
2383
2384 .automatorwp-dashboard .automatorwp-dashboard-logo {
2385 margin-bottom: 10px;
2386 }
2387
2388 .automatorwp-dashboard .automatorwp-dashboard-logo img {
2389 width: 230px;
2390 vertical-align: middle;
2391 }
2392
2393 .automatorwp-dashboard .automatorwp-dashboard-logo .autoamtorwp-dashboard-version {
2394 font-size: 16px;
2395 font-weight: 700;
2396 }
2397
2398 .automatorwp-dashboard h1 {
2399 clear: both;
2400 margin: 0 8px 8px;
2401 font-size: 28px;
2402 }
2403
2404 .automatorwp-dashboard h3 {
2405 font-size: 16px !important;
2406 font-weight: 600 !important;
2407 }
2408
2409 .automatorwp-dashboard li {
2410 margin-bottom: 10px;
2411 }
2412
2413 .automatorwp-dashboard li h3 {
2414 margin-top: 10px !important;
2415 }
2416
2417 .automatorwp-dashboard li .dashicons {
2418 color: #82878c;
2419 }
2420
2421 /* Automations (latest & most completed) & Latest Logs */
2422 .automatorwp-dashboard .automatorwp-automations ul,
2423 .automatorwp-dashboard .automatorwp-latest-logs ul {
2424 margin-bottom: -12px;
2425 }
2426
2427 .automatorwp-dashboard .automatorwp-automations li,
2428 .automatorwp-dashboard .automatorwp-latest-logs li {
2429 display: block;
2430 padding: 8px 12px;
2431 margin-left: -12px;
2432 margin-right: -12px;
2433 margin-bottom: 0;
2434 font-size: 13px;
2435 }
2436
2437 .automatorwp-dashboard .automatorwp-automations li:nth-child(odd),
2438 .automatorwp-dashboard .automatorwp-latest-logs li:nth-child(odd) {
2439 background-color: #f6f7f7;
2440 }
2441
2442 .automatorwp-dashboard .automatorwp-automations li:last-child,
2443 .automatorwp-dashboard .automatorwp-latest-logs li:last-child {
2444 margin-bottom: 0;
2445 border-radius: 0 0 6px 6px;
2446 }
2447
2448 .automatorwp-dashboard .automatorwp-automations li > div,
2449 .automatorwp-dashboard .automatorwp-latest-logs li > div {
2450 display: flex;
2451 }
2452
2453 .automatorwp-dashboard .automatorwp-automations li > div > span,
2454 .automatorwp-dashboard .automatorwp-latest-logs li > div > span {
2455 min-height: 24px;
2456 }
2457
2458 .automatorwp-dashboard .automatorwp-automations li > div > span:first-child,
2459 .automatorwp-dashboard .automatorwp-latest-logs li > div > span:first-child {
2460 flex: 2;
2461 padding-right: 6px;
2462 }
2463
2464 .automatorwp-dashboard .automatorwp-latest-logs li > div > span:last-child,
2465 .automatorwp-dashboard .automatorwp-automations li > div > span:last-child {
2466 flex: 1;
2467 text-align: right;
2468 }
2469
2470 .automatorwp-dashboard .automatorwp-automations li > div:last-child > span,
2471 .automatorwp-dashboard .automatorwp-latest-logs li > div:last-child > span {
2472 color: #72777c;
2473 }
2474
2475 .automatorwp-dashboard .automatorwp-automations li .automatorwp-integration-icon {
2476 padding: 4px;
2477 width: 30px;
2478 height: 30px;
2479 border-radius: 4px;
2480 }
2481
2482 .automatorwp-dashboard .automatorwp-automations .cmb-tooltip-desc,
2483 .automatorwp-dashboard .automatorwp-latest-logs .cmb-tooltip-desc {
2484 white-space: nowrap;
2485 text-align: center;
2486 width: auto;
2487 padding: 4px 8px !important;
2488 bottom: 130%;
2489 }
2490
2491 .automatorwp-dashboard .automatorwp-automations li > div:first-child,
2492 .automatorwp-dashboard .automatorwp-latest-logs li > div:first-child {
2493 float: left;
2494 }
2495
2496 .automatorwp-dashboard .automatorwp-automations .automatorwp-integration-icon,
2497 .automatorwp-dashboard .automatorwp-latest-logs .automatorwp-integration-icon {
2498 position: relative;
2499 float: left;
2500 margin-right: 6px;
2501 width: 40px;
2502 max-width: 40px;
2503 max-height: 40px;
2504 height: 40px;
2505 margin-top: 1px;
2506 }
2507
2508 /* Add New Automation */
2509 .automatorwp-dashboard #automatorwp-dashboard-new-automation h3 {
2510 margin-bottom: 5px !important;
2511 }
2512
2513 .automatorwp-dashboard #automatorwp-dashboard-new-automation h3 .cmb-tooltip {
2514 vertical-align: middle;
2515 }
2516
2517 .automatorwp-dashboard #automatorwp-dashboard-new-automation h3 .cmb-tooltip .dashicons {
2518 opacity: 0.3;
2519 }
2520
2521 .automatorwp-dashboard #automatorwp-dashboard-new-automation h3 + p {
2522 font-size: 13px;
2523 }
2524
2525 .automatorwp-dashboard .automatorwp-automation-type-dialog .automatorwp-automation-types .automatorwp-automation-type {
2526 width: 100%;
2527 padding: 0.5em 0.5em;
2528 text-align: left;
2529 margin-bottom: 6px;
2530 }
2531
2532 .automatorwp-dashboard .automatorwp-automation-type-dialog .automatorwp-automation-types .automatorwp-automation-type img {
2533 width: 10%;
2534 float: left;
2535 margin-bottom: 0;
2536 }
2537
2538 .automatorwp-dashboard .automatorwp-automation-type-dialog .automatorwp-automation-types .automatorwp-automation-type .automatorwp-automation-type-description {
2539 margin-left: 45px;
2540 margin-top: 0;
2541 }
2542
2543 .automatorwp-dashboard .automatorwp-automation-type-dialog .automatorwp-automation-types .automatorwp-automation-type .automatorwp-automation-type-description strong {
2544 font-size: 14px;
2545 margin-bottom: 0px;
2546 }
2547
2548 .automatorwp-dashboard #automatorwp-dashboard-new-automation .button {
2549 margin-top: 8px;
2550 }
2551
2552 /* Videos */
2553 .automatorwp-dashboard #automatorwp-dashboard-videos .inside {
2554 margin-top: -16px;
2555 padding: 0;
2556 }
2557
2558 .automatorwp-dashboard #automatorwp-dashboard-plugins .inside,
2559 .automatorwp-dashboard #automatorwp-dashboard-team .inside,
2560 .automatorwp-dashboard #automatorwp-dashboard-involved .inside,
2561 .automatorwp-dashboard #automatorwp-dashboard-social .inside {
2562 padding: 0;
2563 }
2564
2565 .automatorwp-dashboard #automatorwp-dashboard-plugins .hndle,
2566 .automatorwp-dashboard #automatorwp-dashboard-team .hndle,
2567 .automatorwp-dashboard #automatorwp-dashboard-involved .hndle,
2568 .automatorwp-dashboard #automatorwp-dashboard-social .hndle {
2569 padding-left: 0;
2570 }
2571
2572 .automatorwp-dashboard .automatorwp-dashboard-video a {
2573 display: grid;
2574 grid-gap: 0;
2575 grid-template-columns: 1fr 3fr;
2576 margin-bottom: 5px;
2577 text-decoration: none;
2578 color: #3c434a;
2579 opacity: 0.8;
2580 }
2581
2582 .automatorwp-dashboard .automatorwp-dashboard-video a:hover {
2583 opacity: 1;
2584 }
2585
2586 .automatorwp-dashboard .automatorwp-dashboard-video .automatorwp-dashboard-video-image {
2587 height: 58px;
2588 overflow: hidden;
2589 }
2590
2591 .automatorwp-dashboard .automatorwp-dashboard-video .automatorwp-dashboard-video-image img {
2592 margin-top: -13px;
2593 }
2594
2595 .automatorwp-dashboard .automatorwp-dashboard-video .automatorwp-dashboard-video-details .automatorwp-dashboard-video-title {
2596 font-size: 15px;
2597 }
2598
2599 .automatorwp-dashboard .automatorwp-dashboard-video .automatorwp-dashboard-video-details .automatorwp-dashboard-video-duration {
2600 font-size: 13px;
2601 }
2602
2603 .automatorwp-dashboard .automatorwp-dashboard-get-involved p,
2604 .automatorwp-dashboard .automatorwp-dashboard-get-involved ul {
2605 margin-bottom: 20px;
2606 }
2607
2608 .automatorwp-dashboard .automatorwp-dashboard-pricing-button {
2609 margin-top: 28px;
2610 }
2611
2612 .automatorwp-dashboard .button.button-large {
2613 padding: 8px 18px;
2614 }
2615
2616 .automatorwp-dashboard .center {
2617 text-align: center;
2618 }
2619
2620 .automatorwp-dashboard-more-videos {
2621 margin-bottom: -12px;
2622 }
2623
2624 .automatorwp-dashboard-more-videos,
2625 .automatorwp-dashboard-more-add-ons {
2626 clear: both;
2627 text-align: center;
2628 font-size: 16px;
2629 padding-top: 20px;
2630 }
2631
2632 /* Dashboard: Add-ons */
2633 .automatorwp-dashboard .automatorwp-section-desc {
2634 margin-top: -12px;
2635 margin-left: 7px;
2636 }
2637
2638 .automatorwp-dashboard .automatorwp-dashboard-add-ons-section {
2639 margin: 0 !important;
2640 }
2641
2642 .automatorwp-dashboard .automatorwp-plugin-card {
2643 background: transparent;
2644 box-shadow: none;
2645 }
2646 .automatorwp-dashboard .automatorwp-plugin-card .thumbnail {
2647 width: 64px;
2648 height: 64px;
2649 }
2650
2651 .automatorwp-dashboard .automatorwp-plugin-card .thumbnail a {
2652 border-radius: 6px;
2653 overflow: hidden;
2654 margin-left: auto;
2655 margin-right: auto;
2656 box-shadow: 0px 0px 16px rgba(0, 0, 0, 0.1);
2657 background: #fff;
2658 }
2659
2660 .automatorwp-dashboard .automatorwp-plugin-card .thumbnail a img {
2661 max-width: 100%;
2662 }
2663
2664 .automatorwp-dashboard .automatorwp-plugin-card .name {
2665 text-align: center;
2666 }
2667
2668 .automatorwp-dashboard .automatorwp-plugin-card .name h3 {
2669 margin: 0 !important;
2670 }
2671 .automatorwp-dashboard .automatorwp-plugin-card .name a {
2672 text-decoration: none;
2673 font-weight: normal;
2674 color: #1d2327;
2675 overflow: hidden;
2676 white-space: nowrap;
2677 }
2678
2679 .automatorwp-dashboard .automatorwp-plugin-card .thumbnail a img {
2680 border-radius: 6px 6px 0 0;
2681 }
2682
2683 .automatorwp-dashboard .automatorwp-plugin-card .plugin-card-top {
2684 padding: 20px 8px 10px;
2685 min-height: auto;
2686 }
2687
2688 .automatorwp-dashboard .automatorwp-plugin-card .plugin-card-bottom {
2689 background: transparent;
2690 border: none;
2691 margin-top: -20px;
2692 }
2693
2694 .automatorwp-dashboard .automatorwp-plugin-card .cmb-tooltip-desc.cmb-tooltip-top {
2695 width: 150px;
2696 bottom: 95%
2697 }
2698
2699 .automatorwp-dashboard .automatorwp-plugin-card .cmb-tooltip-desc.cmb-tooltip-top:before {
2700 left: 77px;
2701 }
2702
2703 .automatorwp-dashboard .automatorwp-plugin-card .cmb-tooltip-left {
2704 right: 80%;
2705 }
2706
2707 .automatorwp-dashboard .automatorwp-plugin-card .cmb-tooltip-right {
2708 left: 80%;
2709 }
2710
2711 .automatorwp-dashboard .automatorwp-plugin-card .cmb-tooltip-desc p {
2712 margin: 0;
2713 }
2714
2715 .automatorwp-dashboard .plugin-card:nth-child(n+11) .plugin-card-top .thumbnail a:after {
2716 content: " ";
2717 display: block;
2718 position: absolute;
2719 padding-top: 70px;
2720 width: 100%;
2721 left: 0;
2722 margin-top: -57px;
2723 z-index: 999;
2724 background: linear-gradient(0deg, #f5f5f5, transparent);
2725 }
2726
2727 .automatorwp-dashboard .plugin-card:nth-child(n+11) .plugin-card-top .name{
2728 opacity: 0.2;
2729 }
2730
2731 .automatorwp-dashboard .plugin-card {
2732 width: 10%;
2733 clear: none;
2734 }
2735
2736 /* Smartphone */
2737 @media screen and (max-width: 1199px) {
2738 .automatorwp-dashboard .plugin-card {
2739 width: 25%;
2740 }
2741
2742 .automatorwp-dashboard .plugin-card:nth-child(n+9) {
2743 display: none;
2744 }
2745
2746 .automatorwp-dashboard .plugin-card:nth-child(n+5) .plugin-card-top .thumbnail a:after {
2747 content: " ";
2748 display: block;
2749 position: absolute;
2750 padding-top: 70px;
2751 width: 100%;
2752 left: 0;
2753 margin-top: -57px;
2754 z-index: 999;
2755 background: linear-gradient(0deg, #f5f5f5, transparent);
2756 }
2757
2758 .automatorwp-dashboard .plugin-card:nth-child(n+5) .plugin-card-top .name{
2759 opacity: 0.2;
2760 }
2761
2762 .automatorwp-dashboard .automatorwp-dashboard-more-videos {
2763 position: absolute;
2764 bottom: -10px;
2765 left: 44%;
2766 }
2767 }
2768
2769 @media only screen and (min-width: 800px) and (max-width: 1499px) {
2770 .automatorwp-dashboard .postbox-container {
2771 float: left !important;
2772 }
2773
2774 .automatorwp-dashboard .automatorwp-automations {
2775 min-height: 370px;
2776 }
2777
2778 .automatorwp-dashboard #postbox-container-3.postbox-container {
2779 width: 49.5% !important;
2780 }
2781 .automatorwp-dashboard #postbox-container-3.postbox-container:before {
2782 content: "";
2783 display: block;
2784 clear: both;
2785 }
2786 }
2787
2788 /* Plugins */
2789 .automatorwp-dashboard .our-plugins-list li {
2790 display: inline-block;
2791 width: 49%;
2792 margin-bottom: 18px;
2793 }
2794
2795 .automatorwp-dashboard .our-plugins-list img {
2796 vertical-align: middle;
2797 width: 32px;
2798 height: 32px;
2799 }
2800
2801 .automatorwp-dashboard .our-plugins-list span {
2802 vertical-align: middle;
2803 font-size: 18px;
2804 }
2805
2806 /* Team */
2807 .automatorwp-dashboard .contributors-list {
2808 text-align: center;
2809 }
2810
2811 .automatorwp-dashboard .contributors-list img {
2812 border-radius: 50%;
2813 }
2814
2815 .automatorwp-dashboard .contributors-list span {
2816 display: block;
2817 }
2818
2819 .automatorwp-dashboard .contributors-list .cmb-tooltip-top {
2820 bottom: 115%;
2821 width: auto;
2822 white-space: nowrap;
2823 }
2824
2825 /* Social */
2826 .automatorwp-dashboard .automatorwp-dashboard-social-list {
2827 display: flex;
2828 }
2829
2830 .automatorwp-dashboard .automatorwp-dashboard-social-list li:not(:first-child) {
2831 margin-left: 8px;
2832 }
2833
2834 .automatorwp-dashboard .automatorwp-dashboard-social-list .dashicons {
2835 font-size: 20px;
2836 line-height: 36px;
2837 height: 36px;
2838 width: 36px;
2839 color: #fff !important;
2840 border-radius: 100%;
2841 }
2842
2843 .automatorwp-dashboard .automatorwp-dashboard-social-list .cmb-tooltip-top {
2844 bottom: 130%;
2845 width: auto;
2846 white-space: nowrap;
2847 }
2848
2849 .automatorwp-dashboard .dashicons-youtube {
2850 background: #e90000 !important;
2851 }
2852
2853 .automatorwp-dashboard .dashicons-facebook-alt,
2854 .automatorwp-dashboard .dashicons-groups {
2855 background: #4766a9 !important;
2856 }
2857
2858 .automatorwp-dashboard .dashicons-twitter {
2859 background: #139ae7 !important;
2860 }
2861
2862 .automatorwp-dashboard .dashicons-linkedin,
2863 .automatorwp-dashboard #automatorwp-dashboard-social .dashicons-wordpress {
2864 background: #0074b3 !important;
2865 }
2866
2867 .automatorwp-dashboard .dashicons-email-alt {
2868 background: #444 !important;
2869 }
2870
2871 .automatorwp-dashboard-blocks-list li span {
2872 float: right;
2873 }
2874
2875 @media screen and (min-width: 1200px) {
2876
2877 .automatorwp-dashboard .automatorwp-dashboard-columns {
2878 display: grid;
2879 grid-gap: 2rem;
2880 grid-template-columns: 1fr 1fr 1fr;
2881 }
2882
2883 .automatorwp-dashboard .contributors-list {
2884 display: grid;
2885 grid-template-columns: 1fr 1fr 1fr;
2886 }
2887 }
2888
2889 /* Fix WP 7.0 */
2890 @media only screen and (min-width: 1500px) and (max-width: 1800px) {
2891 .automatorwp-dashboard #dashboard-widgets .postbox-container {
2892 width: 25% !important;
2893 }
2894
2895 .automatorwp-dashboard #dashboard-widgets #postbox-container-3,
2896 .automatorwp-dashboard #dashboard-widgets #postbox-container-4 {
2897 float: left !important;
2898 }
2899 }
2900
2901 /* -------------------------------------------
2902 Add-ons
2903 ------------------------------------------- */
2904
2905 .automatorwp_page_automatorwp_add_ons .wp-filter {
2906 margin-bottom: 0;
2907 }
2908
2909 .automatorwp_page_automatorwp_add_ons .wp-filter a:hover,
2910 .automatorwp_page_automatorwp_add_ons .wp-filter a:focus {
2911 box-shadow: none;
2912 }
2913
2914 .automatorwp_page_automatorwp_add_ons .wp-filter a .dashicons {
2915 vertical-align: bottom;
2916 }
2917
2918 .automatorwp-add-ons {
2919 display: -webkit-box;
2920 display: -webkit-flex;
2921 display: -ms-flexbox;
2922 display: flex;
2923
2924 -webkit-flex-wrap: wrap;
2925 -ms-flex-wrap: wrap;
2926 flex-wrap: wrap;
2927
2928 width: 100%;
2929 }
2930
2931 .automatorwp-plugin-card {
2932 display: -webkit-box;
2933 display: -webkit-flex;
2934 display: -ms-flexbox;
2935 display: flex;
2936
2937 -webkit-flex-wrap: wrap;
2938 -ms-flex-wrap: wrap;
2939 flex-wrap: wrap;
2940
2941 width: 100%;
2942
2943 margin-left: 0;
2944 margin-right: 0;
2945
2946 border: none;
2947 background: transparent;
2948 }
2949
2950 .automatorwp-plugin-card .plugin-card-top {
2951 width: 100%;
2952 min-height: auto;
2953 padding-top: 0;
2954 }
2955
2956 .automatorwp-plugin-card .plugin-card-bottom {
2957 width: 100%;
2958 align-self: flex-end;
2959 border: none;
2960 background: transparent;
2961 padding: 0;
2962 }
2963
2964 .automatorwp-plugin-card .name, .automatorwp-plugin-card .desc
2965 .automatorwp-plugin-card .name, .automatorwp-plugin-card .desc > p {
2966 margin-left: 0;
2967 margin-right: 0;
2968 }
2969
2970 .automatorwp-plugin-card .thumbnail {
2971 width: 64px;
2972 margin: 0 auto 10px;
2973 border-radius: 6px;
2974 box-shadow: 0px 0px 16px rgba(0, 0, 0, 0.1);
2975 background: #fff;
2976 }
2977
2978 .automatorwp-plugin-card .thumbnail a {
2979 display: block;
2980 line-height: 0;
2981 }
2982
2983 .automatorwp-plugin-card .thumbnail a img {
2984 max-width: 100%;
2985 border-radius: 6px;
2986 }
2987
2988 .automatorwp-plugin-card .name h3 {
2989 text-align: center;
2990 margin: 0;
2991 }
2992
2993 .automatorwp-plugin-card .name a {
2994 text-decoration: none;
2995 font-weight: normal;
2996 color: #1d2327;
2997 font-size: 16px;
2998 }
2999
3000 .automatorwp-plugin-card .cmb-tooltip-desc.cmb-tooltip-top {
3001 bottom: 110%;
3002 }
3003
3004 .automatorwp-plugin-card .cmb-tooltip-desc p {
3005 margin: 0;
3006 color: #ccc !important;
3007 }
3008
3009 .automatorwp-plugin-card .thumbnail:hover + .name a,
3010 .automatorwp-plugin-card .name a:hover {
3011 text-decoration: underline;
3012 }
3013
3014 .automatorwp-plugin-card .action-links {
3015 position: relative;
3016 top: 0;
3017 right: 0;
3018 width: 100%;
3019 }
3020
3021 .automatorwp-plugin-card .action-links .plugin-action-buttons {
3022 float: none;
3023 margin: 0;
3024 }
3025
3026 .automatorwp-plugin-card .action-links .plugin-action-buttons li {
3027 margin: 0;
3028 text-align: center;
3029 }
3030
3031 .automatorwp-plugin-card .action-links .plugin-action-buttons li .more-details {
3032 float: left;
3033 }
3034
3035 .is-automatorwp-plugin#plugin-information #plugin-information-content .notice {
3036 display: none;
3037 }
3038
3039 .automatorwp-plugin-card .plugin-card-bottom {
3040 opacity: 0;
3041 }
3042
3043 .automatorwp-plugin-card:hover .plugin-card-bottom {
3044 opacity: 1;
3045 }
3046
3047 .automatorwp-plugin-card .installed,
3048 .automatorwp-plugin-card .active {
3049 margin-right: -30%;
3050 margin-bottom: -10px;
3051 margin-top: -16px;
3052 position: relative;
3053 z-index: 1;
3054 text-align: center;
3055 }
3056
3057 .automatorwp-plugin-card .installed span,
3058 .automatorwp-plugin-card .active span {
3059 display: inline-block;
3060 padding: 4px 6px;
3061 border-radius: 4px;
3062 font-size: 14px;
3063 }
3064
3065 .automatorwp-plugin-card .installed span {
3066 background: #e5e5e5;
3067 border: #e5e5e5;
3068 }
3069
3070 .automatorwp-plugin-card .active span {
3071 background: #46b450;
3072 border: #46b450;
3073 color: #fff;
3074 }
3075
3076 @media screen and (min-width: 1600px) {
3077 .automatorwp-plugin-card {
3078 width: 16%;
3079 }
3080 }
3081
3082 @media screen and (min-width: 1200px) and (max-width: 1600px) {
3083 .automatorwp-plugin-card {
3084 width: 16%;
3085 }
3086 }
3087
3088 .automatorwp-plugin-card {
3089 margin: 0 !important;
3090 padding-bottom: 12px;
3091 overflow: initial;
3092 }
3093
3094 @media screen and (min-width: 1200px) {
3095 .automatorwp-add-ons {
3096 margin-left: -8px;
3097 margin-right: -8px;
3098 }
3099 }
3100
3101 /* -------------------------------------------
3102 Settings
3103 ------------------------------------------- */
3104
3105 .automatorwp-page.cmb2-options-page {
3106 max-width: 100%;
3107 }
3108
3109 .automatorwp-page.cmb2-options-page .cmb2-metabox > .cmb-row {
3110 border: none;
3111 box-shadow: none;
3112 }
3113
3114 .automatorwp-page .postbox .hndle {
3115 justify-content: flex-start;
3116 font-size: 16px;
3117 }
3118
3119 .automatorwp-page .postbox .hndle .dashicons {
3120 height: 18px;
3121 line-height: 18px;
3122 margin-right: 5px;
3123 }
3124
3125 .automatorwp-page .postbox .handle-actions {
3126 display: none;
3127 }
3128
3129 .automatorwp_settings input[name="submit-cmb"] {
3130 float: left;
3131 margin-right: 12px;
3132 }
3133
3134 .automatorwp_settings.cmb2-options-page #poststuff h2.nav-tab-wrapper {
3135 margin-bottom: 20px !important;
3136 }
3137
3138 .automatorwp-page .nav-tab .dashicons {
3139 vertical-align: text-bottom;
3140 margin-right: 2px;
3141 }
3142
3143 .automatorwp-page > h2 {
3144 margin-bottom: 0 !important;
3145 }
3146
3147 /* -------------------------------------------
3148 Licensing Settings
3149 ------------------------------------------- */
3150
3151 .automatorwp_licenses .meta-box-sortables {
3152 display: -webkit-box;
3153 display: -webkit-flex;
3154 display: -ms-flexbox;
3155 display: flex;
3156 -webkit-flex-wrap: wrap;
3157 -ms-flex-wrap: wrap;
3158 flex-wrap: wrap;
3159 margin-left: -8px;
3160 margin-right: -8px;
3161 }
3162
3163 .automatorwp_licenses .handlediv,
3164 .automatorwp_page_automatorwp_licenses #screen-options-link-wrap {
3165 display: none !important;
3166 }
3167
3168 .automatorwp_licenses .postbox.closed .inside {
3169 display: block !important;
3170 }
3171
3172 .automatorwp_licenses .postbox {
3173 width: 100%;
3174 margin: 0 8px 16px;
3175 }
3176
3177 .automatorwp_licenses .automatorwp-license-thumbnail {
3178 margin: -6px -12px 0;
3179 }
3180
3181 .automatorwp_licenses .automatorwp-license-thumbnail img {
3182 width: 100%;
3183 }
3184
3185 .automatorwp_licenses .cmb-row {
3186 border: none;
3187 padding-bottom: 0;
3188 }
3189
3190 .automatorwp_licenses .cmb2-metabox > .cmb-row:not(:first-of-type) {
3191 border: none !important;
3192 }
3193
3194 .automatorwp_licenses .cmb-th,
3195 .automatorwp_licenses .cmb-td {
3196 width: 100%;
3197 padding: 6px 0 !important;
3198 margin-left: 0 !important;
3199 margin-right: 0 !important;
3200 }
3201
3202 .automatorwp_licenses .cmb-td input {
3203 width: 100%;
3204 }
3205
3206 .automatorwp_licenses .license-expiration-notice,
3207 .automatorwp_licenses .renew-license-notice {
3208 display: inline;
3209 }
3210
3211 .automatorwp_licenses .license-error {
3212 color: #a00;
3213 }
3214
3215 .automatorwp_licenses .renew-license-notice:before {
3216 content: ' '; /* Add a space between expiration and renew notices */
3217 }
3218
3219 @media screen and (min-width: 1600px) {
3220
3221 .automatorwp_licenses .postbox {
3222 width: 23%;
3223 }
3224
3225 }
3226
3227 @media screen and (min-width: 1200px) and (max-width: 1600px) {
3228 .automatorwp_licenses .postbox {
3229 width: 23%;
3230 }
3231 }
3232
3233 /* -------------------------------------------
3234 Review Notice
3235 ------------------------------------------- */
3236 .automatorwp-review-notice {
3237 position: relative;
3238 background: #222;
3239 color: #fff;
3240 border: none;
3241 }
3242
3243 .automatorwp-review-notice a:not(.button) {
3244 color: #fff !important;
3245 }
3246
3247 .automatorwp-review-notice a.button:not(.button-primary) {
3248 background-color: #fff !important;
3249 }
3250
3251 .automatorwp-review-notice > p {
3252 color: #fff !important;
3253 }
3254
3255 .automatorwp-review-notice p span {
3256 opacity: 0.7;
3257 }
3258
3259 .automatorwp-review-notice .button-primary {
3260 background: #febd17;
3261 border-color: #fdc63a #926d10 #926d10;
3262 box-shadow: 0 1px 0 #926d10;
3263 text-decoration: none;
3264 text-shadow: none;
3265 color: #444;
3266 font-weight: 500;
3267 }
3268
3269 .automatorwp-review-notice .button-primary.hover,
3270 .automatorwp-review-notice .button-primary:hover,
3271 .automatorwp-review-notice .button-primary.focus,
3272 .automatorwp-review-notice .button-primary:focus {
3273 background: #f3b415;
3274 border-color: #fdc63a #926d10 #926d10;
3275 color: #444;
3276 }
3277
3278 .automatorwp-review-notice .button-primary.focus,
3279 .automatorwp-review-notice .button-primary:focus {
3280 box-shadow: 0 1px 0 #febd17,
3281 0 0 2px 1px #fdc63a;
3282 }
3283
3284 .automatorwp-review-notice .button-primary.active,
3285 .automatorwp-review-notice .button-primary.active:hover,
3286 .automatorwp-review-notice .button-primary.active:focus,
3287 .automatorwp-review-notice .button-primary:active {
3288 background: #f3b415;
3289 border-color: #926d10;
3290 box-shadow: inset 0 2px 0 #926d10;
3291 vertical-align: top;
3292 }
3293
3294 .automatorwp-review-notice .automatorwp-hide-review-notice.button {
3295 color: #353849;
3296 border-color: #353849;
3297 }
3298
3299 .automatorwp-review-notice .automatorwp-hide-review-notice.button:hover {
3300 color: #3b4eb7;
3301 border-color: #3b4eb7;
3302 }
3303
3304 .automatorwp-review-notice ul li {
3305 display: inline-block;
3306 margin-right: 10px;
3307 }
3308
3309 .automatorwp-review-notice .automatorwp-hide-review-notice:not(.button) {
3310 color: #ccc;
3311 }
3312
3313 .automatorwp-review-notice .automatorwp-hide-review-notice:not(.button):hover {
3314 color: #fff;
3315 }
3316
3317 .automatorwp-review-notice .automatorwp-logo {
3318 background-image: url('../img/automatorwp-logo.svg');
3319 background-size: 100%;
3320 background-repeat: no-repeat;
3321 width: 150px;
3322 height: 150px;
3323 margin: 15px auto 0 auto;
3324 }
3325
3326 /* Desktop */
3327 @media screen and (min-width: 768px) {
3328 .automatorwp-review-notice .automatorwp-logo {
3329 float: left;
3330 margin: 20px 20px 20px 5px;
3331 }
3332 }
3333
3334 /* -------------------------------------------
3335 Import Automation
3336 ------------------------------------------- */
3337 .automatorwp-import-automation-text {
3338 font-size: 32px;
3339 color: #aaa;
3340 text-align: center;
3341 margin-top: 5%;
3342 margin-bottom: 3%;
3343 }
3344
3345 .automatorwp-import-automation-text:not(.automatorwp-import-automation-success):not(.automatorwp-import-automation-error) {
3346 -webkit-animation: automatorwp_import_text_animation 1s infinite;
3347 animation: automatorwp_import_text_animation 1s infinite;
3348 }
3349
3350 .automatorwp-import-automation-text.automatorwp-import-automation-success {
3351 color: #269630;
3352 }
3353
3354 .automatorwp-import-automation-text.automatorwp-import-automation-error {
3355 color: #dc3232;
3356 }
3357
3358 .automatorwp-import-automation-icon {
3359 width: 200px;
3360 height: 200px;
3361 text-align: center;
3362 margin: 0 auto;
3363 }
3364
3365 .automatorwp-import-automation-icon img {
3366 width: 100%;
3367 }
3368
3369 .automatorwp-import-automation-loader {
3370 margin-top: -130px;
3371 }
3372
3373 .automatorwp-import-automation-loader-background {
3374 width: 100px;
3375 height: 70px;
3376 background: #353849;
3377 margin: 0 auto;
3378 position: relative;
3379 border-radius: 45px;
3380 }
3381
3382 .automatorwp-import-automation-loader-icon,
3383 .automatorwp-import-automation-loader-icon:before,
3384 .automatorwp-import-automation-loader-icon:after {
3385 border-radius: 50%;
3386 width: 14px;
3387 height: 14px;
3388 -webkit-animation-fill-mode: both;
3389 animation-fill-mode: both;
3390 -webkit-animation: automatorwp_import_logo_animation 1.8s infinite ease-in-out;
3391 animation: automatorwp_import_logo_animation 1.8s infinite ease-in-out;
3392 }
3393
3394 .automatorwp-import-automation-loader-icon {
3395 color: #4ceedf;
3396 font-size: 10px;
3397 margin: 0 auto;
3398 margin-top: -66px;
3399 position: relative;
3400 text-indent: -9999em;
3401 -webkit-transform: translateZ(0);
3402 -ms-transform: translateZ(0);
3403 transform: translateZ(0);
3404 -webkit-animation-delay: -0.16s;
3405 animation-delay: -0.16s;
3406 }
3407
3408 .automatorwp-import-automation-loader-icon:before,
3409 .automatorwp-import-automation-loader-icon:after {
3410 content: '';
3411 position: absolute;
3412 top: 0;
3413 }
3414
3415 .automatorwp-import-automation-loader-icon:before {
3416 left: -26px;
3417 -webkit-animation-delay: -0.32s;
3418 animation-delay: -0.32s;
3419 }
3420
3421 .automatorwp-import-automation-loader-icon:after {
3422 left: 26px;
3423 }
3424
3425 @-webkit-keyframes automatorwp_import_text_animation {
3426 0% { opacity:1; }
3427 50% { opacity:0.6; }
3428 100% { opacity:1; }
3429 }
3430 @keyframes automatorwp_import_text_animation {
3431 0% { opacity:1; }
3432 50% { opacity:0.6; }
3433 100% { opacity:1; }
3434 }
3435
3436 @-webkit-keyframes automatorwp_import_logo_animation {
3437 0%,
3438 80%,
3439 100% { box-shadow: 0 2.5em 0 -1.3em; }
3440 40% { box-shadow: 0 2.5em 0 0; }
3441 }
3442 @keyframes automatorwp_import_logo_animation {
3443 0%,
3444 80%,
3445 100% { box-shadow: 0 2.5em 0 -1.3em; }
3446 40% { box-shadow: 0 2.5em 0 0; }
3447 }
3448
3449 /* -------------------------------------------
3450 Admin Menu
3451 ------------------------------------------- */
3452
3453 .automatorwp-admin-menu-badge {
3454 display: inline-block;
3455 float: right;
3456 vertical-align: top;
3457 margin: 1px -11px -1px 2px;
3458 padding: 0 5px;
3459 height: 18px;
3460 border-radius: 9px;
3461 background-color: #d63638;
3462 color: #fff;
3463 font-size: 11px;
3464 line-height: 1.6;
3465 }
3466