PluginProbe
Booking Calendar / 11.0
Booking Calendar v11.0
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 / includes / page-setup / _src / setup_page.css

setup_page.css in Booking Calendar 11.0, at includes/page-setup/_src/setup_page.css

323 lines 11.1 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 /* ------------------------------------------------------------------------------------------------------------------ */
2 /* Hide Top Menu bar for Submenu items, if we do not use the left navigation menu */
3 .wpbc_top_tabs_sub_menu {
4 display: none;
5 }
6 /* Hide Top Right Banner for purchase with discount in Setup page */
7 .wpbc_header_news {
8 display: none !important;
9 }
10 /* Loader Spinner and Text for Main Container (including calendar) */
11 .wpbc_calendar_loading {
12 width:95%;
13 text-align: center;
14 margin:2em 0;
15 font-size: 1.2em;
16 font-weight: 600;
17 }
18 .wpbc_calendar_loading .wpbc_icn_autorenew::before{
19 font-size: 1.2em;
20 }
21 /* ------------------------------------------------------------------------------------------------------------------ */
22 /* == Page Sections Structure == */
23 /* ------------------------------------------------------------------------------------------------------------------ */
24 .wpbc_ajx_page__container {
25 display: flex;
26 flex-flow: row wrap;
27 justify-content: flex-start;
28 align-items: flex-start;
29 margin: 5px 0 0;
30 }
31 .wpbc_ajx_page__container .wpbc_ajx_page__section_left {
32 flex: 0 1 200px;
33 display: flex;
34 flex-flow: row wrap;
35 justify-content: flex-start;
36 align-items: flex-start;
37 margin: 0 30px 10px 0;
38 }
39 .wpbc_ajx_page__container .wpbc_ajx_page__section_main {
40 flex: 1 1 50%;
41 display: flex;
42 flex-flow: row wrap;
43 justify-content: flex-start;
44 align-items: flex-start;
45 margin: 0 0 10px;
46 }
47 .wpbc_ajx_page__container .wpbc_ajx_page__section_right {
48 flex: 0 0 280px;
49 display: flex;
50 flex-flow: column wrap;
51 justify-content: flex-start;
52 align-items: flex-end;
53 margin: 0 0 10px 30px;
54 }
55 .wpbc_ajx_page__container .wpbc_ajx_page__section_footer{
56 flex: 1 1 100%;
57 display: flex;
58 flex-flow: row wrap;
59 justify-content: flex-start;
60 align-items: flex-start;
61 margin: 10px 0;
62 }
63 /* ------------------------------------------------------------------------------------------------------------------ */
64 /* == Ordering and Size on Mobile == */
65 /* ------------------------------------------------------------------------------------------------------------------ */
66 @media screen and (max-width: 960px) {
67 .wpbc_ajx_page__container .wpbc_setup_wizard_page__section_left {
68 flex: 1 1 100%;
69 margin: 20px 0;
70 order: 3
71 }
72 }
73 @media (max-width: 782px) {
74 .wpbc_ajx_page__container .wpbc_ajx_page__section {
75 flex: 1 1 100%;
76 margin: 0 0 20px 0;
77 }
78 .wpbc_ajx_page__container .wpbc_setup_wizard_page__section_right {
79 order: 1
80 }
81 .wpbc_ajx_page__container .wpbc_setup_wizard_page__section_main {
82 order: 2
83 }
84 .wpbc_ajx_page__container .wpbc_setup_wizard_page__section_left {
85 order: 3
86 }
87 .wpbc_ajx_page__container .wpbc_setup_wizard_page__section_footer{
88 order: 99;
89 }
90 }
91 /* ------------------------------------------------------------------------------------------------------------------ */
92 /* == Main Section Div == */
93 /* ------------------------------------------------------------------------------------------------------------------ */
94 .wpbc__container_place__footer_buttons,
95 .wpbc_page_main_section.wpbc_container_booking_form {
96 display: flex;
97 flex-flow: row wrap;
98 justify-content: center;
99 align-items: flex-start;
100 flex: 0 1 85%;
101
102 margin: 0 auto;
103 margin-top:-15px;
104
105 font-size: 15px;
106 line-height: 175%;
107 }
108
109 /* ------------------------------------------------------------------------------------------------------------------ */
110 /* == Footer Section Div == */
111 /* ------------------------------------------------------------------------------------------------------------------ */
112 .wpbc__container_place__footer_buttons{
113 margin-top:10px;
114 }
115 .wpbc__container_place__footer_buttons .wpbc__form__div {
116 width:100%;
117 }
118 /* Fix buttons position text*/
119 .wpbc_setup_wizard_page__section_footer .wpbc_container.wpbc_container_booking_form .wpbc_button_light,
120 .wpbc_setup_wizard_page__section_footer .wpbc_container .wpbc_button_light{
121 padding: 0 1em;
122 line-height: 2.21;
123 align-items: first baseline;
124 }
125 /* required for rotating around center dot */
126 .wpbc_setup_wizard_page__section_footer .wpbc_container .wpbc_button_light .wpbc_spin{
127 line-height: 50%;
128 align-self: center;
129 }
130 @media screen and (max-width: 782px) {
131 .wpbc__container_place__footer_buttons.wpbc_container.wpbc_container_booking_form {
132 flex: 1 1 100%;
133 }
134 }
135
136 /* Small links at the bottom of the wizard */
137 .wpbc_exit_link_small {
138 width:100%;
139 display: flex;
140 flex-flow: column wrap;
141 justify-content: center;
142 align-items: center;
143 }
144 .wpbc_exit_link_small a {
145 font-size:14px;
146 color:#888;
147 text-decoration:underline;
148 }
149 .wpbc_exit_link_small a:active,
150 .wpbc_exit_link_small a:hover {
151 color:#555;
152 text-decoration:underline;
153 }
154 .wpbc_exit_link_small a.wpbc_button_danger {
155 color: #c18e8e;
156 }
157 .wpbc_exit_link_small a.wpbc_button_danger:active,
158 .wpbc_exit_link_small a.wpbc_button_danger:hover {
159 color:#e65d59;
160 }
161
162 /* ------------------------------------------------------------------------------------------------------------------ */
163 /* Timeline Steps: moved -> ../includes/__css/client/form__steps_timeline.css */
164 /* ------------------------------------------------------------------------------------------------------------------ */
165
166 /* ------------------------------------------------------------------------------------------------------------------ */
167 /* Sections Content: */
168 /* ------------------------------------------------------------------------------------------------------------------ */
169
170 .wpbc_swp_section h1.wpbc_swp_section_header {
171 font-weight: 600;
172 font-size: 26px;
173 margin-bottom: 0px;
174 width: 100%;
175 }
176
177 .wpbc_swp_section p.wpbc_swp_section_header_description {
178 font-size: 12px;
179 margin-top: 0;
180 }
181
182 .wpbc_swp_section__welcome h1.wpbc_swp_section_header {
183 text-align: center;
184 margin: 0 auto 10px;
185 }
186 div.wpbc_container.wpbc_form .wpbc_swp_section label {
187 margin: 15px 0 8px;
188 }
189 /* ------------------------------------------------------------------------------------------------------------------ */
190 /* TODO: delete this */
191
192 /* ------------------------------------------------------------------------------------------------------------------ */
193 /* == Section Windows == */
194 /* ------------------------------------------------------------------------------------------------------------------ */
195
196 .wpbc_widgets {
197 width: 100%;
198 display: flex;
199 flex-flow: column wrap;
200 justify-content: flex-start;
201 align-items: flex-start;
202 }
203
204 .wpbc_widgets .wpbc_widget {
205 margin: 0 0 20px;
206 width: 100%;
207 flex: 1 1 100%;
208 border: 1px solid #ccc;
209 border-radius: 0 0 2px 2px;
210 }
211 .wpbc_widget .wpbc_widget_header {
212 width: 100%;
213 height: 44px;
214 border-bottom: 1px solid #ccc;
215 background: #fff;
216 font-weight: 600;
217 text-shadow: none;
218 display: flex;
219 flex-flow: row nowrap;
220 justify-content: flex-start;
221 align-items: center;
222 }
223 .wpbc_widget .wpbc_widget_header .wpbc_widget_header_text {
224 flex: 1 1 auto;
225 padding: 0 15px;
226 }
227 .wpbc_widget .wpbc_widget_header .wpbc_widget_header_settings_link {
228 flex: 0 0 auto;
229 margin-left: auto;
230 border-left: 1px solid #ccc;
231 padding: 5px 10px;
232 color: #0e70b7;
233 }
234 .wpbc_widget .wpbc_widget_content {
235 padding: 10px 15px;
236 }
237 .wpbc_widget_preview_booking_form.wpbc_widget .wpbc_widget_content {
238 padding-bottom: 70px;
239 }
240 /* ------------------------------------------------------------------------------------------------------------------ */
241 /* == Container for shortcodes == e.g.: [booking resource_id=1] */
242 /* ------------------------------------------------------------------------------------------------------------------ */
243 .wpbc_shortcode_container {
244 width: 100%;
245 max-width: 880px;
246 min-width: 341px;
247 margin: auto;
248 /*margin-top: calc(-1.7em - calc(0.25em + 8px));*/
249 }
250 /* Stripes Background */
251 .wpbc_widget_preview_booking_form .wpbc_widget_content {
252 /*background: repeating-linear-gradient(135deg, #fff, #fff 4px, #eaeaeb 4px, #eaeaeb 8px);*/
253 /*background: repeating-linear-gradient(135deg, #fff, #fff 4px, #f5f5ef 4px, #f5f5cf 8px);*/
254 /*background: repeating-linear-gradient(-45deg, #eee 0 3px, var(--wpbc_cal-main-background-color,#fff) 3px 8px);*/
255 /*background: repeating-linear-gradient(-45deg, #f9f8f7 0 7px, var(--wpbc_cal-main-background-color,#fff) 7px 12px);*/
256 /*background: repeating-linear-gradient(-45deg, #f9f9f8 0 3px, var(--wpbc_cal-main-background-color,#fff) 3px 5px);*/
257 background: repeating-linear-gradient(-45deg,#f9f9f8 0 3px, #fff 3px 5px);
258 }
259 /* Mobile Buttons */
260 .wpbc_section_preview_mobile_btn_bar .wpbc_preview_a{
261 text-decoration: none;
262 outline: none;
263 box-shadow: none;
264 margin: 0 5px;
265 color: #6b96ce;
266 }
267 .wpbc_section_preview_mobile_btn_bar .wpbc_preview_a.active,
268 .wpbc_section_preview_mobile_btn_bar .wpbc_preview_a.active:focus{
269 color: #52595f;
270 }
271 .wpbc_section_preview_mobile_btn_bar .wpbc_preview_a:hover,
272 .wpbc_section_preview_mobile_btn_bar .wpbc_preview_a:focus {
273 color: #2f76d3;
274 text-decoration: none;
275 outline: none;
276 box-shadow: none;
277 }
278 .wpbc_section_preview_mobile_btn_bar .wpbc_preview_icon::before{
279 font-size: 20px;
280 }
281 .wpbc_section_preview_mobile_btn_bar .wpbc_preview_icon.wpbc-bi-display::before,
282 .wpbc_section_preview_mobile_btn_bar .wpbc_preview_icon.wpbc_icn_computer::before{
283 font-size: 21px;
284 }
285 .wpbc_message_wrapper.wpbc__version__free {
286 /*display: none;*/
287 }
288 /* Dark theme */
289 .wpbc_center_preview.wpbc_theme_dark_1,
290 .wpbc_widget_preview_booking_form .wpbc_widget_content.wpbc_theme_dark_1 {
291 /*Black Color*/
292 background: #272727;
293 background: repeating-linear-gradient(-45deg, #383838 0 3px,#2f2f2f 3px 5px);
294 color:#fff;
295 }
296
297 .wpbc_widget_preview_booking_form .wpbc_widget_content.wpbc_theme_dark_1 .wpbc-settings-notice {
298 color: #d7d7ca;
299 background: #595959;
300 box-shadow: 0 1px 3px #313131;
301 border: 0;
302 border-left: 4px solid #9580aa;
303 }
304
305 /* ------------------------------------------------------------------------------------------------------------------ */
306 /* == Section for Appointment type selection at Step #4 == */
307 /* ------------------------------------------------------------------------------------------------------------------ */
308 .wpbc_container_booking_form .wpbc__field .wpbc_ui_booking_timeslot_picker__get_on_off__div {
309 padding-left: 15px;
310 }
311
312 .wpbc_container_booking_form .wpbc__field .booking_appointments_type__get_on_off label.wpbc-form-radio,
313 .wpbc_container_booking_form .wpbc__field .booking_appointments_type__get_on_off label.wpbc-form-radio:hover{
314 flex-flow: row nowrap;
315 justify-content: flex-start;
316 align-items: center;
317 margin: 10px 0;
318 font-weight: 400;
319 }
320 .wpbc_container_booking_form .wpbc__field .booking_appointments_type__get_on_off .wpbc-form-radio input {
321 margin: 0 10px 0 5px;
322 }
323