@mundogamernetwork/shared-ui 1.14.5 → 1.15.0
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.
|
@@ -37,20 +37,6 @@ onUnmounted(() => {
|
|
|
37
37
|
document.removeEventListener("click", focusOut);
|
|
38
38
|
});
|
|
39
39
|
|
|
40
|
-
const login = () => {
|
|
41
|
-
const redirectTo = encodeURIComponent(window.location.href);
|
|
42
|
-
window.location.href = `${accountsBaseUrl}/login?redirect_to=${redirectTo}`;
|
|
43
|
-
};
|
|
44
|
-
|
|
45
|
-
// Computed in script rather than read inline in the template: a bare `window`
|
|
46
|
-
// reference in the template crashes the render (it's not part of the
|
|
47
|
-
// script-setup bindings the compiled render function has access to, and it's
|
|
48
|
-
// undefined during SSR), which took down this whole dropdown for every
|
|
49
|
-
// signed-out visitor.
|
|
50
|
-
const registerHref = computed(
|
|
51
|
-
() => `${accountsBaseUrl}/register?redirect_to=${encodeURIComponent(import.meta.client ? window.location.href : "")}`,
|
|
52
|
-
);
|
|
53
|
-
|
|
54
40
|
const handleLogout = async () => {
|
|
55
41
|
await performLogout(`${accountsBaseUrl}/login`);
|
|
56
42
|
};
|
|
@@ -59,25 +45,7 @@ const handleLogout = async () => {
|
|
|
59
45
|
<template>
|
|
60
46
|
<div ref="refDiv" :class="{ 'ui-config-user': true, 'signed-in': signedIn }">
|
|
61
47
|
<div ref="wrapper" class="ui-config-user__content">
|
|
62
|
-
<
|
|
63
|
-
<div class="ui-config-user__option">
|
|
64
|
-
<div class="w-100">
|
|
65
|
-
<a class="btn primary lg w-100" href="#" @click.prevent="login">
|
|
66
|
-
{{ $t("header.login.btn_login") }}
|
|
67
|
-
</a>
|
|
68
|
-
</div>
|
|
69
|
-
</div>
|
|
70
|
-
<div class="ui-config-user__option">
|
|
71
|
-
<div>
|
|
72
|
-
<p class="d-flex">
|
|
73
|
-
{{ $t("header.login.register_message") }}
|
|
74
|
-
<a :href="registerHref" class="ms-1">
|
|
75
|
-
{{ $t("header.login.btn_register") }}
|
|
76
|
-
</a>
|
|
77
|
-
</p>
|
|
78
|
-
</div>
|
|
79
|
-
</div>
|
|
80
|
-
</div>
|
|
48
|
+
<MgLoginRegisterMenu v-if="!signedIn" :dropdown="false" />
|
|
81
49
|
|
|
82
50
|
<div v-else class="signed-in-menu">
|
|
83
51
|
<div class="row info-row ps-0">
|
|
@@ -176,67 +144,11 @@ const handleLogout = async () => {
|
|
|
176
144
|
width: 340px;
|
|
177
145
|
}
|
|
178
146
|
|
|
179
|
-
&__option {
|
|
180
|
-
color: var(--sidebar-menus-fg);
|
|
181
|
-
display: flex;
|
|
182
|
-
justify-content: space-between;
|
|
183
|
-
padding: 0 1rem;
|
|
184
|
-
font-size: 0.875rem;
|
|
185
|
-
min-height: 48px;
|
|
186
|
-
align-items: center;
|
|
187
|
-
|
|
188
|
-
a {
|
|
189
|
-
font-size: 16px !important;
|
|
190
|
-
font-weight: 400;
|
|
191
|
-
}
|
|
192
|
-
|
|
193
|
-
// Self-contained styling, not a host `.btn.primary` Bootstrap class:
|
|
194
|
-
// this component ships to hosts that don't all load Bootstrap (Shop
|
|
195
|
-
// doesn't), so relying on it left the login button rendering as a
|
|
196
|
-
// bare unstyled link there. Same color tokens the rest of this file
|
|
197
|
-
// already falls back through (see .plans-pricing-link below).
|
|
198
|
-
a.btn.primary {
|
|
199
|
-
display: block;
|
|
200
|
-
text-align: center;
|
|
201
|
-
padding: 0.625rem 1rem;
|
|
202
|
-
background: var(--highlight-color, var(--header-active-fg, var(--active)));
|
|
203
|
-
color: var(--header-ui-config-bg, #fff);
|
|
204
|
-
text-decoration: none;
|
|
205
|
-
|
|
206
|
-
&:hover {
|
|
207
|
-
opacity: 0.85;
|
|
208
|
-
}
|
|
209
|
-
}
|
|
210
|
-
|
|
211
|
-
& > div > p {
|
|
212
|
-
font-size: 15px !important;
|
|
213
|
-
font-weight: 400;
|
|
214
|
-
color: var(--sidebar-menus-fg);
|
|
215
|
-
|
|
216
|
-
a {
|
|
217
|
-
color: var(--highlight-color, var(--header-active-fg, var(--active)));
|
|
218
|
-
}
|
|
219
|
-
}
|
|
220
|
-
}
|
|
221
|
-
|
|
222
147
|
&__content {
|
|
223
148
|
display: flex;
|
|
224
149
|
justify-content: flex-start;
|
|
225
150
|
align-items: flex-start;
|
|
226
151
|
transition: transform 0.4s cubic-bezier(0.86, 0, 0.07, 1);
|
|
227
|
-
|
|
228
|
-
&__tab {
|
|
229
|
-
flex: 1 0 100%;
|
|
230
|
-
width: 100%;
|
|
231
|
-
background-color: var(--header-ui-config-bg);
|
|
232
|
-
|
|
233
|
-
p {
|
|
234
|
-
color: var(--active);
|
|
235
|
-
font-size: 12px;
|
|
236
|
-
padding: 0.5rem 1rem;
|
|
237
|
-
margin: 0;
|
|
238
|
-
}
|
|
239
|
-
}
|
|
240
152
|
}
|
|
241
153
|
|
|
242
154
|
.signed-in-menu {
|