PluginProbe ʕ •ᴥ•ʔ
VikAppointments Services Booking Calendar / trunk
VikAppointments Services Booking Calendar vtrunk
trunk 1.2.17 1.2.18 1.2.19
vikappointments / admin / assets / css / adapter / J40.css
vikappointments / admin / assets / css / adapter Last commit date
J30.css 4 years ago J40.css 5 months ago J50.css 1 year ago index.html 4 years ago
J40.css
712 lines
1 /* Joomla 4.x */
2
3 .icon-vikappointments:before {
4 /* fa-utensils icon */
5 font-family: "Font Awesome 5 Free", FontAwesome !important;
6 font-weight: 900;
7 content: "\f274";
8 background: none !important;
9 }
10
11 #vap-main-menu .version-box i.upd-avail {
12 margin-left: 4px;
13 }
14
15 /* miscellaneous */
16 .popover, .tooltip, .joomla-modal {
17 z-index: 9999;
18 }
19 .options-form legend .vap-quest-popover {
20 vertical-align: middle;
21 transform: none;
22 line-height: 25px;
23 margin-left: 6px;
24 }
25
26 .pull-left {
27 float: left;
28 }
29 .pull-right {
30 float: right;
31 }
32
33 img {
34 max-width: 100%;
35 }
36
37 a[target=_blank]:before {
38 /* remove that orrible icon for external links */
39 content: none;
40 }
41 a {
42 text-decoration: none;
43 }
44 a:focus {
45 outline: none;
46 }
47
48 input:read-only {
49 background: #e8e8e8 !important;
50 border: 1px solid #e8e8e8 !important;
51 opacity: 1 !important;
52 }
53 input[type="file"] {
54 line-height: 18px;
55 }
56 body.com_vikappointments textarea {
57 width: 100% !important;
58 }
59 .control-group.ip-address {
60 align-items: center;
61 }
62 .ip-address input,
63 .form-with-select input,
64 .form-with-select select,
65 .form-with-select > div {
66 width: auto !important;
67 display: inline-block;
68 vertical-align: top;
69 }
70 #vap-smsapi-params-table td > input,
71 #vap-smsapi-params-table td > .select2-container {
72 width: 100% !important;
73 }
74
75 .alert p:last-of-type {
76 margin-bottom: 0;
77 }
78
79 .vik-confirm-buttons > a {
80 font-size: 16px !important;
81 }
82 .vap-archive-main .vap-archive-filestree .root .monthslist {
83 font-size: 14px;
84 }
85
86 pre {
87 word-break: break-all;
88 word-wrap: break-word;
89 white-space: pre-wrap;
90 }
91
92 .contentpane.component.com_vikappointments joomla-tab-element {
93 padding: 20px 10px !important;
94 }
95 joomla-tab > div[role=tablist] button[role=tab], joomla-tab-element:focus {
96 outline: none;
97 }
98
99 #invoice-number-field {
100 align-items: center;
101 }
102 #invoice-number-field > * {
103 margin: 0;
104 }
105
106 /* badge */
107 body.com_vikappointments .badge-success {
108 background-color: #457d54 !important;
109 }
110
111 body.com_vikappointments .badge-info {
112 background-color: #2a69b8 !important;
113 }
114
115 body.com_vikappointments .badge-warning {
116 background-color: #ffb514 !important;
117 color: #000 !important;
118 }
119
120 body.com_vikappointments .badge-danger {
121 background-color: #c62928 !important;
122 }
123
124 body.com_vikappointments .badge-important {
125 background-color: #c52827 !important;
126 }
127
128 /* modal */
129 body.com_vikappointments #content .modal-dialog {
130 width: 80vw;
131 max-width: none;
132 }
133 body.com_vikappointments #content .modal-body {
134 height: calc(100vh - 200px);
135 overflow-y: scroll;
136 }
137 body.com_vikappointments .modal .btn {
138 padding: .6rem 1rem;
139 margin-right: initial;
140 line-height: inherit;
141 }
142 body.com_vikappointments.contentpane #adminForm {
143 /*overflow-x: hidden;*/
144 }
145
146 #jmodal-mediamanager .modal-body,
147 #jmodal-respinfo .modal-body {
148 padding: 0;
149 }
150
151 .order-container {
152 padding: 0 !important;
153 margin-left: -10px !important;
154 margin-right: -10px !important;
155 }
156 .order-container h3 {
157 margin-top: 5px;
158 }
159
160 .vap-media-inspector .media-info-box .media-details {
161 width: calc(60% - 4px);
162 padding: 0 6px;
163 }
164 .vap-media-inspector .media-info-box .media-details > * {
165 font-size: smaller;
166 }
167
168 /* buttons */
169 body.com_vikappointments span.btn-primary,
170 body.com_vikappointments span.btn-primary:hover {
171 color: var(--template-text-light);
172 background-color: var(--template-bg-dark-60);
173 border-color: var(--template-bg-dark-60);
174 cursor: default;
175 }
176 body.com_vikappointments .modal .btn-primary:not(:disabled):not(.disabled).active {
177 color: var(--template-text-light);
178 }
179
180 /* filters */
181 body.com_vikappointments #content .btn-toolbar,
182 body.com_vikappointments.contentpane .btn-toolbar {
183 width: 100%;
184 margin-bottom: 10px;
185 height: auto !important;
186 display: inline-block;
187 }
188 body.com_vikappointments #content .btn-toolbar > *,
189 body.com_vikappointments.contentpane .btn-toolbar > * {
190 margin: 5px 0;
191 }
192 body.com_vikappointments #content .btn-toolbar > * + *,
193 body.com_vikappointments.contentpane .btn-toolbar > * + * {
194 -webkit-margin-start: 8px;
195 margin-inline-start: 8px;
196 }
197
198 body.com_vikappointments #content .js-stools-container-filters-visible,
199 body.com_vikappointments.contentpane .js-stools-container-filters-visible {
200 display: grid;
201 grid-gap: 8px;
202 grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
203 }
204 body.com_vikappointments #content .js-stools-container-filters-visible {
205 padding: 10px;
206 background-color: #fff;
207 }
208 body.com_vikappointments #content .js-stools-container-filters-visible .btn-group,
209 body.com_vikappointments.contentpane .js-stools-container-filters-visible .btn-group {
210 margin: 0;
211 }
212
213 body.com_vikappointments #content button[onclick^="vapToggleSearchToolsButton"]:not(.btn-primary),
214 body.com_vikappointments.contentpane button[onclick^="vapToggleSearchToolsButton"]:not(.btn-primary) {
215 /*color: var(--atum-text-light);*/
216 color: var(--template-text-light);
217 background-color: var(--template-bg-dark-60);
218 border-color: var(--template-bg-dark-60);
219 z-index: inherit;
220 }
221 body.com_vikappointments #content button[onclick^="vapToggleSearchToolsButton"]:not(.btn-primary):hover,
222 body.com_vikappointments.contentpane button[onclick^="vapToggleSearchToolsButton"]:not(.btn-primary):hover {
223 /*background-color: var(--atum-bg-dark-70);*/
224 background-color: var(--template-bg-dark-70);
225 /*border-color: var(--atum-bg-dark-90);*/
226 border-color: var(--template-bg-dark-90);
227 }
228 body.com_vikappointments #content button[onclick^="clearFilter"],
229 body.com_vikappointments.contentpane button[onclick^="clearFilter"] {
230 /*background-color: var(--atum-bg-dark);*/
231 background-color: var(--template-bg-dark);
232 border: 0;
233 }
234
235 body.com_vikappointments #content .btn-toolbar .field-calendar .input-group input,
236 body.com_vikappointments.contentpane .btn-toolbar .field-calendar .input-group input {
237 width: 150px;
238 }
239
240 body.com_vikappointments #content .btn-group .btn {
241 align-self: auto;
242 }
243
244 /* tables */
245 body.com_vikappointments #content table tbody a {
246 text-decoration: none !important;
247 }
248 body.com_vikappointments #content table td.center,
249 body.com_vikappointments #content table th.center {
250 text-align: center;
251 }
252 body.com_vikappointments #content table td.left,
253 body.com_vikappointments #content table th.left {
254 text-align: left;
255 }
256 body.com_vikappointments #content table td.right,
257 body.com_vikappointments #content table th.right {
258 text-align: right;
259 }
260
261 /* form fieldset */
262 body.com_vikappointments .card + .card {
263 margin-top: 15px;
264 }
265 body.com_vikappointments fieldset.options-form:last-of-type {
266 /*margin-bottom: 0;*/
267 }
268
269 /* form controls */
270 body.com_vikappointments #content .options-form > legend {
271 background: transparent;
272 }
273 /*body.com_vikappointments #content .options-form .control-group {
274 max-width: 1000px;
275 }*/
276 @media screen and (min-width: 1381px) {
277 body.com_vikappointments .options-form .control-group .control-label {
278 max-width: 240px;
279 }
280 body.com_vikappointments .options-form .control-group .control-label + .controls {
281 max-width: calc(100% - 240px);
282 }
283 }
284
285 body.com_vikappointments .options-form .inline-fields {
286 display: flex;
287 justify-content: space-between;
288 align-items: center;
289 max-width: 100%;
290 }
291 body.com_vikappointments .options-form .inline-fields > *,
292 body.com_vikappointments .config-fieldset-body .inline-fields > * {
293 flex: 1;
294 }
295 body.com_vikappointments .options-form .inline-fields > *:not(:first-child),
296 body.com_vikappointments .config-fieldset-body .inline-fields > *:not(:first-child) {
297 margin-left: 10px;
298 }
299 body.com_vikappointments .options-form .inline-fields > .short-select,
300 body.com_vikappointments .config-fieldset-body .inline-fields > .short-select {
301 flex: 0;
302 flex-basis: 80px !important;
303 }
304 body.com_vikappointments .options-form .select2-container-multi input.select2-input.select2-default {
305 width: 100% !important;
306 max-width: 100% !important;
307 }
308
309 body.com_vikappointments .config-fieldset-body .inline-fields {
310 display: flex;
311 justify-content: space-between;
312 align-items: center;
313 }
314 body.com_vikappointments .config-fieldset-body textarea {
315 width: 100% !important;
316 }
317 body.com_vikappointments .config-panel-tabview .config-fieldset .control-group .control-label {
318 margin-top: 0;
319 max-width: 200px;
320 width: 200px;
321 }
322 body.com_vikappointments .config-panel-tabview .config-fieldset .control-group .controls {
323 width: calc(100% - 204px);
324 }
325
326 /**
327 * do not display inline in case the fields are placed in a vertical column
328 */
329 body.com_vikappointments .col-lg-5 .options-form .control-group .inline-fields,
330 body.com_vikappointments .col-lg-4 .options-form .control-group .inline-fields {
331 display: block;
332 }
333 body.com_vikappointments .col-lg-5 .options-form .inline-fields > *:not(:first-child),
334 body.com_vikappointments .col-lg-4 .options-form .inline-fields > *:not(:first-child) {
335 margin: 10px 0 0 0;
336 }
337
338 /* badges */
339 .badge-important {
340 /* replicate danger style */
341 background-color: #900;
342 color: #fff;
343 border: 1px solid #fff;
344 }
345
346 /* select2 - standard */
347 body.com_vikappointments .controls .select2-container:not(.short-select) {
348 /* may be obtrusive in case of lines with multi-fields */
349 width: 100% !important;
350 }
351 body.com_vikappointments .controls .select2-container.vap-mc-users-select {
352 width: calc(100% - 64px) !important;
353 }
354 body.com_vikappointments .select2-container .select2-choice {
355 height: 42px;
356 line-height: 42px;
357 text-decoration: none !important;
358 }
359 body.com_vikappointments .select2-container .select2-choice abbr {
360 top: 16px;
361 }
362 body.com_vikappointments .select2-container .select2-choice .select2-arrow > * {
363 margin-top: 8px;
364 }
365 /* select2 - multiple */
366 body.com_vikappointments #content .select2-container-multi .select2-choices {
367 min-height: 45px !important;
368 padding: 4px 0 0 0;
369 }
370 body.com_vikappointments #content .select2-container-multi .select2-choices .select2-search-choice {
371 padding: 6px 18px 6px 5px;
372 /*background-color: var(--atum-link-color);*/
373 background-color: var(--template-link-color);
374 /*color: var(--atum-text-light);*/
375 color: var(--template-text-light);
376 /*border-color: var(--atum-link-color);*/
377 border-color: var(--template-link-color);
378 box-shadow: none;
379 background-image: none;
380 }
381 body.com_vikappointments #content .select2-container-multi .select2-choices .select2-search-choice .select2-search-choice-close {
382 top: 7px;
383 left: initial;
384 right: 1px;
385 /*color: var(--atum-text-light);*/
386 color: var(--template-text-light);
387 background-image: none;
388 text-decoration: none;
389 }
390 body.com_vikappointments #content .select2-container-multi .select2-choices .select2-search-choice .select2-search-choice-close:hover {
391 /*color: var(--atum-bg-dark-90);*/
392 color: var(--template-bg-dark-90);
393 }
394 body.com_vikappointments #content .select2-container-multi .select2-choices .select2-search-choice .select2-search-choice-close:before {
395 content: "×";
396 display: block;
397 font-size: 15px;
398 }
399 @media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min-resolution: 2dppx) {
400 body.com_vikappointments #content .select2-container .select2-search input,
401 /*body.com_vikappointments #content .select2-container .select2-search-choice-close,*/
402 body.com_vikappointments #content .select2-container .select2-container .select2-choice abbr,
403 body.com_vikappointments #content .select2-container .select2-container .select2-choice .select2-arrow b {
404 background-image: none !important;
405 }
406 body.com_vikappointments #content .select2-search:after {
407 background: url('../js/select2/select2x2.png') no-repeat 100% -21px !important;
408 background-size: 60px 40px !important;
409 }
410 }
411
412 img.vap-opt-flag {
413 margin-right: 10px;
414 padding: 0;
415 }
416
417 /*
418 * Fix problem with Flex rules of Joomla 4.
419 */
420 #wrapper.wrapper > .container-main {
421 flex: 1;
422 min-width: 0;
423 }
424
425 /* Revenue widget Table Responsive */
426 .widget-revenue-table {
427 display: block;
428 width: 100%;
429 max-width: 100%;
430 overflow-x: auto;
431 }
432 .widget-revenue-table table {
433 width: 100%;
434 }
435
436 /* intlTel */
437 .full-width .controls > .iti {
438 width: 100%;
439 }
440
441 .iti input[type="text"],
442 .iti input[type="tel"] {
443 box-sizing: border-box;
444 width: inherit !important;
445 max-width: inherit;
446 }
447
448 .iti__country-list {
449 z-index: 10 !important;
450 }
451
452 /* iOS toggle */
453 .switch-ios input.ios-toggle-round + label {
454 width: 52px;
455 height: 32px;
456 }
457 .switch-ios input.ios-toggle-round + label:after {
458 width: 26px;
459 height: 26px;
460 }
461
462 /* inspector */
463 body.com_vikappointments .record-inspector-overlay {
464 z-index: 9999;
465 }
466 body.com_vikappointments .record-inspector {
467 padding: 0;
468 }
469 body.com_vikappointments .record-inspector .inspector-head {
470 width: 100%;
471 }
472 body.com_vikappointments .record-inspector .inspector-head > h3 {
473 line-height: 36px;
474 }
475 body.com_vikappointments .record-inspector .inspector-body {
476 height: calc(100% - 150px);
477 }
478 body.com_vikappointments .record-inspector .inspector-footer {
479 bottom: 0;
480 }
481
482 body.com_vikappointments .record-inspector .inspector-body .inspector-form input,
483 body.com_vikappointments .record-inspector .inspector-body .inspector-form select,
484 body.com_vikappointments .record-inspector .inspector-body .inspector-form textarea,
485 body.com_vikappointments .record-inspector .inspector-body .inspector-form .select2-container {
486 width: 100% !important;
487 margin: 0;
488 }
489 body.com_vikappointments .record-inspector .inspector-body .inspector-form .control-group {
490 margin: 0 0 8px 0;
491 display: block;
492 }
493 body.com_vikappointments .record-inspector .inspector-body .inspector-form .controls {
494 min-width: 0;
495 }
496 body.com_vikappointments .record-inspector .inspector-body .inspector-form .input-group input {
497 /*width: auto !important;*/
498 flex: 1;
499 }
500 body.com_vikappointments .record-inspector .inspector-body .inspector-form joomla-tab-element {
501 padding: 10px 0;
502 }
503
504 body.com_vikappointments .vap-card .vap-card-summary .card-text .card-text-primary {
505 margin-bottom: 0;
506 }
507 body.com_vikappointments .vap-card .vap-card-summary .card-text .card-text-secondary {
508 margin-top: 5;
509 }
510 body.com_vikappointments .vap-card .vap-card-summary .card-text .card-text-secondary:empty {
511 display: none;
512 }
513
514 .colorpicker {
515 z-index: 9999 !important;
516 }
517
518 /* wizard */
519 .vap-wizard .wizard-step .wizard-form .control-group .control-label {
520 width: 150px !important;
521 }
522 .vap-wizard .wizard-step .wizard-form .control-group .controls {
523 max-width: calc(100% - 150px) !important;
524 }
525
526 .vap-wizard-steps {
527 background: #fff;
528 border-radius: 4px;
529 }
530 .vap-wizard-steps .wizard-step-outer {
531 width: calc(100% / 3) !important;
532 }
533 .vap-wizard .wizard-step .wizard-step-footer-bar {
534 width: 100% !important;
535 }
536 @media screen and (max-width: 1280px) {
537 /* show only 2 blocks per row */
538 .vap-wizard-steps .wizard-step-outer {
539 width: calc(100% / 2) !important;
540 }
541 }
542
543 /* invoices */
544 .vap-archive-fileblock {
545 width: calc(100% / 4 - 24px);
546 }
547 @media screen and (max-width: 1280px) {
548 .vap-archive-fileblock {
549 width: calc(100% / 4 - 24px);
550 }
551 }
552 @media screen and (max-width: 970px) {
553 .vap-archive-fileblock {
554 width: calc(100% / 3 - 24px);
555 }
556 }
557 @media screen and (max-width: 860px) {
558 .vap-archive-fileblock {
559 width: calc(100% / 2 - 24px);
560 }
561 }
562 @media screen and (max-width: 520px) {
563 .vap-archive-fileblock {
564 width: 100%;
565 }
566 }
567
568 /* statistics */
569 .row#statistics-wrapper,
570 .row.dashboard-wrapper {
571 display: block;
572 }
573 .dashboard-widgets-container.floating .dashboard-widget .widget-body .widget-floating-box {
574 bottom: 20px;
575 }
576 .dashboard-widgets-container .dashboard-widget {
577 max-width: 100%;
578 background: #fff;
579 min-width: 0;
580 }
581
582 /* weekly calendar */
583 #vapcaldays-bar .field-calendar .input-group button {
584 border-radius: 0;
585 }
586
587 .cal-events-list {
588 margin-top: 0;
589 }
590 .cal-events-list .event-row:first-child,
591 .cal-events-list .no-event {
592 border-top: 0;
593 }
594 .cal-events-list .no-event {
595 padding: 0;
596 margin: 0;
597 }
598
599 .vapallcalhead {
600 margin-top: 0;
601 background: #fff;
602 }
603
604 /* old bootstrap responsiveness */
605 .hidden {
606 display: none;
607 visibility: hidden;
608 }
609 .visible-phone {
610 display: none !important;
611 }
612 .visible-tablet {
613 display: none !important;
614 }
615 .hidden-desktop {
616 display: none !important;
617 }
618 .visible-desktop {
619 display: inherit !important;
620 }
621
622 @media (min-width: 768px) and (max-width: 979px) {
623 .hidden-desktop {
624 display: inherit !important;
625 }
626 .visible-desktop {
627 display: none !important ;
628 }
629 .visible-tablet {
630 display: inherit !important;
631 }
632 .hidden-tablet {
633 display: none !important;
634 }
635 }
636
637 @media (max-width: 767px) {
638 .hidden-desktop {
639 display: inherit !important;
640 }
641 .visible-desktop {
642 display: none !important;
643 }
644 .visible-phone {
645 display: inherit !important;
646 }
647 .hidden-phone {
648 display: none !important;
649 }
650 }
651
652 /* payment parameters */
653 .vikpayparamdiv > .alert {
654 margin-top: 15px !important;
655 margin-bottom: 15px !important;
656 }
657
658 .ccdata.cardnumber .controls {
659 position: relative;
660 }
661 .ccdata.cardnumber img {
662 position: absolute;
663 top: 10px;
664 right: 8px;
665 }
666
667 /* appointment options tables */
668 .order-items-table tr.app-option-child#order-app-opt-fieldset-0 td {
669 border-bottom: 0;
670 }
671 .order-items-table tr.app-option-child:last-of-type td {
672 border-bottom: 1px solid #dee2e6;
673 }
674
675 /* admin custom fields */
676
677 body.com_vikappointments .separator.custom-field {
678 display: block;
679 margin: 24px 0;
680 }
681 body.com_vikappointments .separator.custom-field strong {
682 z-index: 99;
683 }
684 body.com_vikappointments .separator.custom-field hr {
685 margin: 0;
686 }
687
688 /* form vertical layout */
689
690 body.com_vikappointments .form-vertical .control-group .control-label,
691 body.com_vikappointments .form-vertical .control-group .controls {
692 max-width: 100% !important;
693 }
694
695 /* user notes grid */
696
697 body.com_vikappointments .user-notes-container .user-note-box {
698 width: calc(50% - 15px);
699 }
700
701 /* custom mail modal */
702
703 #jmodal-custmail .modal-footer {
704 justify-content: space-between !important;
705 flex-direction: row-reverse !important;
706 }
707 #jmodal-custmail .modal-footer #custmail-cancel {
708 margin-right: 8px;
709 }
710 button#custmail-handle {
711 padding: 3px .5rem;
712 }