@icvdeveloper/common-module 0.0.127 → 0.0.129

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.
Files changed (92) hide show
  1. package/README.md +6 -6
  2. package/dist/module.json +1 -1
  3. package/dist/runtime/assets/svg/answer.svg +14 -14
  4. package/dist/runtime/assets/svg/avatar.svg +1 -1
  5. package/dist/runtime/assets/svg/bell-icon.svg +3 -3
  6. package/dist/runtime/assets/svg/checkmark-icon.svg +1 -1
  7. package/dist/runtime/assets/svg/close-icon.svg +1 -1
  8. package/dist/runtime/assets/svg/icon-avatar.svg +1 -1
  9. package/dist/runtime/assets/svg/icon-chevron.svg +4 -4
  10. package/dist/runtime/assets/svg/icon-circle-plus.svg +1 -1
  11. package/dist/runtime/assets/svg/icon-close.svg +1 -1
  12. package/dist/runtime/assets/svg/icon-info.svg +2 -2
  13. package/dist/runtime/assets/svg/icon-new-window.svg +11 -11
  14. package/dist/runtime/assets/svg/icon-offline.svg +3 -3
  15. package/dist/runtime/assets/svg/icon-online.svg +3 -3
  16. package/dist/runtime/assets/svg/icon-person.svg +2 -2
  17. package/dist/runtime/assets/svg/icon-play.svg +2 -2
  18. package/dist/runtime/assets/svg/icon-star-filled.svg +29 -29
  19. package/dist/runtime/assets/svg/icon-star.svg +24 -24
  20. package/dist/runtime/assets/svg/icon-video-chat.svg +14 -14
  21. package/dist/runtime/assets/svg/icon-website.svg +2 -2
  22. package/dist/runtime/assets/svg/icon-zoom.svg +10 -10
  23. package/dist/runtime/assets/svg/notification-icon.svg +32 -32
  24. package/dist/runtime/assets/svg/offline-icon.svg +1 -1
  25. package/dist/runtime/assets/svg/online-icon.svg +3 -3
  26. package/dist/runtime/assets/svg/peer2peer.svg +3 -3
  27. package/dist/runtime/assets/svg/phone.svg +1 -1
  28. package/dist/runtime/assets/svg/plus-icon.svg +1 -1
  29. package/dist/runtime/assets/svg/red-icon.svg +3 -3
  30. package/dist/runtime/assets/svg/reject.svg +14 -14
  31. package/dist/runtime/assets/svg/search-icon.svg +3 -3
  32. package/dist/runtime/components/affiliates/AffiliatePage.vue +329 -329
  33. package/dist/runtime/components/agenda/AgendaList.vue +259 -259
  34. package/dist/runtime/components/agenda/AgendaTabbed.vue +305 -305
  35. package/dist/runtime/components/agenda/components/AgendaListAccordion.vue +67 -67
  36. package/dist/runtime/components/agenda/components/Calendar.vue +67 -67
  37. package/dist/runtime/components/agenda/components/InfoLink.vue +56 -56
  38. package/dist/runtime/components/agenda/components/PlayIcon.vue +49 -49
  39. package/dist/runtime/components/agenda/components/PresentationLink.vue +137 -137
  40. package/dist/runtime/components/agenda/components/Sponsor.vue +132 -132
  41. package/dist/runtime/components/auth/LoginFullWidth.vue +78 -78
  42. package/dist/runtime/components/auth/PasswordReset.vue +60 -60
  43. package/dist/runtime/components/auth/Registration.vue +27 -27
  44. package/dist/runtime/components/auth/Ucc.vue +129 -129
  45. package/dist/runtime/components/core/Accordion.vue +97 -97
  46. package/dist/runtime/components/core/CountdownTimer.vue +336 -336
  47. package/dist/runtime/components/core/DynamicHtml.vue +1 -1
  48. package/dist/runtime/components/core/Modal.vue +111 -111
  49. package/dist/runtime/components/core/Navbar.vue +154 -154
  50. package/dist/runtime/components/core/SvgIcon.vue +157 -157
  51. package/dist/runtime/components/core/ZoomModal.vue +37 -37
  52. package/dist/runtime/components/events/EventHeader.vue +133 -133
  53. package/dist/runtime/components/events/ListEvents.vue +554 -554
  54. package/dist/runtime/components/forms/AlertBox.vue +21 -21
  55. package/dist/runtime/components/forms/ErrorField.vue +17 -17
  56. package/dist/runtime/components/forms/Message.vue +27 -27
  57. package/dist/runtime/components/forms/SearchInput.vue +38 -38
  58. package/dist/runtime/components/forms/SupportForm.vue +112 -112
  59. package/dist/runtime/components/forms/SwitchInput.vue +42 -42
  60. package/dist/runtime/components/forms/TextArea.vue +26 -26
  61. package/dist/runtime/components/forms/TextInput.vue +28 -28
  62. package/dist/runtime/components/layouts/Accordion.vue +78 -78
  63. package/dist/runtime/components/media/ArchivePlayerAndContentContainer.vue +160 -160
  64. package/dist/runtime/components/media/ArchiveVideoPlayer.vue +186 -186
  65. package/dist/runtime/components/media/PlayerAndContentContainer.vue +183 -183
  66. package/dist/runtime/components/media/WebcastVideoPlayer.vue +140 -140
  67. package/dist/runtime/components/media/components/AgendaPanel.vue +43 -43
  68. package/dist/runtime/components/media/components/ArchiveMediaContainer.vue +91 -91
  69. package/dist/runtime/components/media/components/CeCreditNotification.vue +95 -95
  70. package/dist/runtime/components/media/components/ContentAccordion.vue +63 -63
  71. package/dist/runtime/components/media/components/ContentArea.vue +158 -158
  72. package/dist/runtime/components/media/components/ContentTabs.vue +231 -231
  73. package/dist/runtime/components/media/components/DocumentsPanel.vue +31 -31
  74. package/dist/runtime/components/media/components/JsonApi.vue +31 -31
  75. package/dist/runtime/components/media/components/MediaContainer.vue +63 -63
  76. package/dist/runtime/components/media/components/OverviewPanel.vue +52 -52
  77. package/dist/runtime/components/media/components/PresentersPanel.vue +52 -52
  78. package/dist/runtime/components/media/components/SessionReporting.vue +107 -102
  79. package/dist/runtime/components/media/components/SponsorsPanel.vue +71 -71
  80. package/dist/runtime/components/media/components/WindowContent.vue +92 -92
  81. package/dist/runtime/components/media/components/WindowSlide.vue +72 -72
  82. package/dist/runtime/components/presenters/PresenterListing.vue +164 -164
  83. package/dist/runtime/components/presenters/PresenterModal.vue +223 -223
  84. package/dist/runtime/components/profile/Profile.vue +149 -149
  85. package/dist/runtime/components/profile/components/Sidebar.vue +27 -27
  86. package/dist/runtime/components/profile/components/SidebarNavItem.vue +39 -39
  87. package/dist/runtime/components/profile/tabs/Favorites.vue +21 -21
  88. package/dist/runtime/components/profile/tabs/GeneralInformation.vue +122 -122
  89. package/dist/runtime/components/profile/tabs/ProfileImage.vue +75 -75
  90. package/dist/runtime/components/support/FAQAccordion.vue +140 -140
  91. package/dist/runtime/composables/useApi.mjs +3 -1
  92. package/package.json +1 -1
@@ -1,78 +1,78 @@
1
- <script lang="ts" setup>
2
- import { toRefs } from "vue";
3
- import { storeToRefs } from "pinia";
4
- import { Conference } from "../../models/conference";
5
- import { useLogin } from "../../composables/useLogin";
6
- import { useTemplateConfigsStore } from "../../store";
7
-
8
- interface Props {
9
- conference?: Conference | null;
10
- }
11
-
12
- const props = withDefaults(defineProps<Props>(), {
13
- conference: null,
14
- });
15
-
16
- const { conference } = toRefs<Props>(props);
17
-
18
- const { globalConfigValue } = storeToRefs(useTemplateConfigsStore());
19
-
20
- // Methods
21
- const { loginError, handleLogin, email, password, tooManySessions, showReset } =
22
- useLogin(conference);
23
- </script>
24
-
25
- <template>
26
- <div class="px-2">
27
- <div class="flex flex-1 flex-col text-center pt-8">
28
- <h1 class="mb-3 heading-color-3">Log In</h1>
29
- <CommonMessage
30
- v-if="loginError"
31
- :success="false"
32
- class="w-full max-w-xs mx-auto"
33
- >
34
- Invalid email or password.
35
- <br />
36
- <a
37
- v-if="!globalConfigValue('secure_site_access_enabled', false)"
38
- href="/login/email"
39
- >Forgot Your Password?</a
40
- >
41
- <a
42
- v-if="globalConfigValue('secure_site_access_enabled', false)"
43
- class="cursor-pointer"
44
- @click="showReset"
45
- >Forgot Your Password?</a
46
- >
47
- </CommonMessage>
48
-
49
- <div class="max-w-xs mx-auto" @keyup.enter="handleLogin()">
50
- <input
51
- v-model="email"
52
- type="email"
53
- placeholder="Email"
54
- class="form-input contrast-border mb-2"
55
- />
56
- <input
57
- v-model="password"
58
- type="password"
59
- placeholder="password"
60
- class="form-input contrast-border mb-5"
61
- />
62
- <button v-if="!tooManySessions" class="btn" @click="handleLogin()">
63
- Log In
64
- </button>
65
- <CommonMessage
66
- v-if="tooManySessions"
67
- :success="false"
68
- class="w-full max-w-xs mx-auto"
69
- >
70
- This user access is logged in on another device!
71
- </CommonMessage>
72
- <button v-if="tooManySessions" class="btn" @click="handleLogin(true)">
73
- Sign out other Device
74
- </button>
75
- </div>
76
- </div>
77
- </div>
78
- </template>
1
+ <script lang="ts" setup>
2
+ import { toRefs } from "vue";
3
+ import { storeToRefs } from "pinia";
4
+ import { Conference } from "../../models/conference";
5
+ import { useLogin } from "../../composables/useLogin";
6
+ import { useTemplateConfigsStore } from "../../store";
7
+
8
+ interface Props {
9
+ conference?: Conference | null;
10
+ }
11
+
12
+ const props = withDefaults(defineProps<Props>(), {
13
+ conference: null,
14
+ });
15
+
16
+ const { conference } = toRefs<Props>(props);
17
+
18
+ const { globalConfigValue } = storeToRefs(useTemplateConfigsStore());
19
+
20
+ // Methods
21
+ const { loginError, handleLogin, email, password, tooManySessions, showReset } =
22
+ useLogin(conference);
23
+ </script>
24
+
25
+ <template>
26
+ <div class="px-2">
27
+ <div class="flex flex-1 flex-col text-center pt-8">
28
+ <h1 class="mb-3 heading-color-3">Log In</h1>
29
+ <CommonMessage
30
+ v-if="loginError"
31
+ :success="false"
32
+ class="w-full max-w-xs mx-auto"
33
+ >
34
+ Invalid email or password.
35
+ <br />
36
+ <a
37
+ v-if="!globalConfigValue('secure_site_access_enabled', false)"
38
+ href="/login/email"
39
+ >Forgot Your Password?</a
40
+ >
41
+ <a
42
+ v-if="globalConfigValue('secure_site_access_enabled', false)"
43
+ class="cursor-pointer"
44
+ @click="showReset"
45
+ >Forgot Your Password?</a
46
+ >
47
+ </CommonMessage>
48
+
49
+ <div class="max-w-xs mx-auto" @keyup.enter="handleLogin()">
50
+ <input
51
+ v-model="email"
52
+ type="email"
53
+ placeholder="Email"
54
+ class="form-input contrast-border mb-2"
55
+ />
56
+ <input
57
+ v-model="password"
58
+ type="password"
59
+ placeholder="password"
60
+ class="form-input contrast-border mb-5"
61
+ />
62
+ <button v-if="!tooManySessions" class="btn" @click="handleLogin()">
63
+ Log In
64
+ </button>
65
+ <CommonMessage
66
+ v-if="tooManySessions"
67
+ :success="false"
68
+ class="w-full max-w-xs mx-auto"
69
+ >
70
+ This user access is logged in on another device!
71
+ </CommonMessage>
72
+ <button v-if="tooManySessions" class="btn" @click="handleLogin(true)">
73
+ Sign out other Device
74
+ </button>
75
+ </div>
76
+ </div>
77
+ </div>
78
+ </template>
@@ -1,60 +1,60 @@
1
- <script lang="ts" setup>
2
- import { ref, toRefs } from "vue";
3
- import { useAuthStore } from "../../store/auth";
4
-
5
- interface Props {
6
- isCentered?: boolean;
7
- }
8
-
9
- const props = withDefaults(defineProps<Props>(), {
10
- isCentered: false,
11
- });
12
-
13
- // data
14
- const { isCentered } = toRefs(props);
15
- const loading = ref<boolean>(false);
16
- const email = ref<string>("");
17
- const message = ref<null | string>(null);
18
- const errors = ref<Array<any>>([]);
19
-
20
- // methods
21
- const { passwordReset } = useAuthStore();
22
- const submitPasswordReset = () => {
23
- loading.value = true;
24
- message.value = null;
25
- errors.value = [];
26
- passwordReset(email.value)
27
- .then((response) => {
28
- message.value = response.data.message;
29
- })
30
- .catch((error) => {
31
- if (error.response.status === 422) {
32
- errors.value = error.response.data.errors;
33
- } else {
34
- errors.value = ["Error requesting password reset."];
35
- }
36
- })
37
- .finally(() => {
38
- loading.value = false;
39
- });
40
- };
41
- </script>
42
-
43
- <template>
44
- <div :class="isCentered ? 'w-full max-w-xs mx-auto' : ''">
45
- <div class="mb-4">Enter your email address to reset your password.</div>
46
- <CommonMessage v-if="message" :success="true">
47
- {{ message }}
48
- </CommonMessage>
49
- <CommonMessage v-if="errors.length > 0" :success="false">
50
- {{ errors[0] }}
51
- </CommonMessage>
52
- <div @keyup.enter="submitPasswordReset()">
53
- <CommonTextInput v-model="email" placeholder="Email" type="email" />
54
- <button class="btn my-2" @click="submitPasswordReset()">
55
- <span v-if="loading">Processing...</span>
56
- <span v-else>Send Password Reset Link</span>
57
- </button>
58
- </div>
59
- </div>
60
- </template>
1
+ <script lang="ts" setup>
2
+ import { ref, toRefs } from "vue";
3
+ import { useAuthStore } from "../../store/auth";
4
+
5
+ interface Props {
6
+ isCentered?: boolean;
7
+ }
8
+
9
+ const props = withDefaults(defineProps<Props>(), {
10
+ isCentered: false,
11
+ });
12
+
13
+ // data
14
+ const { isCentered } = toRefs(props);
15
+ const loading = ref<boolean>(false);
16
+ const email = ref<string>("");
17
+ const message = ref<null | string>(null);
18
+ const errors = ref<Array<any>>([]);
19
+
20
+ // methods
21
+ const { passwordReset } = useAuthStore();
22
+ const submitPasswordReset = () => {
23
+ loading.value = true;
24
+ message.value = null;
25
+ errors.value = [];
26
+ passwordReset(email.value)
27
+ .then((response) => {
28
+ message.value = response.data.message;
29
+ })
30
+ .catch((error) => {
31
+ if (error.response.status === 422) {
32
+ errors.value = error.response.data.errors;
33
+ } else {
34
+ errors.value = ["Error requesting password reset."];
35
+ }
36
+ })
37
+ .finally(() => {
38
+ loading.value = false;
39
+ });
40
+ };
41
+ </script>
42
+
43
+ <template>
44
+ <div :class="isCentered ? 'w-full max-w-xs mx-auto' : ''">
45
+ <div class="mb-4">Enter your email address to reset your password.</div>
46
+ <CommonMessage v-if="message" :success="true">
47
+ {{ message }}
48
+ </CommonMessage>
49
+ <CommonMessage v-if="errors.length > 0" :success="false">
50
+ {{ errors[0] }}
51
+ </CommonMessage>
52
+ <div @keyup.enter="submitPasswordReset()">
53
+ <CommonTextInput v-model="email" placeholder="Email" type="email" />
54
+ <button class="btn my-2" @click="submitPasswordReset()">
55
+ <span v-if="loading">Processing...</span>
56
+ <span v-else>Send Password Reset Link</span>
57
+ </button>
58
+ </div>
59
+ </div>
60
+ </template>
@@ -1,27 +1,27 @@
1
- <script lang="ts" setup>
2
- import { storeToRefs } from "pinia";
3
- import { useAuthStore } from "../../store/auth";
4
- import { useRegistration } from "../../composables/useRegistration";
5
-
6
- // data
7
- const { isLoggedIn } = storeToRefs(useAuthStore());
8
-
9
- // methods
10
- const { isTownhallRegistration } = useRegistration();
11
- const submitRegistration = () => {};
12
- </script>
13
-
14
- <template>
15
- <div v-if="isLoggedIn">
16
- <CommonMessage :success="false">Already logged in.</CommonMessage>
17
- </div>
18
- <div v-else class="px-2">
19
- <div class="flex flex-1 flex-col text-center pt-8">
20
- <h1 class="mb-3 heading-color-3">Log In</h1>
21
-
22
- <div class="w-full max-w-xs mx-auto pb-12">
23
- <form class="w-full" @submit.prevent="submitRegistration"></form>
24
- </div>
25
- </div>
26
- </div>
27
- </template>
1
+ <script lang="ts" setup>
2
+ import { storeToRefs } from "pinia";
3
+ import { useAuthStore } from "../../store/auth";
4
+ import { useRegistration } from "../../composables/useRegistration";
5
+
6
+ // data
7
+ const { isLoggedIn } = storeToRefs(useAuthStore());
8
+
9
+ // methods
10
+ const { isTownhallRegistration } = useRegistration();
11
+ const submitRegistration = () => {};
12
+ </script>
13
+
14
+ <template>
15
+ <div v-if="isLoggedIn">
16
+ <CommonMessage :success="false">Already logged in.</CommonMessage>
17
+ </div>
18
+ <div v-else class="px-2">
19
+ <div class="flex flex-1 flex-col text-center pt-8">
20
+ <h1 class="mb-3 heading-color-3">Log In</h1>
21
+
22
+ <div class="w-full max-w-xs mx-auto pb-12">
23
+ <form class="w-full" @submit.prevent="submitRegistration"></form>
24
+ </div>
25
+ </div>
26
+ </div>
27
+ </template>
@@ -1,129 +1,129 @@
1
- <script lang="ts" setup>
2
- import { toRefs, computed, onMounted } from "vue";
3
- import { useUcc } from "../../composables/useUcc";
4
- import { Conference } from "../../models/conference";
5
- import { useConferencesStore } from "../../store/conferences";
6
- import { uccClassObj } from "../../@types/components";
7
- import { useClassBinding } from "../../composables/useClassBinding";
8
-
9
- const { loadUccScript, loginV3 } = useUcc();
10
-
11
- interface Props {
12
- conference: Conference;
13
- classObject?: uccClassObj;
14
- }
15
-
16
- const props = withDefaults(defineProps<Props>(), {
17
- classObject: () => {
18
- return {
19
- container: ""
20
- };
21
- },
22
- });
23
-
24
- const {
25
- classObject,
26
- } = toRefs(props);
27
-
28
- const { selectedConference } = useConferencesStore();
29
- const { classBinding } = useClassBinding();
30
-
31
- // reactive data
32
- const { conference } = toRefs(props);
33
-
34
- // methods
35
- const submitLogin = () => {
36
- let email = document.getElementById('uccEmail').value;
37
- loginV3({email: email});
38
- };
39
-
40
- // computed
41
- const loginHeader = computed(() => {
42
- return (conference.value.state == "live")
43
- ? "Live Web Event Streaming Now"
44
- : (conference.value.state == "archive")
45
- ? "Enter your email address to view event recording"
46
- : "Join us for a Free Live Web Event"; // fallback (handled by UCC)
47
- });
48
-
49
- const headerColorClass = computed(() => {
50
- return (conference.value.state == "live")
51
- ? "text-red-500"
52
- : "text-black-500";
53
- });
54
-
55
- const buttonText = computed(() => {
56
- return (conference.value.state == "live")
57
- ? "Join the Livestream"
58
- : (conference.value.state == "archive")
59
- ? "View Event"
60
- : "Register"; // fallback (handled by UCC)
61
- });
62
-
63
- const buttonColorClass = computed(() => {
64
- return (conference.value.state == "live")
65
- ? "v3-ucc-btn-black"
66
- : "ucc-btn-primary";
67
- });
68
-
69
- // on mount
70
- onMounted(() => {
71
- loadUccScript(props.conference);
72
- });
73
-
74
- </script>
75
-
76
- <template>
77
- <div>
78
- <!-- UCC Widget -->
79
- <div id="uccTarget"
80
- :class="
81
- classBinding(
82
- classObject,
83
- 'container',
84
- 'p-0 m-0 w-full'
85
- )
86
- "
87
- style="display:block;"
88
- >
89
- </div>
90
- <!-- V3 email login form -->
91
- <div id="uccEmailForm"
92
- class="ucc-form-container ucc-widgets-events"
93
- :class="(conference.state == 'live' || conference.state == 'archive') ? 'block' : 'hidden'"
94
- style="padding-bottom: 0px"
95
- >
96
- <div>
97
- <h1 class="scala-bold text-xl text-center mb-0" :class="headerColorClass">
98
- {{ loginHeader }}
99
- </h1>
100
- </div>
101
- <div class="text-center">
102
- <form @submit="submitLogin" action="javascript:void();">
103
- <div class="ucc-form-field">
104
- <div class="ucc-form-field-descr"></div>
105
- <div class="ucc-input-wrapper required">
106
- <input id="uccEmail" name="uccEmail" class="ucc-input" type="text" placeholder="Enter Email Address" autocomplete="off" maxlength="70">
107
- </div>
108
- <div class="ucc-error"></div>
109
- </div>
110
- <div class="ucc-form-field ucc-form-btn-row" style="margin-bottom: 0x; margin-top: 0px;">
111
- <a
112
- @click="submitLogin"
113
- class="ucc-btn"
114
- :class="buttonColorClass"
115
- style="margin-top: 0px;"><span class="btn-text">{{ buttonText }}</span></a>
116
- </div>
117
- </form>
118
- </div>
119
- </div>
120
- </div>
121
- </template>
122
-
123
- <style scoped>
124
- .v3-ucc-btn-black {
125
- background-color: #000;
126
- border: 1px solid #000;
127
- color: #fff;
128
- }
129
- </style>
1
+ <script lang="ts" setup>
2
+ import { toRefs, computed, onMounted } from "vue";
3
+ import { useUcc } from "../../composables/useUcc";
4
+ import { Conference } from "../../models/conference";
5
+ import { useConferencesStore } from "../../store/conferences";
6
+ import { uccClassObj } from "../../@types/components";
7
+ import { useClassBinding } from "../../composables/useClassBinding";
8
+
9
+ const { loadUccScript, loginV3 } = useUcc();
10
+
11
+ interface Props {
12
+ conference: Conference;
13
+ classObject?: uccClassObj;
14
+ }
15
+
16
+ const props = withDefaults(defineProps<Props>(), {
17
+ classObject: () => {
18
+ return {
19
+ container: ""
20
+ };
21
+ },
22
+ });
23
+
24
+ const {
25
+ classObject,
26
+ } = toRefs(props);
27
+
28
+ const { selectedConference } = useConferencesStore();
29
+ const { classBinding } = useClassBinding();
30
+
31
+ // reactive data
32
+ const { conference } = toRefs(props);
33
+
34
+ // methods
35
+ const submitLogin = () => {
36
+ let email = document.getElementById('uccEmail').value;
37
+ loginV3({email: email});
38
+ };
39
+
40
+ // computed
41
+ const loginHeader = computed(() => {
42
+ return (conference.value.state == "live")
43
+ ? "Live Web Event Streaming Now"
44
+ : (conference.value.state == "archive")
45
+ ? "Enter your email address to view event recording"
46
+ : "Join us for a Free Live Web Event"; // fallback (handled by UCC)
47
+ });
48
+
49
+ const headerColorClass = computed(() => {
50
+ return (conference.value.state == "live")
51
+ ? "text-red-500"
52
+ : "text-black-500";
53
+ });
54
+
55
+ const buttonText = computed(() => {
56
+ return (conference.value.state == "live")
57
+ ? "Join the Livestream"
58
+ : (conference.value.state == "archive")
59
+ ? "View Event"
60
+ : "Register"; // fallback (handled by UCC)
61
+ });
62
+
63
+ const buttonColorClass = computed(() => {
64
+ return (conference.value.state == "live")
65
+ ? "v3-ucc-btn-black"
66
+ : "ucc-btn-primary";
67
+ });
68
+
69
+ // on mount
70
+ onMounted(() => {
71
+ loadUccScript(props.conference);
72
+ });
73
+
74
+ </script>
75
+
76
+ <template>
77
+ <div>
78
+ <!-- UCC Widget -->
79
+ <div id="uccTarget"
80
+ :class="
81
+ classBinding(
82
+ classObject,
83
+ 'container',
84
+ 'p-0 m-0 w-full'
85
+ )
86
+ "
87
+ style="display:block;"
88
+ >
89
+ </div>
90
+ <!-- V3 email login form -->
91
+ <div id="uccEmailForm"
92
+ class="ucc-form-container ucc-widgets-events"
93
+ :class="(conference.state == 'live' || conference.state == 'archive') ? 'block' : 'hidden'"
94
+ style="padding-bottom: 0px"
95
+ >
96
+ <div>
97
+ <h1 class="scala-bold text-xl text-center mb-0" :class="headerColorClass">
98
+ {{ loginHeader }}
99
+ </h1>
100
+ </div>
101
+ <div class="text-center">
102
+ <form @submit="submitLogin" action="javascript:void();">
103
+ <div class="ucc-form-field">
104
+ <div class="ucc-form-field-descr"></div>
105
+ <div class="ucc-input-wrapper required">
106
+ <input id="uccEmail" name="uccEmail" class="ucc-input" type="text" placeholder="Enter Email Address" autocomplete="off" maxlength="70">
107
+ </div>
108
+ <div class="ucc-error"></div>
109
+ </div>
110
+ <div class="ucc-form-field ucc-form-btn-row" style="margin-bottom: 0x; margin-top: 0px;">
111
+ <a
112
+ @click="submitLogin"
113
+ class="ucc-btn"
114
+ :class="buttonColorClass"
115
+ style="margin-top: 0px;"><span class="btn-text">{{ buttonText }}</span></a>
116
+ </div>
117
+ </form>
118
+ </div>
119
+ </div>
120
+ </div>
121
+ </template>
122
+
123
+ <style scoped>
124
+ .v3-ucc-btn-black {
125
+ background-color: #000;
126
+ border: 1px solid #000;
127
+ color: #fff;
128
+ }
129
+ </style>