Commit b6e4f6eaad583373e527939b6f99c60b901e9413

Authored by Shikha Mishra
1 parent e05668b28f

Check user's device type and set link of app if user start or join live class through mobile

Showing 1 changed file with 35 additions and 16 deletions   Show diff stats
src/pages/Dashboard/LiveOnlineClass.vue
1 <template> 1 <template>
2 <div class="body-color"> 2 <div class="body-color">
3 <!-- LOADER --> 3 <!-- LOADER -->
4 <div class="loader" v-if="showLoader"> 4 <div class="loader" v-if="showLoader">
5 <v-progress-circular indeterminate color="white"></v-progress-circular> 5 <v-progress-circular indeterminate color="white"></v-progress-circular>
6 </div> 6 </div>
7 7
8 <!-- SNACKBAR --> 8 <!-- SNACKBAR -->
9 <v-snackbar 9 <v-snackbar
10 :timeout="timeout" 10 :timeout="timeout"
11 :top="y === 'top'" 11 :top="y === 'top'"
12 :right="x === 'right'" 12 :right="x === 'right'"
13 :vertical="mode === 'vertical'" 13 :vertical="mode === 'vertical'"
14 v-model="snackbar" 14 v-model="snackbar"
15 :color="snackbarColor" 15 :color="snackbarColor"
16 > 16 >
17 {{ text }} 17 {{ text }}
18 <v-spacer></v-spacer> 18 <v-spacer></v-spacer>
19 <v-btn flat text @click="snackbar = false">X</v-btn> 19 <v-btn flat text @click="snackbar = false">X</v-btn>
20 </v-snackbar> 20 </v-snackbar>
21 21
22 <v-container grid-list-xl class="pt-0"> 22 <v-container grid-list-xl class="pt-0">
23 <v-layout row wrap class="mt-1"> 23 <v-layout row wrap class="mt-1">
24 <!-- if logged in user is parent --> 24 <!-- if logged in user is parent -->
25 <v-flex xs12 sm12 md9 v-if=" $store.state.role === 'PARENT' "> 25 <v-flex xs12 sm12 md9 v-if=" $store.state.role === 'PARENT' ">
26 <v-layout column> 26 <v-layout column>
27 <!-- HEADING --> 27 <!-- HEADING -->
28 <v-flex> 28 <v-flex>
29 <div 29 <div
30 class="title side-bar-color font-weight-bold" 30 class="title side-bar-color font-weight-bold"
31 >Live Online Classes - {{$route.query.chapterName}}</div> 31 >Live Online Classes - {{$route.query.chapterName}}</div>
32 <!-- <div class="subheading grey--text lighten-1">{{liveLink}}</div> --> 32 <!-- <div class="subheading grey--text lighten-1">{{liveLink}}</div> -->
33 <!-- <div 33 <!-- <div
34 class="subheading grey--text lighten-1" 34 class="subheading grey--text lighten-1"
35 >The session started at 1:00 there is 1 moderator</div>--> 35 >The session started at 1:00 there is 1 moderator</div>-->
36 </v-flex> 36 </v-flex>
37 37
38 <!-- JOIN OR END SESSION --> 38 <!-- JOIN OR END SESSION -->
39 <v-flex> 39 <v-flex>
40 <div> 40 <div>
41 <v-btn 41 <v-btn
42 round 42 round
43 class="open-dialog-button" 43 class="open-dialog-button"
44 dark 44 dark
45 v-if="studentBtn" 45 v-if="studentBtn"
46 @click="showLoader = true;startChat();" 46 @click="showLoader = true;startChat();"
47 >{{studentBtn}}</v-btn> 47 >{{studentBtn}}</v-btn>
48 <span class="subheading grey--twxt lighten-1" v-else>Session hasnt started yet</span> 48 <span class="subheading grey--twxt lighten-1" v-else>Session hasnt started yet</span>
49 </div> 49 </div>
50 </v-flex> 50 </v-flex>
51 <v-flex id="studentClone"> 51 <v-flex id="studentClone">
52 <div id="jitsi-container"></div> 52 <div id="jitsi-container"></div>
53 </v-flex> 53 </v-flex>
54 </v-layout> 54 </v-layout>
55 </v-flex> 55 </v-flex>
56 56
57 <!-- if logged in user is teacher --> 57 <!-- if logged in user is teacher -->
58 <v-flex xs12 sm12 md12 v-else> 58 <v-flex xs12 sm12 md12 v-else>
59 <v-layout column> 59 <v-layout column>
60 <!-- HEADING --> 60 <!-- HEADING -->
61 <v-flex> 61 <v-flex>
62 <div 62 <div
63 class="title side-bar-color font-weight-bold" 63 class="title side-bar-color font-weight-bold"
64 >Live Online Classes - {{$route.query.chapterName}}</div> 64 >Live Online Classes - {{$route.query.chapterName}}</div>
65 <!-- <div class="subheading grey--text lighten-1"></div> --> 65 <!-- <div class="subheading grey--text lighten-1"></div> -->
66 <!-- <div 66 <!-- <div
67 class="subheading grey--text lighten-1" 67 class="subheading grey--text lighten-1"
68 >The session started at 1:00 there is 1 moderator</div>--> 68 >The session started at 1:00 there is 1 moderator</div>-->
69 </v-flex> 69 </v-flex>
70 70
71 <!-- JOIN OR END SESSION --> 71 <!-- JOIN OR END SESSION -->
72 <v-flex> 72 <v-flex>
73 <div> 73 <div>
74 <v-btn 74 <v-btn
75 round 75 round
76 class="open-dialog-button" 76 class="open-dialog-button"
77 dark 77 dark
78 @click="showLoader = true;startChat()" 78 @click="showLoader = true;startChat()"
79 >Start Session</v-btn> 79 >Start Session</v-btn>
80 </div> 80 </div>
81 </v-flex> 81 </v-flex>
82 <v-flex id="teacherClone"> 82 <v-flex id="teacherClone">
83 <div id="jitsi-container"></div> 83 <div id="jitsi-container"></div>
84 </v-flex> 84 </v-flex>
85 </v-layout> 85 </v-layout>
86 </v-flex> 86 </v-flex>
87 87
88 <v-spacer></v-spacer> 88 <v-spacer></v-spacer>
89 89
90 <!-- COURSES SIDE BAR- positioned to the right of the page --> 90 <!-- COURSES SIDE BAR- positioned to the right of the page -->
91 <!-- <v-flex xs3> 91 <!-- <v-flex xs3>
92 <v-card class="elevation-0 card-border" height="100%"> 92 <v-card class="elevation-0 card-border" height="100%">
93 <CoursesSideBar></CoursesSideBar> 93 <CoursesSideBar></CoursesSideBar>
94 </v-card> 94 </v-card>
95 </v-flex>--> 95 </v-flex>-->
96 </v-layout> 96 </v-layout>
97 </v-container> 97 </v-container>
98 </div> 98 </div>
99 </template> 99 </template>
100 <script> 100 <script>
101 import AllApiCalls from "@/Services/AllApiCalls.js"; 101 import AllApiCalls from "@/Services/AllApiCalls.js";
102 import http from "@/Services/http.js"; 102 import http from "@/Services/http.js";
103 import moment from "moment"; 103 import moment from "moment";
104 import Meet from "@/pages/Meet/meet.vue"; 104 import Meet from "@/pages/Meet/meet.vue";
105 import CoursesSideBar from "@/pages/Common/CoursesSideBar.vue"; 105 import CoursesSideBar from "@/pages/Common/CoursesSideBar.vue";
106 export default { 106 export default {
107 mixins: [AllApiCalls], 107 mixins: [AllApiCalls],
108 components: { 108 components: {
109 CoursesSideBar, 109 CoursesSideBar,
110 }, 110 },
111 data() { 111 data() {
112 return { 112 return {
113 startLiveSession: "", 113 startLiveSession: "",
114 studentBtn: "", 114 studentBtn: "",
115 115
116 // DATA TABLE 116 // DATA TABLE
117 search: "", 117 search: "",
118 pagination: { 118 pagination: {
119 rowsPerPage: 10, 119 rowsPerPage: 10,
120 }, 120 },
121 liveOnlineHeaders: [ 121 liveOnlineHeaders: [
122 { 122 {
123 text: "Playback", 123 text: "Playback",
124 value: "attachementUrl", 124 value: "attachementUrl",
125 sortable: false, 125 sortable: false,
126 align: "center", 126 align: "center",
127 }, 127 },
128 { 128 {
129 text: "Meeting", 129 text: "Meeting",
130 align: "center", 130 align: "center",
131 sortable: false, 131 sortable: false,
132 value: "", 132 value: "",
133 }, 133 },
134 { 134 {
135 text: "Recording", 135 text: "Recording",
136 value: "", 136 value: "",
137 sortable: false, 137 sortable: false,
138 align: "center", 138 align: "center",
139 }, 139 },
140 { 140 {
141 text: "Description Preview", 141 text: "Description Preview",
142 value: "", 142 value: "",
143 sortable: false, 143 sortable: false,
144 align: "center", 144 align: "center",
145 }, 145 },
146 { text: "Date", value: "", sortable: false, align: "center" }, 146 { text: "Date", value: "", sortable: false, align: "center" },
147 { text: "Duration", value: "", sortable: false, align: "center" }, 147 { text: "Duration", value: "", sortable: false, align: "center" },
148 { text: "Toolbar", value: "", sortable: false, align: "center" }, 148 { text: "Toolbar", value: "", sortable: false, align: "center" },
149 ], 149 ],
150 liveOnlineItems: [], 150 liveOnlineItems: [],
151 151
152 // JITSI CONTAINER 152 // JITSI CONTAINER
153 liveLink: "", 153 liveLink: "",
154 token: "", 154 token: "",
155 selectStudents: {}, 155 selectStudents: {},
156 classRules: [(v) => !!v || " Class Name is required"], 156 classRules: [(v) => !!v || " Class Name is required"],
157 sectionRules: [(v) => !!v || " Section Name is required"], 157 sectionRules: [(v) => !!v || " Section Name is required"],
158 addclass: [], 158 addclass: [],
159 addSection: [], 159 addSection: [],
160 loading: false, 160 loading: false,
161 room: "", 161 room: "",
162 username: "", 162 username: "",
163 roomPassword: "", 163 roomPassword: "",
164 counter: 0, 164 counter: 0,
165 appLink: "",
165 }; 166 };
166 }, 167 },
167 methods: { 168 methods: {
168 async startChat() { 169 async startChat() {
169 if (this.$store.state.role === "PARENT") { 170 if (this.$store.state.role === "PARENT") {
170 if (this.counter == 0) { 171 if (this.counter == 0) {
171 // console.log("enter start chat"); 172 // console.log("enter start chat");
172 this.startConference(); 173 const isMobile = /iPhone|iPad|iPod|Android/i.test(
173 this.counter += 1; 174 navigator.userAgent
175 );
176 if (isMobile) {
177 // console.log("==PARENT=appLink==", this.appLink);
178 window.open(this.appLink);
179 } else {
180 this.startConference();
181 this.counter += 1;
182 }
174 } 183 }
175 } 184 }
176 if (this.$store.state.role === "TEACHER") { 185 if (this.$store.state.role === "TEACHER") {
177 if (this.counter == 0) { 186 if (this.counter == 0) {
178 this.createRoom(); 187 this.createRoom();
179 this.counter += 1; 188 this.counter += 1;
180 } 189 }
181 } 190 }
182 }, 191 },
183 // JITSI CONTAINER 192 // JITSI CONTAINER
184 startConference() { 193 startConference() {
185 // console.log("yes session started"); 194 // console.log("yes session started");
186 var _this = this; 195 var _this = this;
187 try { 196 try {
188 const domain = "meet.intrack.in"; 197 const domain = "meet.intrack.in";
189 const options = { 198 const options = {
190 audioInput: "<deviceLabel>", 199 audioInput: "<deviceLabel>",
191 audioOutput: "<deviceLabel>", 200 audioOutput: "<deviceLabel>",
192 videoInput: "<deviceLabel>", 201 videoInput: "<deviceLabel>",
193 prejoinPageEnabled: false, 202 prejoinPageEnabled: false,
194 roomName: this.room, 203 roomName: this.room,
195 height: 500, 204 height: 500,
196 parentNode: document.getElementById("jitsi-container"), 205 parentNode: document.getElementById("jitsi-container"),
197 interfaceConfigOverwrite: { 206 interfaceConfigOverwrite: {
198 filmStripOnly: false, 207 filmStripOnly: false,
199 SHOW_PROMOTIONAL_CLOSE_PAGE: false, 208 SHOW_PROMOTIONAL_CLOSE_PAGE: false,
200 SHOW_POWERED_BY: false, 209 SHOW_POWERED_BY: false,
201 SHOW_JITSI_WATERMARK: false, 210 SHOW_JITSI_WATERMARK: false,
202 TOOLBAR_BUTTONS: [ 211 TOOLBAR_BUTTONS: [
203 "microphone", 212 "microphone",
204 "camera", 213 "camera",
205 "closedcaptions", 214 "closedcaptions",
206 "desktop", 215 "desktop",
207 "fullscreen", 216 "fullscreen",
208 "fodeviceselection", 217 "fodeviceselection",
209 "hangup", 218 "hangup",
210 "profile", 219 "profile",
211 "info", 220 "info",
212 "chat", 221 "chat",
213 "recording", 222 "recording",
214 "livestreaming", 223 "livestreaming",
215 "etherpad", 224 "etherpad",
216 "sharedvideo", 225 "sharedvideo",
217 "settings", 226 "settings",
218 "raisehand", 227 "raisehand",
219 "videoquality", 228 "videoquality",
220 "filmstrip", 229 "filmstrip",
221 "invite", 230 "invite",
222 "feedback", 231 "feedback",
223 "stats", 232 "stats",
224 "shortcuts", 233 "shortcuts",
225 "tileview", 234 "tileview",
226 ], 235 ],
227 }, 236 },
228 configOverwrite: { 237 configOverwrite: {
229 disableSimulcast: false, 238 disableSimulcast: false,
230 }, 239 },
231 teacherName: "", 240 teacherName: "",
232 room: "", 241 room: "",
233 }; 242 };
234 _this.api = new JitsiMeetExternalAPI(domain, options); 243 _this.api = new JitsiMeetExternalAPI(domain, options);
235 // console.log("this.api ", this.api); 244 // console.log("this.api ", this.api);
236 _this.api.addEventListener("videoConferenceJoined", () => { 245 _this.api.addEventListener("videoConferenceJoined", () => {
237 this.showLoader = false; 246 this.showLoader = false;
238 setTimeout(() => { 247 setTimeout(() => {
239 _this.api.executeCommand("displayName", _this.username); 248 _this.api.executeCommand("displayName", _this.username);
240 _this.api.executeCommand("password", _this.roomPassword); 249 _this.api.executeCommand("password", _this.roomPassword);
241 }, 1000); 250 }, 1000);
242 }); 251 });
243 252
244 _this.api.on("readyToClose", () => { 253 _this.api.on("readyToClose", () => {
245 this.$router.push({ name: "Refresh" }); 254 this.$router.push({ name: "Refresh" });
246 }); 255 });
247 } catch (error) { 256 } catch (error) {
248 // console.error("Failed to load Jitsi API", error); 257 // console.error("Failed to load Jitsi API", error);
249 } 258 }
250 }, 259 },
251 openRoom() { 260 openRoom() {
252 // verify the JitsiMeetExternalAPI constructor is added to the global.. 261 // verify the JitsiMeetExternalAPI constructor is added to the global..
253 // if (this.teacherName != "" || this.room != "") { 262 // if (this.teacherName != "" || this.room != "") {
254 // if (window.JitsiMeetExternalAPI) { 263 // if (window.JitsiMeetExternalAPI) {
255 // // var person = prompt("Please enter your name:", "Rabie"); 264 // // var person = prompt("Please enter your name:", "Rabie");
256 // if (person != null || person != "") this.username = this.teacherName; 265 // if (person != null || person != "") this.username = this.teacherName;
257 // var room = prompt("Please enter your room:", "Test Room"); 266 // var room = prompt("Please enter your room:", "Test Room");
258 // if (room != null || room != "") this.room = this.room; 267 // if (room != null || room != "") this.room = this.room;
259 // this.startConference(); 268 // this.startConference();
260 // } else alert("Jitsi Meet API script not loaded"); 269 // } else alert("Jitsi Meet API script not loaded");
261 // } 270 // }
262 }, 271 },
263 272
264 createRoom(classId) { 273 createRoom(classId) {
265 // this.showLoader = true; 274 // this.showLoader = true;
266 var classId = { 275 var classId = {
267 classId: classId, 276 classId: classId,
268 }; 277 };
269 http() 278 http()
270 .post("/createLiveClasses", { 279 .post("/createLiveClasses", {
271 classId: this.$route.query.classId, 280 classId: this.$route.query.classId,
272 courseId: this.$route.query.courseId, 281 courseId: this.$route.query.courseId,
273 chapterId: this.$route.query.chapterId, 282 chapterId: this.$route.query.chapterId,
274 }) 283 })
275 .then((response) => { 284 .then((response) => {
276 // this.addSection = response.data.data; 285 // this.addSection = response.data.data;
277 // console.log("CREATE___ROOOM", response.data); 286 // console.log("CREATE___ROOOM", response.data);
278 var room = response.data.data.roomName; 287 var room = response.data.data.roomName;
279 var username = localStorage.getItem("teacherName"); 288 var username = localStorage.getItem("teacherName");
280 var roomPassword = response.data.data.password; 289 var roomPassword = response.data.data.password;
290 this.appLink = response.data.data.appLink;
281 // console.log( 291 // console.log(
282 // "room", 292 // "room",
283 // room, 293 // room,
284 // "username", 294 // "username",
285 // username, 295 // username,
286 // "roomPassword", 296 // "roomPassword",
287 // roomPassword 297 // roomPassword
288 // ); 298 // );
289 var this_ = this; 299 var this_ = this;
290 if (username != "" || room != "") { 300 if (username != "" || room != "") {
291 if (window.JitsiMeetExternalAPI) { 301 const isMobile = /iPhone|iPad|iPod|Android/i.test(
292 // var person = prompt("Please enter your name:", "Rabie"); 302 navigator.userAgent
293 if (username != null || username != "") { 303 );
294 this_.username = username; 304 if (isMobile) {
295 } 305 // console.log("==TEACHER=appLink==", this.appLink);
296 // var room = prompt("Please enter your room:", "Test Room"); 306 window.open(this.appLink);
297 if (room != null || room != "") { 307 } else {
298 this_.room = room; 308 if (window.JitsiMeetExternalAPI) {
299 } 309 // var person = prompt("Please enter your name:", "Rabie");
300 if (roomPassword != null || roomPassword != "") { 310 if (username != null || username != "") {
301 this_.password = roomPassword; 311 this_.username = username;
302 } 312 }
303 } else alert("Jitsi Meet API script not loaded"); 313 // var room = prompt("Please enter your room:", "Test Room");
304 this_.startConference(); 314 if (room != null || room != "") {
315 this_.room = room;
316 }
317 if (roomPassword != null || roomPassword != "") {
318 this_.roomPassword = roomPassword;
319 }
320 } else alert("Jitsi Meet API script not loaded");
321 this_.startConference();
322 }
305 } 323 }
306 }) 324 })
307 .catch((err) => { 325 .catch((err) => {
308 this.showLoader = false; 326 this.showLoader = false;
309 }); 327 });
310 }, 328 },
311 async studentClasses() { 329 async studentClasses() {
312 this.liveLink = ""; 330 this.liveLink = "";
313 this.room = ""; 331 this.room = "";
314 this.username = ""; 332 this.username = "";
315 this.roomPassword = ""; 333 this.roomPassword = "";
316 /* getLiveClassesesList - To up date line under heading*/ 334 /* getLiveClassesesList - To up date line under heading*/
317 let response = await this.getLiveClassesesList({ 335 let response = await this.getLiveClassesesList({
318 classId: this.$route.query.classId, 336 classId: this.$route.query.classId,
319 courseId: this.$route.query.courseId, 337 courseId: this.$route.query.courseId,
320 chapterId: this.$route.query.chapterId, 338 chapterId: this.$route.query.chapterId,
321 }); 339 });
322 // console.log("response getLiveClassesesList- ", response); 340 // console.log("response getLiveClassesesList- ", response);
323 341
324 /* CHECK RESPONSE TO ASSIGN MESSAGE INSIDE BUTTON */ 342 /* CHECK RESPONSE TO ASSIGN MESSAGE INSIDE BUTTON */
325 if (response.data.data[0].sessionStatus == "ENDED") { 343 if (response.data.data[0].sessionStatus == "ENDED") {
326 // this.startLiveSession = "Start Session"; 344 // this.startLiveSession = "Start Session";
327 this.studentBtn = ""; 345 this.studentBtn = "";
328 } 346 }
329 if (response.data.data[0].sessionStatus == "STARTED") { 347 if (response.data.data[0].sessionStatus == "STARTED") {
330 // this.startLiveSession = "Join Session"; 348 // this.startLiveSession = "Join Session";
331 this.studentBtn = "Join Session"; 349 this.studentBtn = "Join Session";
332 } 350 }
333 if (response.data.data.length == 0) { 351 if (response.data.data.length == 0) {
334 this.startLiveSession = "Start Session"; 352 this.startLiveSession = "Start Session";
335 this.studentBtn = ""; 353 this.studentBtn = "";
336 } else { 354 } else {
337 this.liveLink = response.data.data[0].link; 355 this.liveLink = response.data.data[0].link;
356 this.appLink = response.data.data[0].appLink;
338 var room = response.data.data[0].roomName; 357 var room = response.data.data[0].roomName;
339 var username = this.currentUser; 358 var username = this.currentUser;
340 var roomPassword = response.data.data[0].password; 359 var roomPassword = response.data.data[0].password;
341 var this_ = this; 360 var this_ = this;
342 // console.log(this.room, this.roomPassword, this.username); 361 // console.log(this.room, this.roomPassword, this.username);
343 362
344 if (username != "" || room != "") { 363 if (username != "" || room != "") {
345 if (window.JitsiMeetExternalAPI) { 364 if (window.JitsiMeetExternalAPI) {
346 // var person = prompt("Please enter your name:", "Rabie"); 365 // var person = prompt("Please enter your name:", "Rabie");
347 if (username != null || username != "") { 366 if (username != null || username != "") {
348 this_.username = username; 367 this_.username = username;
349 } 368 }
350 if (roomPassword != null || roomPassword != "") { 369 if (roomPassword != null || roomPassword != "") {
351 this_.roomPassword = roomPassword; 370 this_.roomPassword = roomPassword;
352 } 371 }
353 // var room = prompt("Please enter your room:", "Test Room"); 372 // var room = prompt("Please enter your room:", "Test Room");
354 if (room != null || room != "") { 373 if (room != null || room != "") {
355 this_.room = room; 374 this_.room = room;
356 } 375 }
357 // this.startConference(); 376 // this.startConference();
358 } 377 }
359 } 378 }
360 } 379 }
361 }, 380 },
362 }, 381 },
363 382
364 async created() { 383 async created() {
365 // console.log( 384 // console.log(
366 // "this.$store.state.studentsData", 385 // "this.$store.state.studentsData",
367 // this.$store.state.studentsData[0].name 386 // this.$store.state.studentsData[0].name
368 // ); 387 // );
369 this.currentUser = localStorage.getItem("studentName"); 388 this.currentUser = localStorage.getItem("studentName");
370 this.token = this.$store.state.token; 389 this.token = this.$store.state.token;
371 if (this.$store.state.role === "PARENT") { 390 if (this.$store.state.role === "PARENT") {
372 await this.studentClasses(); 391 await this.studentClasses();
373 } 392 }
374 393
375 /* getStudentCourses - to get courseData - defined in GetApis.js*/ 394 /* getStudentCourses - to get courseData - defined in GetApis.js*/
376 if (this.$store.state.role === "PARENT") { 395 if (this.$store.state.role === "PARENT") {
377 await this.getStudentCourses({ 396 await this.getStudentCourses({
378 classId: localStorage.getItem("parentClassId"), 397 classId: localStorage.getItem("parentClassId"),
379 studentId: localStorage.getItem("parentStudentId"), 398 studentId: localStorage.getItem("parentStudentId"),
380 }); 399 });
381 } 400 }
382 }, 401 },
383 }; 402 };
384 </script> 403 </script>
385 <style scoped> 404 <style scoped>
386 .side-bar-color { 405 .side-bar-color {
387 color: #827bfa !important; 406 color: #827bfa !important;
388 /* border-top-right-radius: 74px !important; */ 407 /* border-top-right-radius: 74px !important; */
389 } 408 }
390 .card-border { 409 .card-border {
391 border: 1px #bdbdbd solid; 410 border: 1px #bdbdbd solid;
392 border-radius: 3px; 411 border-radius: 3px;
393 } 412 }
394 .reply-desc { 413 .reply-desc {
395 border: 1px solid #f2f2f2; 414 border: 1px solid #f2f2f2;
396 } 415 }
397 .open-dialog-button { 416 .open-dialog-button {
398 background: #827bfa !important; 417 background: #827bfa !important;
399 border-color: #827bfa !important; 418 border-color: #827bfa !important;
400 text-transform: none !important; 419 text-transform: none !important;
401 } 420 }
402 421
403 .reply-btn { 422 .reply-btn {
404 background: #feb83c !important; 423 background: #feb83c !important;
405 border-color: #feb83c !important; 424 border-color: #feb83c !important;
406 text-transform: none !important; 425 text-transform: none !important;
407 -webkit-box-shadow: none !important; 426 -webkit-box-shadow: none !important;
408 box-shadow: none !important; 427 box-shadow: none !important;
409 } 428 }
410 #jitsi-container { 429 #jitsi-container {
411 height: 100vh; 430 height: 100vh;
412 } 431 }
413 </style> 432 </style>