@meetelise/chat 1.20.97 → 1.20.99
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/package.json +1 -1
- package/public/dist/index.js +614 -581
- package/src/WebComponent/Scheduler/time-picker.ts +22 -32
- package/src/WebComponent/Scheduler/tour-scheduler.ts +95 -468
- package/src/WebComponent/Scheduler/tour-type-option.ts +1 -1
- package/src/WebComponent/Scheduler/tourSchedulerStyles.ts +401 -0
- package/src/WebComponent/launcher/Launcher.ts +25 -1
- package/src/WebComponent/me-chat.ts +29 -7
- package/src/WebComponent/me-select.ts +6 -2
- package/src/WebComponent/pubnub-chat-styles.ts +11 -2
- package/src/WebComponent/pubnub-chat.ts +15 -4
|
@@ -26,9 +26,6 @@ export class TimePicker extends LitElement {
|
|
|
26
26
|
@property({ type: Boolean })
|
|
27
27
|
selectedDateExists = false;
|
|
28
28
|
|
|
29
|
-
@property({ type: Boolean })
|
|
30
|
-
horizontal = false;
|
|
31
|
-
|
|
32
29
|
@state()
|
|
33
30
|
private selected?: TimePickerOption;
|
|
34
31
|
|
|
@@ -48,30 +45,12 @@ export class TimePicker extends LitElement {
|
|
|
48
45
|
}
|
|
49
46
|
|
|
50
47
|
#optionContainer {
|
|
51
|
-
display:
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
margin-left: 14px;
|
|
56
|
-
column-gap: 14px;
|
|
57
|
-
row-gap: 19px;
|
|
58
|
-
min-width: 200px;
|
|
59
|
-
max-height: 310px;
|
|
48
|
+
display: flex;
|
|
49
|
+
flex-wrap: wrap;
|
|
50
|
+
max-width: 200px;
|
|
51
|
+
max-height: 320px;
|
|
60
52
|
overflow-y: auto;
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
#optionContainer.horizontal {
|
|
64
|
-
grid-template-columns: unset;
|
|
65
|
-
grid-auto-rows: unset;
|
|
66
|
-
max-height: unset;
|
|
67
|
-
overflow-y: unset;
|
|
68
|
-
grid-template-rows: 40px 40px;
|
|
69
|
-
grid-auto-columns: 85px;
|
|
70
|
-
grid-auto-flow: column;
|
|
71
|
-
row-gap: 13px;
|
|
72
|
-
column-gap: 14px;
|
|
73
|
-
max-width: 90%;
|
|
74
|
-
overflow-x: auto;
|
|
53
|
+
gap: 8px;
|
|
75
54
|
}
|
|
76
55
|
|
|
77
56
|
.option {
|
|
@@ -80,7 +59,7 @@ export class TimePicker extends LitElement {
|
|
|
80
59
|
justify-content: center;
|
|
81
60
|
align-items: center;
|
|
82
61
|
height: 40px;
|
|
83
|
-
width:
|
|
62
|
+
width: 80px;
|
|
84
63
|
padding: 11px 11px 11px 14px;
|
|
85
64
|
background: #e7e7e7;
|
|
86
65
|
border: 1px solid #ffffff;
|
|
@@ -107,6 +86,21 @@ export class TimePicker extends LitElement {
|
|
|
107
86
|
#noAvailabilityText.horizontal {
|
|
108
87
|
margin-left: 0;
|
|
109
88
|
}
|
|
89
|
+
|
|
90
|
+
@media screen and (max-width: 1200px) {
|
|
91
|
+
#optionContainer {
|
|
92
|
+
display: flex;
|
|
93
|
+
flex-wrap: wrap;
|
|
94
|
+
justify-content: center;
|
|
95
|
+
align-items: center;
|
|
96
|
+
max-width: none;
|
|
97
|
+
max-height: 250px;
|
|
98
|
+
overflow-x: auto;
|
|
99
|
+
gap: 8px;
|
|
100
|
+
|
|
101
|
+
width: 100%;
|
|
102
|
+
}
|
|
103
|
+
}
|
|
110
104
|
`;
|
|
111
105
|
|
|
112
106
|
render(): TemplateResult {
|
|
@@ -121,7 +115,6 @@ export class TimePicker extends LitElement {
|
|
|
121
115
|
? html`
|
|
122
116
|
<div
|
|
123
117
|
id="optionContainer"
|
|
124
|
-
class=${this.horizontal ? "horizontal" : ""}
|
|
125
118
|
@click="${(e: MouseEvent) => {
|
|
126
119
|
const target = e.target as HTMLElement | undefined;
|
|
127
120
|
|
|
@@ -164,10 +157,7 @@ export class TimePicker extends LitElement {
|
|
|
164
157
|
)}
|
|
165
158
|
</div>
|
|
166
159
|
`
|
|
167
|
-
: html` <div
|
|
168
|
-
id="noAvailabilityText"
|
|
169
|
-
class=${this.horizontal ? "horizontal" : ""}
|
|
170
|
-
>
|
|
160
|
+
: html` <div id="noAvailabilityText">
|
|
171
161
|
${this.selectedDateExists
|
|
172
162
|
? html`<p>No available appointments for this day</p>`
|
|
173
163
|
: html`<p>
|