PluginProbe
Booking Calendar / 10.1.3
Booking Calendar v10.1.3
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
booking / css / admin-skin-modern_1.css

admin-skin-modern_1.css in Booking Calendar 10.1.3, at css/admin-skin-modern_1.css

530 lines 14.7 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 /*
2 * New design 2.0, 2.1 of Booking admin panel with white colors and bottom borders for selected elements
3 *
4 * 2023-03-26, 2023-12-17
5 *
6 */
7
8 /* Set general background color for menu tab as white */
9 .wpdvlp-top-tabs .nav-tabs{
10 background: #fff;
11 padding: 0 0 0;
12 border-radius: 2px; /* ?? */
13 }
14 /* Navigation tabs */
15 .wpdvlp-top-tabs .nav-tab {
16 background: transparent;
17 border: none;
18 text-shadow: none;
19 color: #555;
20 font-size: 15px;
21 border-bottom: 4px solid transparent;
22 padding: 9px 20px;
23 margin: 0 1px 0 0;
24 }
25 /* Menu Icons */
26 .wpdvlp-top-tabs .nav-tab .menu_icon::before {
27 font-size: 18px;
28 }
29 /* Active navigation tab */
30 .wpdvlp-top-tabs .nav-tab-active,
31 .wpdvlp-top-tabs a.nav-tab-active:hover,
32 .wpdvlp-top-tabs a.nav-tab-active:focus {
33 border-bottom: 4px solid #1e7bc7;
34 }
35 /* Active navigation tab : Focus*/
36 .wpdvlp-top-tabs a.nav-tab-active:focus {
37 color: inherit !important;
38 background: transparent !important;
39 text-shadow:none;
40 outline: none;
41 border-radius: 0;
42 box-shadow: none;
43 }
44 .wpdvlp-top-tabs a.nav-tab:focus {
45 border-radius: 0;
46 }
47 /* Tab : hover */
48 .wpdvlp-top-tabs a.nav-tab:hover {
49 color: #D54E21 !important;
50 background-color: transparent !important;
51 border-bottom-color: #d54e21;
52 }
53 .wpdvlp-top-tabs .nav-tab-active:hover{
54 color: #FFF !important;
55 background: #7A7A88 !important;
56 }
57 /* Sub tabs */ /* ../core/any/css/admin-menu.css */
58 .wpdvlp-sub-tabs {
59 border: 1px solid #dadada;
60 border-top: 1px solid #ededed;
61 background: #f7f7f7;
62 height: auto;
63 clear: both;
64 border-radius: 2px;
65 box-shadow: none;
66 margin: 0 0 0px 0;
67 padding: 5px;
68 }
69 .wpdvlp-sub-tabs .wpdvlp-tabs-wrapper {
70 margin-bottom: -1px;
71 }
72 .wpdvlp-sub-tabs .nav-tabs{
73 margin: 0;
74 }
75 .wpdvlp-sub-tabs .nav-tabs .button:last-child{
76 margin-left: auto;
77 }
78 .wpdvlp-sub-tabs .nav-tabs .nav-tab{
79 border: none;
80 border-bottom: 3px solid #F7F7F7;
81 border-radius: 0;
82 background: #F7F7F7;
83 color: #777;
84 font-weight: 600;
85 font-size: 13px;
86 height: 20px;
87 line-height: 18px;
88 padding: 4px 5px;
89 margin: 0 0 -4px;
90 box-sizing: content-box;
91 text-shadow: none;
92 }
93 .wpdvlp-sub-tabs .nav-tabs .nav-tab,
94 .wpdvlp-sub-tabs .nav-tabs .nav-tab.wpdevelop-submenu-tab-selected,
95 .wpdvlp-sub-tabs .nav-tabs .nav-tab.wpdevelop-submenu-tab-selected:hover{
96 border-right: 1px solid #bbb;
97 background-color: transparent !important;
98 border-bottom:3px solid transparent;
99 box-shadow: 1px 0 0 #fdfdfd;
100 }
101 .wpdvlp-sub-tabs .nav-tabs .nav-tab:nth-last-child(2){
102 border-right: none;
103 box-shadow: none;
104 }
105
106 .wpdvlp-sub-tabs .nav-tabs .nav-tab > span {
107 padding: 6px 12px;
108 }
109 .wpdvlp-sub-tabs .nav-tabs .nav-tab.wpdevelop-submenu-tab-selected > span{
110 color: #777 !important;
111 border-bottom: 3px solid #7AC71E;
112 }
113 .wpdvlp-sub-tabs .nav-tabs .nav-tab.wpdevelop-submenu-tab-selected > span:focus{
114 box-shadow: none;
115 }
116 .wpdvlp-sub-tabs .nav-tabs .nav-tab > span:hover,
117 .wpdvlp-sub-tabs .nav-tabs .nav-tab.wpdevelop-submenu-tab-selected > span:hover{
118 color: #D54E21 !important;
119 background-color: transparent !important;
120 border-bottom: 3px solid #d54e21;
121 }
122 .wpdvlp-sub-tabs .nav-tabs .nav-tab.go-to-link,
123 .wpdvlp-sub-tabs .nav-tabs .nav-tab.go-to-link:hover,
124 .wpdvlp-sub-tabs .nav-tabs .nav-tab.go-to-link:active {
125 margin: 3px 5px 0;
126 }
127 .wpdvlp-sub-tabs .nav-tabs .nav-tab.go-to-link > span:hover{
128 border-bottom-width: 1px;
129 border-bottom-style: dashed;
130 border-left:none;
131 }
132 /* For Modal windows - shortcodes */
133 .wpbc_sc_container__all_shortcodes .wpdvlp-sub-tabs .nav-tabs .nav-tab > span {
134 padding: 7px 12px;
135 }
136 @media (max-width: 782px) {
137 .wpdevelop-submenu-tab.nav-tab {
138 height: 35px !important;
139 line-height: 28px !important;
140 width: 100%;
141 clear: both;
142 border: none !important;
143 border-left: 3px solid #f7f7f7 !important;
144 padding: 2px 9px !important;
145 box-sizing: border-box !important;
146 }
147 .wpdvlp-sub-tabs .nav-tabs .nav-tab > span{
148 padding-left: 14px;
149 border-left: 3px solid transparent;
150 margin-left: -17px;
151 }
152 /* For Modal windows - shortcodes */
153 .wpbc_sc_container__all_shortcodes .wpdvlp-sub-tabs .nav-tabs .nav-tab > span{
154 margin-left: -12px;
155 }
156 .wpdvlp-sub-tabs .nav-tabs .nav-tab.wpdevelop-submenu-tab-selected > span{
157 border-left: 3px solid #7AC71E !important;
158 border-bottom: none;
159 }
160 .wpdvlp-sub-tabs .nav-tabs .nav-tab > span:hover,
161 .wpdvlp-sub-tabs .nav-tabs .nav-tab.wpdevelop-submenu-tab-selected > span:hover{
162 color: #D54E21 !important;
163 background-color: transparent !important;
164 border-left: 3px solid #d54e21 !important;
165 border-bottom:transparent;
166 }
167 .wpdvlp-sub-tabs .nav-tabs .nav-tab.go-to-link > span:hover {
168 border-bottom: 1px dashed #D54E21 !important;
169 border-left: 3px solid transparent !important;
170 }
171 .wpdvlp-sub-tabs .nav-tabs .nav-tab.go-to-link {
172 padding: 4px 15px;
173 }
174 }
175
176 /**********************************************************************************************************************/
177 /* Toolbar shadow */
178 .wpbc_mode_switcher,
179 #toolbar_booking_listing,
180 #show_link_advanced_booking_filter {
181 box-shadow: 0 5px 18px #e4e4e4;
182 box-shadow: 0 5px 8px #e4e4e4;
183 }
184 /* Sub tabs in new design container - Availability page or Booking Listing */
185 .wpbc_ajx_toolbar .ui_container {
186 border-top: 1px solid #ededed;
187 }
188 .wpdvlp-top-tabs .nav-tabs{
189 border: none;
190 border: 1px solid #d6d6d6;
191 }
192
193 /* Toolbars at Booking Listing */
194 div.wpbc_ajx_toolbar {
195 margin: 0 0 10px 0px; /* //FixIn: 9.8.15.2 */
196 }
197 /* Toolbar at Calendar Overview page*/
198 .wpbc_page_tab__vm_calendar #toolbar_booking_listing{
199 margin: 0 0 10px 0px !important; /* //FixIn: 9.8.15.2 */
200 }
201 .wpbc_page_tab__vm_calendar #toolbar_booking_listing .wpdvlp-sub-tabs{
202 padding: 8px 15px 11px;
203 }
204 /**********************************************************************************************************************/
205
206 /* Booking Listing | Availability page - little smaller */
207 #wpbc-availability-admin-page .wpdvlp-top-tabs .nav-tab,
208 #toolbar_booking_listing .wpdvlp-top-tabs .nav-tab {
209 font-size: 14px; /* font-size: 15px; */
210 padding: 7px 20px; /* padding: 9px 20px; */
211 }
212 #wpbc-availability-admin-page .wpdvlp-top-tabs .nav-tab .menu_icon::before,
213 #toolbar_booking_listing .wpdvlp-top-tabs .nav-tab .menu_icon::before {
214 font-size: 16px; /* font-size: 18px; */
215 }
216
217 #wpbc-availability-admin-page .wpdvlp-top-tabs .nav-tabs,
218 #toolbar_booking_listing .wpdvlp-top-tabs .nav-tabs {
219 /*border-radius: 1px; */ /* //FixIn: 9.8.15.2 */
220 /* border-radius: 2px; */
221 }
222
223 /* Vertical switcher on Booking Listing and Calendar overview pages */
224 .wpdevelop .btn-group-vertical {
225 width: 44px;
226 margin: 0 0 0 -1px;
227 border: 1px solid #d8d8d8;
228 }
229 .wpdevelop .btn-group-vertical > .button{
230 box-shadow: none;
231 text-align: center;
232 height: 45.5px;
233 line-height: 46px;
234 border-radius: 0 !important;
235 border:none;
236 border-left: 3px solid #f7f7f7;
237 }
238 .wpdevelop .btn-group-vertical > .button.active{
239 border-left: 3px solid #7AC71E;
240 transform: none;
241 }
242 .wpdevelop .btn-group-vertical > .button:hover,
243 .wpdevelop .btn-group-vertical > .button.active:hover {
244 border-left: 3px solid #D54E21;
245 transform: none;
246 }
247 .wpdevelop .btn-group-vertical > .button + .button,
248 .wpdevelop .btn-group-vertical > .button + .btn-group,
249 .wpdevelop .btn-group-vertical > .btn-group + .button,
250 .wpdevelop .btn-group-vertical > .btn-group + .btn-group {
251 margin-top:0
252 }
253 @media (max-width: 782px) {
254 .wp-core-ui .wpbc_page .button {
255 padding: 0 10px 1px;
256 }
257 }
258
259 /**********************************************************************************************************************/
260 /*It does not work :(*/
261 /* Toolbar at the Calendar Overview page */
262 .wpbc_page_timeline #actions_toolbar_container {
263 display:flex;
264 margin:0px;
265 min-height: 42px;
266 flex-flow: row wrap;
267 justify-content: space-between;
268 align-items: center;
269 padding: 0 8px;
270 }
271 .wpbc_page_timeline #actions_toolbar_container .control-group {
272 float:none;
273 margin: 3px 0;
274 }
275 .wpbc_page_timeline #actions_toolbar_container .control-group:nth-of-type(1){
276 order: 3;
277 }
278 .wpbc_page_timeline #actions_toolbar_container .control-group:nth-of-type(2){
279 order: 2;
280 }
281 .wpbc_page_timeline #actions_toolbar_container .control-group:nth-of-type(3){
282 order: 1;
283 }
284
285 /** Resource Tables */
286 .wpdevelop .table > thead > tr > th,
287 .wpdevelop .table > tbody > tr > th,
288 .wpdevelop .table > tfoot > tr > th,
289 .wpdevelop .table > thead > tr > td,
290 .wpdevelop .table > tbody > tr > td,
291 .wpdevelop .table > tfoot > tr > td {
292 padding: 10px 7px;
293 }
294 .wpdevelop .table > thead > tr > th,
295 .wpdevelop .table > tbody > tr > th,
296 .wpdevelop .table > tfoot > tr > th{
297 font-size: 14px;
298 /*line-height: 30px;*/
299 }
300 .wpdevelop .table > thead > tr > th {
301 border-bottom: 1px solid #dddddd;
302 }
303 .wpbc_resources_table .table,
304 .wpbc_resources_table .table.widefat {
305 box-shadow: 0 0 1px #aaa;
306 }
307 .wpdevelop.wpbc_resources_table table > tfoot > tr > th{
308 border-top: 1px solid #e5e5e5;
309 }
310 .wpdevelop .table.table-striped {
311 background-color: #fbfbfb;
312 border: 1px solid #e3e3e3;
313 }
314 .wpdevelop .table.table-striped > tbody > tr:nth-of-type(2n+1){
315 background-color: #f5f5f5;
316 }
317 .wpdevelop .table-striped > thead > tr > th,
318 .wpdevelop .table-striped > tbody > tr > th,
319 .wpdevelop .table-striped > tfoot > tr > th{
320 font-weight: 600;
321 text-shadow: none;
322 color: #555;
323 font-size: 15px;
324 }
325 .table .check-column {
326 position: initial;
327 }
328 /* Fieldset - mainly for Booking > Settings > Sync > "Export - .ics" page. FixIn: 9.8.0.6 */
329 .wpbc_selectable_body .wpbc_row fieldset{
330 display: flex;
331 flex-flow: row wrap;
332 justify-content: flex-start;
333 align-items: center;
334 }
335 .wpbc_selectable_body .wpbc_row fieldset > *{
336 /*margin: 0 10px 10px 0;*/
337 margin: 5px 10px 5px 0;
338 }
339 .wpbc_selectable_body .wpbc_row fieldset > a{
340 margin-left:auto;
341 }
342 .wpbc_selectable_body .wpbc_row fieldset .put-in:active,
343 .wpbc_selectable_body .wpbc_row fieldset .put-in:focus,
344 .wpbc_selectable_body .wpbc_row fieldset .put-in{
345 flex:1 0 100%;
346 border:none;
347 outline: none;
348 box-shadow: none;
349 background: transparent;
350 cursor: pointer;
351 padding: 0;
352 }
353 .wpbc_selectable_body .wpbc_row fieldset > code {
354 font-size: 12px;
355 line-height: 22px !important;
356 background: #ddd;
357 color: #000;
358 }
359 /* End Fieldset - mainly for Booking > Settings > Sync > "Export - .ics" page */
360
361 /* Top white line - Header - at the admin page */
362 body[class*="page_wpbc"] #wpcontent {
363 padding: 0;
364 background-color: #f3f4f5;
365 }
366 body[class*="page_wpbc"] #wpcontent .wrap.wpbc_page{
367 padding-left: 20px;
368 }
369 body[class*="page_wpbc"].admin-bar .wrap.wpbc_page {
370 min-height: calc(100vh - 250px);
371 }
372 body[class*="page_wpbc"] .wrap.wpbc_page {
373 min-height: calc(100vh - 153px);
374 }
375 .wpbc_page_top.wrap {
376 margin:0;
377 }
378 .wpbc_page_top h1.wpbc_header{
379 /*background: #fff;*/
380 /*box-shadow: 0 1px 2px #e9e9e9;*/
381 /*box-shadow: 0 0px 7px #e7e7e7;*/
382 z-index: 8;
383 box-sizing: border-box;
384 width: 100%;
385 min-height: 54px; /* FixIn: 10.0.0.13 */
386 padding: 0 22px;
387 display: flex;
388 flex-flow: row nowrap;
389 justify-content: flex-start;
390 align-items: center;
391 /* Removed white line in header*/
392 /*background: transparent;*/
393 /*box-shadow: none;*/
394
395 /* FixIn: 10.0.0.32 */
396 /*margin-bottom: -15px;*/
397 /* background: #fcfcfc;*/
398 /* box-shadow: 0 0px 2px #e7e7e7;*/
399 /* box-shadow: 0 0px 1px #8a8a8a;*/
400 /*background: linear-gradient(180deg, rgba(243,244,245,1) 0%, rgba(255,255,255,1) 100%);*/
401 /*box-shadow: 0 1px 1px #e5e5e5;*/
402 box-shadow: 0 1px 1px #f0f0f0;
403 background: #fcfcfc;
404 border-bottom: 1px solid #ddd;
405 }
406 @media (max-width: 782px) {
407 .wpbc_page_top h1.wpbc_header{
408 padding:0;
409 }
410 .wpbc_page_top h1.wpbc_header .wpbc_header_menu_tabs {
411 flex-flow: row nowrap;
412 }
413 }
414 .wpbc_header_icon,
415 .wpbc_header_text{
416 flex: 0 1 auto;
417 margin-right: 4px;
418 margin-left: 12px;
419 white-space: nowrap;
420 }
421
422 .wpbc_header_icon i[class*="wpbc_icn_"]::before {
423 font-size: 18px;
424 font-weight: 400;
425 line-height: 30px;
426 vertical-align: middle;
427 }
428
429 /* Approved / Pending notice messages at top right side of the page */
430 .wpbc_page .notice {
431 border-top:1px solid #ddd;
432 border-right:1px solid #ddd;
433 border-bottom:1px solid #ddd;
434 }
435 .wpbc_page div.wpbc_inner_message {
436 /*margin-top:1px;*/
437 }
438 /* Read booking button -- EYE ------------------------------------------------------------------------------------- */
439 /* //FixIn: 9.6.1.2 */
440 a.wpbc_is_new_button,
441 a.wpbc_is_new_button:hover {
442 left: 3px;
443 margin:0;
444 }
445 @media (max-width: 782px) {
446 a.wpbc_is_new_button,
447 a.wpbc_is_new_button:hover {
448 left: auto;
449 margin-left: auto;
450 right: 0;
451 margin-right: 22px;
452 }
453 }
454 /*
455 * New design 2.1 of Top menu headers. //FixIn: 9.8.15.2
456 *
457 * 2023-12-17
458 *
459 */
460 .wpbc_header_menu_tabs{
461 flex:1;
462 display: flex;
463 flex-flow: row wrap;
464 justify-content: flex-start;
465 align-items: flex-start;
466 height: auto;
467 }
468 /* TOP Message shift in version 9.9 //FixIn: 9.9.0.10 */
469 .wpbc_header .wpbc_message_wrapper {
470 margin-top:0px;
471 }
472 .wpbc_page_top__header_tabs .wpdvlp-top-tabs {
473 display: flex;
474 flex-flow: row wrap;
475 justify-content: flex-start;
476 align-items: flex-start;
477 height: auto;
478 }
479 /* Set Right Align */
480 .wpbc_page_top__header_tabs .wpdvlp-top-tabs .nav-tab-position-right {
481 order:999;
482 margin-left:auto;
483 }
484 .wpbc_page_top__header_tabs .wpdvlp-top-tabs .nav-tab {
485 font-size:17px;
486 line-height: 32px;
487 }
488 .wpbc_page_top__header_tabs .wpdvlp-top-tabs .nav-tab.nav-tab-active {
489 border-bottom: 4px solid #64aa45;
490 }
491 .wpbc_page_top__header_tabs .wpdvlp-top-tabs .nav-tab.nav-tab-active:hover {
492 border-bottom-color: #d54e21;
493 }
494 .wpbc_page_top__header_tabs .wpdvlp-top-tabs .wpdvlp-tabs-wrapper {
495 height: auto;
496 }
497 .wpbc_admin_page .wpdvlp-sub-tabs {
498 border: 1px solid #dadada;
499 }
500 .wpdvlp-top-tabs .nav-tabs{
501 border: 1px solid #d6d6d6;
502 border-bottom: none;
503 border-radius: 2px 2px 0 0;
504 }
505 #wpbc-resources-admin-page .wpdvlp-top-tabs .nav-tabs,
506 #wpbc-availability-admin-page .wpdvlp-top-tabs .nav-tabs,
507 #toolbar_booking_resources .wpdvlp-top-tabs .nav-tabs,
508 .wpbc_ajx_toolbar .wpdvlp-top-tabs .nav-tabs{
509 border-bottom: 1px solid #d6d6d6;
510 }
511 /* Make "Seasons" filter Tab last in line */
512 .wpbc_top_tab__season_filters {
513 order: 1;
514 }
515 .wpbc_top_tab__general_availability,
516 .wpbc_top_tab__payment_gateways {
517 order: 2;
518 border-left: 1px solid #cfcfcf !important;
519 }
520
521 /* Show WordPress notice messages (such as: "WordPress 6.4.2 is available!") at right side of the page. */
522 .toplevel_page_wpbc #update-nag,
523 .toplevel_page_wpbc .update-nag,
524 body[class*='wp-booking-calendar'] #update-nag,
525 body[class*='wp-booking-calendar'] .update-nag {
526 position: absolute;
527 z-index: 10;
528 margin: 5px;
529 right:0;
530 }