PluginProbe
Booking Calendar / 11.8.2
Booking Calendar v11.8.2
11.8.2 11.8.1 11.8 11.7 11.6.1 11.6 11.5 11.4.3 11.4.2 11.4.1 11.4 11.3 11.2.1 11.2 11.1 11.0 10.15.7 10.15.6 10.1.3 10.10 10.10.1 10.10.2 10.11 10.11.2 10.11.3 All 202 releases
← All changes | css/modal.css +285 -34 10.1.311.8.2 View file →
@@ -48,20 +48,11 @@
48 48 .wpbc_modal__import_google_calendar__section .booking_gcal_events_until_offset,
49 49 .wpbc_modal__import_google_calendar__section #booking_gcal_events_from,
50 50 .wpbc_modal__import_google_calendar__section .booking_gcal_events_from_offset {
51 51 float:left;
52 - margin:5px 0 0 0 !important;
53 52 }
54 -.wpbc_modal__import_google_calendar__section .booking_gcal_events_from_offset label,
55 -.wpbc_modal__import_google_calendar__section .booking_gcal_events_until_offset label {
56 - margin: 0 10px;
57 - float:left;
58 - line-height: 29px;
59 -}
60 -.wpbc_modal__import_google_calendar__section input[type=text],
61 -.wpbc_modal__import_google_calendar__section select {
62 - height:28px;
63 -}
53 +
54 +
64 55 .wpbc_modal__import_google_calendar__section th {
65 56 vertical-align: middle;
66 57 }
67 58 .wpbc_modal__import_google_calendar__section th,
@@ -67,24 +58,33 @@
67 58 .wpbc_modal__import_google_calendar__section th,
68 59 .wpbc_modal__import_google_calendar__section td {
69 60 border:none;
70 61 }
71 -.wpbc_modal__import_google_calendar__section label {
72 - line-height: 28px;
73 - margin: 0;
74 - vertical-align: middle;
75 -}
62 +
76 63 .wpbc_modal__import_google_calendar__section #booking_gcal_events_from_offset_type,
77 64 .wpbc_modal__import_google_calendar__section #booking_gcal_events_until_offset_type {
78 65 vertical-align: initial;
79 66 }
80 67
81 -
82 -@media (max-width: 782px) {
83 - .wpdevelop .modal-dialog{
84 - margin: 60px 10px 10px;
85 - }
86 -
68 +.wpdevelop .modal-dialog .modal-content {
69 + overflow: auto;
70 + border-radius: 3px;
71 +}
72 +.wpbc_popup_modal .modal-dialog.modal-lg {
73 + width: 98%;
74 + width: calc(100vw - 20px);
75 + margin: 10px auto;
76 +}
77 +@media (max-width: 782px) {
78 + .wpdevelop .modal-dialog {
79 + margin: 15px;
80 + }
81 + .wpdevelop .modal-header {
82 + border-radius: 10px 10px 0 0;
83 + }
84 + .wpdevelop .modal {
85 + overflow: auto;
86 + }
87 87 /* Import Google Events Dialog*/
88 88 .wpbc_modal__import_google_calendar__section .modal-dialog.modal-lg {
89 89 width: auto;
90 90 }
@@ -189,9 +189,9 @@
189 189 left: 0;
190 190 position: fixed;
191 191 right: 0;
192 192 top: 0;
193 - z-index: 1040;
193 + z-index: 111040;
194 194 }
195 195 .wp-admin .modal-backdrop.fade {
196 196 opacity: 0;
197 197 }
@@ -239,9 +239,9 @@
239 239 justify-content: flex-start;
240 240 align-items: center;
241 241 }
242 242 .wpbc_popup_modal td fieldset .wpbc_ui__toggle {
243 - flex:0;
243 + flex:0 1 auto;
244 244 }
245 245 .wpbc_popup_modal td fieldset span.description {
246 246 flex: 1;
247 247 margin: 3px 0 0.5em;
@@ -260,8 +260,42 @@
260 260 align-items: flex-start;
261 261 margin-top: 4px;
262 262 }
263 263 /* ------------------------------------------------------------------ */
264 +.modal-title {
265 + flex: 1;
266 + text-align: left;
267 +}
268 +.wpdevelop .modal-footer,
269 +.wpdevelop .modal-header {
270 + padding: 15px;
271 + text-align: right;
272 + border-top: 1px solid #e5e5e5;
273 + display: flex;
274 + flex-flow: row wrap;
275 + justify-content: flex-end;
276 + align-items: center;
277 + gap: 5px;
278 +}
279 +.wpdevelop .modal-header {
280 + justify-content: flex-start;
281 + font-size: 14px;
282 +}
283 +.wpdevelop .modal-header .close {
284 + order: 100;
285 + margin-left: auto;
286 +}
287 +.wpbc_modal__add_booking__header_main .modal-title {
288 + flex: 1 1 auto;
289 + font-weight: 550;
290 + text-align: left;
291 +}
292 +.wpbc_modal__add_booking__header_main {
293 + flex: 1 1 auto;
294 +}
295 +.modal-footer .wpbc_ui__toggle {
296 + align-items: center;
297 +}
264 298 .wpbc_popup_modal .modal-footer a.button,
265 299 .wpbc_popup_modal .modal-footer a.button:hover,
266 300 .wpbc_popup_modal .modal-footer a.button:active,
267 301 .wpbc_popup_modal .modal-footer a.button:focus {
@@ -283,8 +317,9 @@
283 317 .wpbc_popup_modal .bookingselect_advanced_section,
284 318 .wpbc_popup_modal .bookingtimeline_advanced_section0{
285 319 display:none;
286 320 }
321 +.wpbc_field_help_panel_background.wpbc_field_help_panel_field .put-in,
287 322 .wpbc_popup_modal .put-in {
288 323 cursor: pointer;
289 324 font-weight: 600;
290 325 background: none repeat scroll 0 0 #E9E9E9;
@@ -362,9 +397,9 @@
362 397 margin: 5px auto;
363 398 }
364 399 @media (max-width: 782px) {
365 400 .wpbc_popup_modal .modal-dialog.modal-lg {
366 - width: 97%;
401 + width: 98%;
367 402 }
368 403 }
369 404 /* Show over top toolbar - dashboard*/
370 405 .wpbc_popup_modal {
@@ -373,13 +408,155 @@
373 408 /* Header border radius*/
374 409 .wpbc_popup_modal .modal-dialog.modal-lg .modal-header {
375 410 border-radius: 6px 6px 0 0;
376 411 }
412 +
413 +/* Add/Edit Booking modal: keep header/footer visible while the booking form scrolls. */
414 +.wpbc_modal__add_booking__section .modal-dialog.modal-lg {
415 + height: calc(100vh - 20px);
416 +}
417 +.wpbc_modal__add_booking__section .modal-content {
418 + display: flex;
419 + flex-direction: column;
420 + max-height: 100%;
421 + overflow: hidden;
422 +}
423 +.wpbc_modal__add_booking__section .modal-header,
424 +.wpbc_modal__add_booking__section .modal-footer {
425 + flex: 0 0 auto;
426 +}
427 +.wpbc_modal__add_booking__section .modal-body {
428 + flex: 1 1 auto;
429 + min-height: 0;
430 + overflow-y: auto;
431 +}
432 +.wpbc_modal__add_booking__footer_time_override {
433 + flex: 1 1 auto;
434 + display: flex;
435 + justify-content: flex-start;
436 + min-width: 280px;
437 +}
438 +.wpbc_modal__add_booking__footer_time_override:empty {
439 + display: none;
440 + flex: 0 0 auto;
441 + min-width: 0;
442 +}
443 +.wpbc_modal__add_booking__header_main {
444 + display: flex;
445 + flex-wrap: wrap;
446 + gap: 10px 18px;
447 + align-items: center;
448 + margin-right: 32px;
449 +}
450 +.wpbc_modal__add_booking__header_main .modal-title {
451 + flex: 0 0 auto;
452 + margin: 0;
453 +}
454 +.wpbc_modal__add_booking__controls {
455 + display: inline-flex;
456 + flex: 1 1 auto;
457 + flex-wrap: wrap;
458 + gap: 8px 12px;
459 + align-items: center;
460 + min-width: 240px;
461 +}
462 +.wpbc_modal__add_booking__control,
463 +label.wpbc_modal__add_booking__control {
464 + display: inline-flex;
465 + align-items: center;
466 + gap: 6px;
467 + margin: 0;
468 + white-space: nowrap;
469 +}
470 +.wpbc_modal__add_booking__control select {
471 + width: auto;
472 + min-width: 160px;
473 + max-width: 260px;
474 +}
475 +.wpbc_modal__add_booking__edit_form_link,
476 +.wpbc_modal__add_booking__edit_form_link:hover,
477 +.wpbc_modal__add_booking__edit_form_link:focus {
478 + display: inline-flex;
479 + align-items: center;
480 + gap: 4px;
481 + text-decoration: none;
482 + white-space: nowrap;
483 + box-shadow: none;
484 +}
485 +.wpbc_add_booking_modal__time_override {
486 + display: flex;
487 + flex: 1 1 auto;
488 + flex-wrap: wrap;
489 + align-items: center;
490 + justify-content: flex-start;
491 + gap: 8px 12px;
492 + margin: 0;
493 + padding: 7px 10px;
494 + border: 1px solid #dcdcde;
495 + background: #f6f7f7;
496 + border-left: 4px solid var(--wp-admin-theme-color, #2271b1);
497 + border-radius: 4px;
498 + text-align: left;
499 +}
500 +.wpbc_add_booking_modal__time_override_toggle {
501 + display: inline-flex;
502 + align-items: center;
503 + margin: 0;
504 +}
505 +.wpbc_add_booking_modal__time_override_fields {
506 + display: flex;
507 + flex-wrap: wrap;
508 + gap: 6px;
509 + align-items: center;
510 +}
511 +.wpbc_add_booking_modal__time_override_fields label {
512 + display: flex;
513 + flex-direction: row;
514 + align-items: center;
515 + gap: 4px;
516 + margin: 0;
517 + color: #50575e;
518 + font-size: 12px;
519 + font-weight: 600;
520 +}
521 +.wpbc_add_booking_modal__time_override_fields input[type="text"] {
522 + width: 72px;
523 + min-height: 30px;
524 + text-align: center;
525 +}
526 +.wpbc_add_booking_modal__time_override_note {
527 + flex: 1 1 180px;
528 + margin: 0;
529 + color: #646970;
530 + font-size: 12px;
531 +}
532 +.wpbc_add_booking_modal__time_override:not(.is-enabled) {
533 + border-left-color: #8c8f94;
534 + opacity: 0.82;
535 +}
536 +.wpbc_add_booking_modal__time_field_overridden {
537 + opacity: 0.65;
538 +}
539 +@media (max-width: 782px) {
540 + .wpbc_modal__add_booking__section .modal-dialog.modal-lg {
541 + height: calc(100vh - 30px);
542 + }
543 + .wpbc_modal__add_booking__header_main {
544 + align-items: flex-start;
545 + }
546 + .wpbc_modal__add_booking__controls,
547 + .wpbc_modal__add_booking__control,
548 + .wpbc_modal__add_booking__control select,
549 + .wpbc_modal__add_booking__edit_form_link {
550 + width: 100%;
551 + }
552 +}
377 553 /* Shortcode Text field */
554 +.wpbc_field_help_panel_background.wpbc_field_help_panel_field .put-in,
378 555 .wpbc_popup_modal .put-in {
379 556 cursor: text;
380 557 font-weight: 600;
381 - /*background: #1E7BC7;*/
558 + /*background: var( --wp-admin-theme-color, #1E7BC7 );*/
382 559 /*background: #4A8CC2;*/
383 560 /*border: 1px solid #3C86A7;*/
384 561 background: #75A249;
385 562 border: 1px solid #75A249;
@@ -395,10 +572,9 @@
395 572 }
396 573 /* Border color of active horizontal tab */
397 574 .modal-body .wpbc_settings_flex_container .wpdvlp-top-tabs .nav-tab-active,
398 575 .modal-body .wpbc_settings_flex_container .wpdvlp-top-tabs a.nav-tab-active:hover {
399 - border-bottom-color: #9c9c9c;
400 - border-bottom-color: #cb8c8c;
576 + border-bottom-color: var(--wpbc_admin-active-tab-color, #707980);
401 577 }
402 578 /* ------------------------------------------------------------------------------------------------------------------ */
403 579 /* Vertical Navigation Panel */
404 580 /* ------------------------------------------------------------------------------------------------------------------ */
@@ -450,8 +626,85 @@
450 626 .wpbc_sc_container__shortcode_section__general ,
451 627 .wpbc_sc_container__shortcode_section__search_filters{
452 628 display:block;
453 629 }
630 +
631 +/* Modern workflow shortcode descriptions belong below their controls. */
632 +#wpbc_sc_container__shortcode_booking_appointment .form-table td fieldset > span.description,
633 +#wpbc_sc_container__shortcode_booking_resource_selector .form-table td fieldset > span.description {
634 + flex: 100%;
635 + padding: 5px 0;
636 + line-height: 1.74;
637 + font-size: 13px;
638 +}
639 +
640 +/* Keep the shortcode popup frame fixed and scroll only its active configuration section. */
641 +@media (min-width: 783px) {
642 + #wpbc_tiny_modal.wpbc_shortcode_config__scroll_mode {
643 + overflow-y: hidden !important;
644 + }
645 + #wpbc_tiny_modal.wpbc_shortcode_config__scroll_mode .modal-dialog.modal-lg {
646 + height: calc(100vh - 10px);
647 + }
648 + #wpbc_tiny_modal.wpbc_shortcode_config__scroll_mode .modal-content {
649 + display: flex;
650 + flex-direction: column;
651 + height: 100%;
652 + overflow: hidden;
653 + }
654 + #wpbc_tiny_modal.wpbc_shortcode_config__scroll_mode .modal-header,
655 + #wpbc_tiny_modal.wpbc_shortcode_config__scroll_mode .modal-footer {
656 + flex: 0 0 auto;
657 + }
658 + #wpbc_tiny_modal.wpbc_shortcode_config__scroll_mode .modal-body {
659 + flex: 1 1 auto;
660 + min-height: 0;
661 + overflow: hidden;
662 + }
663 + #wpbc_tiny_modal.wpbc_shortcode_config__scroll_mode .modal-body > .wpbc_settings_flex_container {
664 + height: 100%;
665 + min-height: 0;
666 + flex-wrap: nowrap;
667 + align-items: stretch;
668 + overflow: hidden;
669 + }
670 + #wpbc_tiny_modal.wpbc_shortcode_config__scroll_mode .wpbc_settings_flex_container_left {
671 + min-height: 0;
672 + max-height: 100%;
673 + }
674 + #wpbc_tiny_modal.wpbc_shortcode_config__scroll_mode .wpbc_settings_flex_container_right {
675 + display: flex;
676 + flex-direction: column;
677 + min-width: 0;
678 + min-height: 0;
679 + height: 100%;
680 + max-height: 100%;
681 + overflow: hidden;
682 + }
683 + #wpbc_tiny_modal.wpbc_shortcode_config__scroll_mode .wpbc_sc_container__all_shortcodes {
684 + flex: 1 1 auto;
685 + min-height: 0;
686 + overflow: hidden;
687 + box-sizing: border-box;
688 + }
689 + #wpbc_tiny_modal.wpbc_shortcode_config__scroll_mode .wpbc_sc_container__shortcode_is_active {
690 + display: flex !important;
691 + flex-direction: column;
692 + height: 100%;
693 + min-height: 0;
694 + }
695 + #wpbc_tiny_modal.wpbc_shortcode_config__scroll_mode .wpbc_sc_container__shortcode_is_active > .wpdvlp-tabs-wrapper,
696 + #wpbc_tiny_modal.wpbc_shortcode_config__scroll_mode .wpbc_sc_container__shortcode_is_active > .wpbc_shortcode_config_content_toolbar__next_prior {
697 + flex: 0 0 auto;
698 + }
699 + #wpbc_tiny_modal.wpbc_shortcode_config__scroll_mode .wpbc_sc_container__shortcode_is_active > .wpbc_sc_container__shortcode_section {
700 + flex: 1 1 auto;
701 + min-height: 0;
702 + overflow-y: auto;
703 + overscroll-behavior: contain;
704 + padding-right: 8px;
705 + }
706 +}
454 707 /* Hide all sections by default*/
455 708 .wpbc_sc_container__shortcode_subsection{
456 709 display:none;
457 710 }
@@ -550,9 +803,9 @@
550 803 .wp-core-ui .wpbc_page .button.wpbc_ui_button_danger:hover:not(.inactive),
551 804 .wp-core-ui .wpbc_page .button.wpbc_ui_button_danger.focus:not(.inactive),
552 805 .wp-core-ui .wpbc_page .button.wpbc_ui_button_danger:focus:not(.inactive) {
553 806 background: #e6716f;
554 - border-color: #d58582;
807 + /*border-color: #d58582;*/
555 808 color: #fdfdfd;
556 809 text-shadow: none;
557 810 }
558 811 /* :focus ---- */
@@ -557,9 +810,9 @@
557 810 }
558 811 /* :focus ---- */
559 812 .wp-core-ui .wpbc_page .button.wpbc_ui_button_danger.focus:not(.inactive),
560 813 .wp-core-ui .wpbc_page .button.wpbc_ui_button_danger:focus:not(.inactive) {
561 - box-shadow:0 0 0 0px #fff, 0 0 2px 1px #a4d7ff;
814 + /*box-shadow:0 0 0 0px #fff, 0 0 2px 1px #a4d7ff;*/
562 815 }
563 816 /* :active ---- */
564 817 .wp-core-ui .wpbc_page .button.wpbc_ui_button_danger.active:not(.inactive),
565 818 .wp-core-ui .wpbc_page .button.wpbc_ui_button_danger.active:hover:not(.inactive),
@@ -566,9 +819,9 @@
566 819 .wp-core-ui .wpbc_page .button.wpbc_ui_button_danger.active:focus:not(.inactive),
567 820 .wp-core-ui .wpbc_page .button.wpbc_ui_button_danger:active:not(.inactive) {
568 821 background: #ba4c48;
569 822 border-color: #c05d5a;
570 - box-shadow: inset 0 1px 7px -3px rgba(0, 0, 0, .1);
823 + /*box-shadow: inset 0 1px 7px -3px rgba(0, 0, 0, .1);*/
571 824 color: #f3f2f2;
572 825 }
573 826 /* :disabled ---- */
574 827 .wp-core-ui .wpbc_page .button.wpbc_ui_button_danger[disabled],
@@ -582,9 +835,8 @@
582 835 text-shadow: none !important;
583 836 cursor: default;
584 837 }
585 838
586 -
587 839 /* ------------------------------------------------------------------------------------------------------------------ */
588 840 /* Weekdays conditions toolbar */
589 841 /* ------------------------------------------------------------------------------------------------------------------ */
590 842 .wpbc_shortcode_config_fields__dates_conditions_toolbar .wpdvlp-sub-tabs{
@@ -631,9 +883,8 @@
631 883 .form-table td fieldset .wpbc_shortcode_config__rules__help_section li {
632 884 line-height: 2.5;
633 885 }
634 886
635 -
636 887 /* ------------------------------------------------------------------------------------------------------------------ */
637 888 /* Select Day - Weekday */
638 889 /* ------------------------------------------------------------------------------------------------------------------ */
639 890 .wpbc_shortcode_config__rules__params_section.wpbc_select_day_weekday{
@@ -668,5 +919,5 @@
668 919 /* Weekdays: checkboxes only */
669 920 .wpbc_shortcode_config__rules__params_section.wpbc_start_day_season .wpbc_ajx_toolbar.wpbc_buttons_row .ui_container.ui_container_weekdays .ui_group.ui_group_weekdays_checkboxes{
670 921 /*flex-flow: column wrap;*/
671 922 max-width: 320px;
672 - }
923 + }