@mirweb/mir-web-components 2.3.8 → 2.3.9
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.
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
<template>
|
|
2
2
|
<div class="header__wrapper">
|
|
3
|
-
<nav>
|
|
3
|
+
<nav aria-label="Main navigation">
|
|
4
4
|
<!-- Main nav -->
|
|
5
5
|
<div class="nav-wrapper">
|
|
6
6
|
<div class="mir-link-logo">
|
|
@@ -12,11 +12,7 @@
|
|
|
12
12
|
<div class="secondary-nav-items">
|
|
13
13
|
<!-- dropdown menu -->
|
|
14
14
|
<div v-if="useDropdown" id="menu-dropdown" ref="dropdownDiv">
|
|
15
|
-
<button
|
|
16
|
-
class="nav-dropdown-btn"
|
|
17
|
-
aria-label="Toggle Dropdown"
|
|
18
|
-
@click="toggleDropDown"
|
|
19
|
-
>
|
|
15
|
+
<button class="nav-dropdown-btn" @click="toggleDropDown">
|
|
20
16
|
<slot name="dropdown-title"></slot>
|
|
21
17
|
<img
|
|
22
18
|
v-if="showDropDown === false"
|
|
@@ -64,7 +60,7 @@
|
|
|
64
60
|
>
|
|
65
61
|
<button
|
|
66
62
|
class="nav-portal-switcher-btn"
|
|
67
|
-
aria-label="Toggle Portal"
|
|
63
|
+
aria-label="Toggle Portal Switcher"
|
|
68
64
|
@click="togglePortalSwitcher"
|
|
69
65
|
>
|
|
70
66
|
<img
|
|
@@ -86,7 +82,10 @@
|
|
|
86
82
|
>
|
|
87
83
|
<atom-link link-type="regular">
|
|
88
84
|
<a :href="link.link" @click="showDropDown = false">
|
|
89
|
-
<img
|
|
85
|
+
<img
|
|
86
|
+
:src="link.icon"
|
|
87
|
+
:alt="link.alt ? link.alt : 'portal icon'"
|
|
88
|
+
/>
|
|
90
89
|
<div>{{ link.name }}</div></a
|
|
91
90
|
>
|
|
92
91
|
</atom-link>
|
|
@@ -106,7 +105,7 @@
|
|
|
106
105
|
</div>
|
|
107
106
|
<button
|
|
108
107
|
v-if="isAuthenticated"
|
|
109
|
-
aria-label="Toggle Profile"
|
|
108
|
+
aria-label="Toggle Profile Dropdown"
|
|
110
109
|
class="nav-profile-dropdown-btn"
|
|
111
110
|
@click="toggleProfileDropdown"
|
|
112
111
|
>
|
|
@@ -155,7 +154,7 @@
|
|
|
155
154
|
<!-- Mobile Portal switcher -->
|
|
156
155
|
<div
|
|
157
156
|
v-if="usePortalSwitcher"
|
|
158
|
-
id="menu-portal-switcher"
|
|
157
|
+
id="menu-portal-switcher-mobile"
|
|
159
158
|
class="menu-portal-switcher-wrapper"
|
|
160
159
|
>
|
|
161
160
|
<button
|
|
@@ -196,7 +195,10 @@
|
|
|
196
195
|
>
|
|
197
196
|
<atom-link link-type="regular">
|
|
198
197
|
<a :href="link.link" @click="showDropDown = false">
|
|
199
|
-
<img
|
|
198
|
+
<img
|
|
199
|
+
:src="link.icon"
|
|
200
|
+
:alt="link.alt ? link.alt : 'portal icon'"
|
|
201
|
+
/>
|
|
200
202
|
<div>{{ link.name }}</div></a
|
|
201
203
|
>
|
|
202
204
|
</atom-link>
|
|
@@ -206,7 +208,7 @@
|
|
|
206
208
|
</div>
|
|
207
209
|
<button
|
|
208
210
|
class="mobile-burger-wrapper"
|
|
209
|
-
aria-label="Toggle menu"
|
|
211
|
+
aria-label="Toggle mobile menu"
|
|
210
212
|
@click.prevent="toggleBurger"
|
|
211
213
|
>
|
|
212
214
|
<img
|
|
@@ -266,7 +268,12 @@ const props = defineProps({
|
|
|
266
268
|
default: false,
|
|
267
269
|
},
|
|
268
270
|
portals: {
|
|
269
|
-
type: Array as () => Array<{
|
|
271
|
+
type: Array as () => Array<{
|
|
272
|
+
name: string;
|
|
273
|
+
icon: string;
|
|
274
|
+
link: string;
|
|
275
|
+
alt?: string;
|
|
276
|
+
}>,
|
|
270
277
|
default: () => [],
|
|
271
278
|
},
|
|
272
279
|
showProfileDropDown: {
|
|
@@ -320,7 +327,10 @@ onMounted(() => {
|
|
|
320
327
|
if (!(e.target as HTMLElement).closest("#menu-dropdown")) {
|
|
321
328
|
showDropDown.value = false;
|
|
322
329
|
}
|
|
323
|
-
if (
|
|
330
|
+
if (
|
|
331
|
+
!(e.target as HTMLElement).closest("#menu-portal-switcher") &&
|
|
332
|
+
!(e.target as HTMLElement).closest("#menu-portal-switcher-mobile")
|
|
333
|
+
) {
|
|
324
334
|
showPortalSwitcherDropDown.value = false;
|
|
325
335
|
}
|
|
326
336
|
if (!(e.target as HTMLElement).closest("#menu-profile-dropdown")) {
|