PluginProbe ʕ •ᴥ•ʔ
Booking for Appointments and Events Calendar – Amelia / 1.2.31
Booking for Appointments and Events Calendar – Amelia v1.2.31
2.4.9 2.4.8 2.4.7 2.4.6 2.4.5 2.4.4 2.4.3 2.4.2 2.4.1 2.4 trunk 1.2.1 1.2.10 1.2.11 1.2.12 1.2.13 1.2.14 1.2.15 1.2.16 1.2.17 1.2.18 1.2.19 1.2.2 1.2.20 1.2.21 1.2.22 1.2.23 1.2.24 1.2.25 1.2.26 1.2.27 1.2.28 1.2.29 1.2.3 1.2.30 1.2.31 1.2.32 1.2.33 1.2.34 1.2.35 1.2.36 1.2.37 1.2.38 1.2.4 1.2.5 1.2.6 1.2.7 1.2.8 1.2.9 2.0 2.0.1 2.0.2 2.1 2.1.1 2.1.2 2.1.3 2.2 2.2.1 2.3
ameliabooking / assets / less / frontend / dialog-event.less
ameliabooking / assets / less / frontend Last commit date
_animations.less 7 years ago _base.less 4 years ago _customize.less 4 years ago _elements.less 1 year ago _overrides.less 4 years ago _utils.less 6 years ago _variables.less 4 years ago amelia-booking.less 1 year ago booking.less 2 years ago cabinet.less 1 year ago catalog.less 2 years ago dialog-appointment.less 3 years ago dialog-attendees.less 2 years ago dialog-event.less 4 years ago events.less 2 years ago quill.less 4 years ago rtl.less 4 years ago search.less 2 years ago service.less 4 years ago
dialog-event.less
459 lines
1 .amelia-app-booking {
2 #am-cabinet {
3 .am-dialog-event-wrapper {
4
5 .el-checkbox__label {
6 white-space: normal;
7 word-break: break-word;
8 }
9 .el-checkbox {
10 display: flex;
11 align-items: center;
12 }
13 // Element Dialog
14 .el-dialog {
15 overflow: hidden;
16 min-height: 400px;
17
18 .el-dialog__header {
19 padding: @padding-big;
20 }
21
22 .el-dialog__body {
23 padding: 0;
24 }
25 }
26
27 // Dialog
28 .am-dialog-event-inner {
29
30
31 .am-pricing {
32 .am-setting-box {
33 .el-row {
34 display: flex;
35 .el-col {
36 line-height: 16px;
37 }
38 }
39 }
40
41 .am-event-close-after {
42 .el-radio {
43 margin-bottom: @margin-small;
44 }
45
46 .el-form-item {
47 .el-input-number {
48 width: 100%;
49 }
50 margin-bottom: @margin-small;
51 .el-input {
52 margin-bottom: @margin-small;
53 }
54 }
55 }
56 }
57
58 // Loader
59 .am-dialog-loader {
60 background-color: @color-bgr;
61 }
62
63 // Scrollable
64 .am-dialog-scrollable {
65 padding: 0 @padding-big 86px;
66 margin-bottom: 70px;
67
68 // Tabs Content
69 .el-tabs__content {
70 padding-top: @padding-medium;
71 }
72
73 // V-Calendar Column
74 .v-calendar-column {
75 .el-form-item__content, .am-calendar-picker {
76 &:after {
77 display: none;
78 }
79 }
80 }
81
82 // Grey Section
83 .am-section-grey {
84 padding: 0 16px;
85 background: @color-highlight;
86 margin-bottom: 16px;
87 border-radius: 4px;
88
89 &:last-of-type {
90 margin-bottom: 0;
91 }
92
93 .am-recurring-event {
94 .el-row {
95 margin-bottom: 16px;
96 }
97
98 p {
99 margin: 0 0 0 26px;
100 font-size: @small-fs;
101 line-height: 40px;
102
103 @media @less-then-medium {
104 margin: 0;
105 }
106 }
107 }
108
109 .el-checkbox {
110 margin-bottom: @margin-medium;
111 margin-top: @margin-medium;
112 display: inline-flex;
113 align-items: center;
114 }
115
116 p {
117 font-size: 14px;
118 margin: 0;
119 line-height: 40px;
120 }
121 }
122
123 // Event Description
124 .am-event-description {
125 margin-top: @margin-medium;
126
127 .el-form-item {
128 margin: 0;
129 }
130 }
131
132 // Event Dates
133 .am-event-dates {
134 .am-event-date {
135 position: relative;
136 padding-top: @margin-medium;
137 border-bottom: 1px solid @color-divider-gray;
138
139 .el-row:nth-child(2) {
140 margin-bottom: 16px;
141 }
142
143 .el-form-item {
144 margin-bottom: 0;
145 }
146
147 .am-delete-element {
148 position: absolute;
149 top: 22px;
150 right: 0;
151 }
152
153 p {
154 margin: 0;
155 font-size: @small-fs;
156 line-height: 40px;
157 }
158 }
159 }
160
161 // Add Event Date
162 .am-add-event-date {
163 margin-top: @margin-medium;
164
165 button {
166 margin-bottom: @margin-medium;
167 margin-left: 0;
168 }
169 }
170
171 // Border Bottom
172 .am-border-bottom {
173 border-bottom: 1px solid @color-divider-gray;
174 padding: @padding-medium 0 0;
175
176 .el-input-number {
177 width: 100%;
178 }
179
180 .el-row {
181 margin-bottom: 16px;
182 }
183
184 .el-checkbox {
185 margin-bottom: @margin-medium;
186 .el-checkbox__input {
187 line-height: 40px;
188 }
189 }
190
191 p {
192 margin: 0;
193 font-size: @small-fs;
194 line-height: 40px;
195 }
196 }
197
198 // Tags
199 .el-select__tags {
200 top: 50%;
201 overflow: visible;
202 white-space: normal;
203 flex-wrap: wrap;
204 }
205
206 .am-event-period-start {
207 @media @less-then-medium {
208 padding-bottom: 16px;
209 }
210 }
211 }
212
213 // Footer
214 .am-dialog-footer {
215 box-sizing: border-box;
216 position: absolute;
217 width: 100%;
218 bottom: 0;
219 height: 70px;
220 border-top: 2px solid #E4E7ED;
221 display: flex;
222 align-items: center;
223 padding: 0 24px;
224
225 .am-dialog-confirmation {
226 padding: @padding-medium @padding-big;
227 z-index: 1;
228 position: absolute;
229 bottom: 73px;
230 left:0px;
231 background: @color-white;
232 width: 100%;
233 border-top: 1px solid @color-divider-gray;
234 border-bottom: none;
235 box-sizing: border-box;
236
237 form.el-form {
238 padding: 0 !important;
239 }
240
241 @media @less-then-small {
242 z-index: 1;
243 border-bottom: 1px solid @color-divider-gray;
244 bottom: 72px;
245 }
246 }
247
248 .am-dialog-footer-actions {
249 width: 100%;
250
251 .el-row {
252 width: 100%;
253
254 .align-left {
255 text-align: left;
256 }
257
258 .align-right {
259 text-align: right;
260 }
261
262 button {
263 margin: 0;
264
265 &:last-of-type {
266 margin-left: 8px;
267 }
268 }
269 }
270 }
271 }
272
273
274 // Labels
275 label, p {
276 font-size: 14px;
277 }
278
279 // Spinner
280 .el-form-item {
281 .is-spinner {
282 width: 22px;
283 height: 22px;
284 display: none;
285 position: absolute;
286 right: 35px;
287 top: 8px;
288 stroke: @color-text-second;
289
290 &.is-spinner-right {
291 right: 12px;
292 }
293 }
294
295 &.active {
296 .is-spinner {
297 display: block;
298 }
299 }
300 }
301
302 // Customize
303 .am-event-colors {
304 padding: 0 0 @padding-medium;
305 margin: 0 0 @margin-medium;
306 border-bottom: 1px solid @color-divider-gray;
307
308 .am-event-color-selection > div:first-child {
309 margin-top: @margin-small;
310 margin-bottom: @margin-medium;
311 }
312
313 .am-event-swatches {
314 display: inline-block;
315 vertical-align: middle;
316 margin-left: @margin-small;
317
318 span {
319 cursor: pointer;
320 display: inline-block;
321 width: 24px;
322 height: 24px;
323 border-radius: 50%;
324 position: relative;
325 margin-right: @margin-small;
326
327 &.color-active {
328 &:before {
329 position: absolute;
330 top: 0;
331 bottom: 0;
332 left: 0;
333 right: 0;
334 color: #ffffff;
335 text-align: center;
336 font-family: element-icons;
337 content: "\e6da";
338 line-height: 1.9;
339 }
340 }
341 }
342 }
343
344 .am-event-swatches-first {
345 margin-top: 8px;
346 margin-left: 0;
347 }
348
349 .am-event-custom-color {
350 margin-top: 8px;
351 margin-bottom: 0;
352 width: 120px;
353 }
354
355 .el-radio {
356 width: 100%;
357 }
358 }
359
360 // Settings
361 .am-entity-settings {
362 .am-setting-box {
363 border: 1px solid @color-divider-gray;
364 border-radius: 3px;
365 margin-bottom: @margin-big;
366 position: relative;
367 line-height: 0.8;
368
369 .el-collapse-item__header i {
370 right: 16px !important;
371 }
372
373 .am-setting-box:last-of-type {
374 margin-bottom: 0;
375 }
376
377 &.el-collapse-item {
378 padding: 0;
379 }
380
381 &.el-collapse-item.is-active {
382 background-color: #ffffff;
383 }
384
385 &.am-switch-box {
386 padding: 13px;
387
388 p {
389 font-size: @small-fs;
390 }
391
392 .el-col {
393 min-height: 16px;
394 }
395
396 .align-right {
397 text-align: right;
398 }
399 }
400
401 .el-row {
402 display: flex;
403 .el-col {
404 line-height: 16px;
405 }
406 }
407
408 p {
409 margin: 0;
410 }
411
412 .el-collapse-item__header {
413 padding: @padding-medium;
414 vertical-align: middle;
415
416 &:hover {
417 background-color: @color-highlight;
418 }
419
420 i {
421 position: absolute;
422 right: 8px;
423 //top: 0;
424 color: @color-text-second;
425
426 &.el-icon-circle-check {
427 color: @color-blue;
428 right: 40px;
429 position: absolute;
430 }
431 }
432
433 img, svg {
434 vertical-align: middle;
435 max-width: 60px;
436 //width: 60px;
437 max-height: 16px;
438 }
439 }
440
441 .el-collapse-item__wrap {
442 padding: 0 @padding-medium;
443 margin: @margin-medium 0;
444
445 .el-row {
446 margin-bottom: @margin-big;
447 }
448
449 .el-form-item:last-of-type {
450 margin-bottom: 0;
451 }
452 }
453 }
454 }
455 }
456 }
457 }
458 }
459