← All changes
|
includes/__css/admin/page-bookings/bo_listing.css
+161
-5
10.15.6
→
11.9
View file →
| @@ -43,9 +43,15 @@ | ||
| 43 | 43 | /* == S t r u c u t u r e == */ |
| 44 | 44 | /* ================================================================================================================== */ |
| 45 | 45 | .wpbc__wrap__booking_listing { |
| 46 | 46 | margin: 15px 0; |
| 47 | + min-height: 550px; | |
| 47 | 48 | } |
| 49 | +/* Exception for the Booking Listing to show correctly the Bulk Actions - Long Dropdown menu*/ | |
| 50 | +.wpbc_admin.wpbc_admin_page__tab__vm_booking_listing .wpbc_settings_page_content { | |
| 51 | + min-width: 0; | |
| 52 | + overflow: visible; | |
| 53 | +} | |
| 48 | 54 | .wpbc__list__table, |
| 49 | 55 | .wpbc__list__table .wpbc__list__head, |
| 50 | 56 | .wpbc__list__table .wpbc__list__foot, |
| 51 | 57 | .wpbc__list__table .wpbc__list__body { |
| @@ -236,9 +242,9 @@ | ||
| 236 | 242 | background: var(--wpbc_ui_listing__back_color); |
| 237 | 243 | border: 0; |
| 238 | 244 | } |
| 239 | 245 | /* R O W */ |
| 240 | - .wpbc_listing_usual_row { | |
| 246 | + div .wpbc_listing_usual_row { | |
| 241 | 247 | flex: 1 1 100%; |
| 242 | 248 | |
| 243 | 249 | display: flex; |
| 244 | 250 | flex-flow:row nowrap; |
| @@ -245,8 +251,9 @@ | ||
| 245 | 251 | justify-content: flex-start; |
| 246 | 252 | align-items: flex-start; |
| 247 | 253 | border-bottom: 1px solid var(--wpbc_ui_listing__row_border_color); |
| 248 | 254 | border-left: 4px solid transparent; |
| 255 | + margin:0; | |
| 249 | 256 | } |
| 250 | 257 | .wpbc_listing_usual_row:last-child { |
| 251 | 258 | border-bottom: 0; |
| 252 | 259 | } |
| @@ -558,12 +565,16 @@ | ||
| 558 | 565 | .wpbc_listing_col.wpbc_col_action { |
| 559 | 566 | justify-content: flex-end; |
| 560 | 567 | } |
| 561 | 568 | /* -- Notes and Sys Information -- */ |
| 569 | + .wpbc_row_wrap.max_height_a .wpbc_a_row__appointment, | |
| 562 | 570 | .wpbc_row_wrap.max_height_a .wpbc_a_row__notes, |
| 563 | 571 | .wpbc_row_wrap.max_height_a .wpbc_a_row__system { |
| 564 | 572 | display:none; |
| 565 | 573 | } |
| 574 | + .wpbc_a_row__appointment .wpbc_col_appointment_details { | |
| 575 | + margin: 5px 10px; | |
| 576 | + } | |
| 566 | 577 | .wpbc_a_row__system .wpbc_col_sys_info{ |
| 567 | 578 | margin-left:10px; |
| 568 | 579 | } |
| 569 | 580 | .wpbc_a_row__notes { |
| @@ -643,10 +654,10 @@ | ||
| 643 | 654 | flex: 0 0 70px; |
| 644 | 655 | } |
| 645 | 656 | /* -- Stripe - Row --------------------------------------------------------------------------------------------- */ |
| 646 | 657 | .wpbc_ui_el__listing_row:nth-of-type(2n+1) { |
| 647 | - background-color: var(--wpbc_ui_listing__back_alt_color); | |
| 648 | - border-left-color: var(--wpbc_ui_listing__back_alt_color); | |
| 658 | + /*background-color: var(--wpbc_ui_listing__back_alt_color);*/ | |
| 659 | + /*border-left-color: var(--wpbc_ui_listing__back_alt_color);*/ | |
| 649 | 660 | } |
| 650 | 661 | .wpbc_ui_el__listing_row.wpbc_row.row_selected_color { |
| 651 | 662 | border-left-color: var(--wpbc_ui_listing__selected_row_color); |
| 652 | 663 | } |
| @@ -781,9 +792,9 @@ | ||
| 781 | 792 | } |
| 782 | 793 | .wpbc_listing_col.wpbc_col_action a.ul_dropdown_menu_toggle, |
| 783 | 794 | .wpbc_listing_col.wpbc_col_action a.ul_dropdown_menu_toggle:hover, |
| 784 | 795 | .wpbc_listing_col.wpbc_col_action a.ul_dropdown_menu_toggle:focus{ |
| 785 | - background: #00000012; | |
| 796 | + background: rgba(0, 0, 0, 0.03); | |
| 786 | 797 | border-radius: 50%; |
| 787 | 798 | width: 33px; |
| 788 | 799 | flex-flow: column; |
| 789 | 800 | align-items: center; |
| @@ -976,5 +987,150 @@ | ||
| 976 | 987 | /* == T O O L B A R i n Booking Listing == */ |
| 977 | 988 | /* ================================================================================================================== */ |
| 978 | 989 | .wpbc_ui_toolbar.wpbc_ui_toolbar__bo_listing { |
| 979 | 990 | margin: var(--wpbc_ui_horis_top_nav__margin); |
| 980 | -} | |
| 991 | +} | |
| 992 | + | |
| 993 | +/* Appointment snapshot details shown only for rows with Appointment data. */ | |
| 994 | +.wpbc_appointment_booking_details { | |
| 995 | + border: 1px dashed #777; | |
| 996 | + border-radius: 4px; | |
| 997 | + display: flex; | |
| 998 | + flex-flow: row wrap; | |
| 999 | + gap: 4px 18px; | |
| 1000 | + line-height: 1.6; | |
| 1001 | + padding: 8px 10px; | |
| 1002 | + margin: 0 20px 0 15px; | |
| 1003 | +} | |
| 1004 | +.wpbc_appointment_booking_details > strong { | |
| 1005 | + flex: 1 1 100%; | |
| 1006 | +} | |
| 1007 | +.wpbc_appointment_booking_details > span { | |
| 1008 | + overflow-wrap: anywhere; | |
| 1009 | +} | |
| 1010 | + | |
| 1011 | + | |
| 1012 | +/* Multi-Resource allocation summary and expanded date-to-Resource map. */ | |
| 1013 | +.wpbc_a_col__dates .booking_dates_resource_allocation_summary .content_text { | |
| 1014 | + flex-flow: column nowrap; | |
| 1015 | + gap: 2px; | |
| 1016 | + padding: 4px 2px; | |
| 1017 | + text-align: center; | |
| 1018 | +} | |
| 1019 | +.booking_dates_resource_allocation_summary .wpbc_label_booking_dates { | |
| 1020 | + line-height: 1.45; | |
| 1021 | + margin: 2px; | |
| 1022 | + white-space: normal; | |
| 1023 | +} | |
| 1024 | +.wpbc_booking_resource_count { | |
| 1025 | + color: #646970; | |
| 1026 | + font-size: 11px; | |
| 1027 | + font-weight: 500; | |
| 1028 | + line-height: 1.35; | |
| 1029 | +} | |
| 1030 | +.wpbc_row_wrap.max_height_a .wpbc_a_row__resource_allocation { | |
| 1031 | + display: none; | |
| 1032 | +} | |
| 1033 | +.wpbc_a_row__resource_allocation { | |
| 1034 | + box-sizing: border-box; | |
| 1035 | + padding: 0 10px 10px 15px; | |
| 1036 | +} | |
| 1037 | +.wpbc_col_resource_allocation { | |
| 1038 | + flex: 1 1 100%; | |
| 1039 | + min-width: 0; | |
| 1040 | +} | |
| 1041 | +.wpbc_resource_allocation { | |
| 1042 | + background: #fff; | |
| 1043 | + border: 1px solid #dcdcde; | |
| 1044 | + border-radius: 3px; | |
| 1045 | + overflow: hidden; | |
| 1046 | + width: 100%; | |
| 1047 | +} | |
| 1048 | +.wpbc_resource_allocation__header { | |
| 1049 | + align-items: center; | |
| 1050 | + border-bottom: 1px solid #dcdcde; | |
| 1051 | + display: flex; | |
| 1052 | + gap: 10px; | |
| 1053 | + justify-content: space-between; | |
| 1054 | + min-height: 30px; | |
| 1055 | + padding: 3px 10px; | |
| 1056 | +} | |
| 1057 | +.wpbc_resource_allocation__header strong { | |
| 1058 | + font-size: 13px; | |
| 1059 | +} | |
| 1060 | +.wpbc_resource_allocation__count { | |
| 1061 | + background: #f0f0f1; | |
| 1062 | + border-radius: 3px; | |
| 1063 | + color: #50575e; | |
| 1064 | + font-size: 11px; | |
| 1065 | + line-height: 1.5; | |
| 1066 | + padding: 2px 8px; | |
| 1067 | + white-space: nowrap; | |
| 1068 | +} | |
| 1069 | +.wpbc_resource_allocation__segments { | |
| 1070 | + display: flex; | |
| 1071 | + flex-flow: column nowrap; | |
| 1072 | +} | |
| 1073 | +.wpbc_resource_allocation__segment { | |
| 1074 | + align-items: center; | |
| 1075 | + border-bottom: 1px solid #f0f0f1; | |
| 1076 | + display: flex; | |
| 1077 | + flex-flow: row nowrap; | |
| 1078 | + gap: 8px; | |
| 1079 | + min-height: 36px; | |
| 1080 | + padding: 4px 10px; | |
| 1081 | +} | |
| 1082 | +.wpbc_resource_allocation__segment:last-child { | |
| 1083 | + border-bottom: 0; | |
| 1084 | +} | |
| 1085 | +.wpbc_resource_allocation__period { | |
| 1086 | + flex: 0 1 280px; | |
| 1087 | + font-weight: 600; | |
| 1088 | + min-width: 175px; | |
| 1089 | + overflow-wrap: anywhere; | |
| 1090 | +} | |
| 1091 | +.wpbc_resource_allocation__arrow { | |
| 1092 | + color: #8c8f94; | |
| 1093 | + flex: 0 0 20px; | |
| 1094 | + text-align: center; | |
| 1095 | +} | |
| 1096 | +.rtl .wpbc_resource_allocation__arrow { | |
| 1097 | + transform: scaleX(-1); | |
| 1098 | +} | |
| 1099 | +.wpbc_resource_allocation__resources { | |
| 1100 | + align-items: center; | |
| 1101 | + display: flex; | |
| 1102 | + flex: 1 1 0; | |
| 1103 | + flex-wrap: wrap; | |
| 1104 | + gap: 5px 8px; | |
| 1105 | + min-width: 0; | |
| 1106 | +} | |
| 1107 | +.wpbc_resource_allocation__resources .wpbc_label { | |
| 1108 | + margin: 0; | |
| 1109 | + max-width: 100%; | |
| 1110 | + overflow-wrap: anywhere; | |
| 1111 | + white-space: normal; | |
| 1112 | + line-height: 1.5; | |
| 1113 | +} | |
| 1114 | + | |
| 1115 | +@media (max-width: 782px) { | |
| 1116 | + .wpbc_a_row__resource_allocation { | |
| 1117 | + padding: 0 5px 10px; | |
| 1118 | + } | |
| 1119 | + .wpbc_resource_allocation__header { | |
| 1120 | + align-items: flex-start; | |
| 1121 | + flex-wrap: wrap; | |
| 1122 | + } | |
| 1123 | + .wpbc_resource_allocation__segment { | |
| 1124 | + align-items: flex-start; | |
| 1125 | + flex-flow: column nowrap; | |
| 1126 | + gap: 4px; | |
| 1127 | + padding: 8px 10px; | |
| 1128 | + } | |
| 1129 | + .wpbc_resource_allocation__period { | |
| 1130 | + flex-basis: auto; | |
| 1131 | + min-width: 0; | |
| 1132 | + } | |
| 1133 | + .wpbc_resource_allocation__arrow { | |
| 1134 | + display: none; | |
| 1135 | + } | |
| 1136 | +} | |