From a3e8ff61c031c668bed52e57a36f7de3283d4398 Mon Sep 17 00:00:00 2001
From: Eugen Neuber <eugen.neuber@tugraz.at>
Date: Fri, 6 Dec 2019 13:05:17 +0100
Subject: [PATCH] Change chevron-up to -down on @blur
See issue #3
---
packages/auth/src/vpu-auth.js | 15 ++++++++++-----
1 file changed, 10 insertions(+), 5 deletions(-)
diff --git a/packages/auth/src/vpu-auth.js b/packages/auth/src/vpu-auth.js
index 5078d714..7539d90c 100644
--- a/packages/auth/src/vpu-auth.js
+++ b/packages/auth/src/vpu-auth.js
@@ -353,13 +353,17 @@ class VPUAuth extends VPULitElement {
`;
}
- onDropdownClick(event) {
- event.stopPropagation();
- event.currentTarget.classList.toggle('is-active');
+ setChevron(name) {
const chevron = this.shadowRoot.querySelector("#menu-chevron-icon");
if (chevron !== null) {
- chevron.name = event.currentTarget.classList.contains('is-active') ? 'chevron-up' : 'chevron-down';
+ chevron.name = name;
}
+ }
+
+ onDropdownClick(event) {
+ event.stopPropagation();
+ event.currentTarget.classList.toggle('is-active');
+ this.setChevron(event.currentTarget.classList.contains('is-active') ? 'chevron-up' : 'chevron-down');
this.updateDropdownWidth();
}
@@ -368,6 +372,7 @@ class VPUAuth extends VPULitElement {
dropdowns.forEach(function (el) {
el.classList.remove('is-active');
});
+ this.setChevron('chevron-down');
}
onProfileClicked(event) {
@@ -385,7 +390,7 @@ class VPUAuth extends VPULitElement {
<vpu-icon name="chevron-down" id="menu-chevron-icon"></vpu-icon>
</div>
<div class="dropdown-menu" id="dropdown-menu2" role="menu">
- <div class="dropdown-content">
+ <div class="dropdown-content" @blur="${this.closeDropdown}">
${imageURL ? html`<img alt="" src="${imageURL}" class="dropdown-item">` : ''}
<div class="menu">
${this.showProfile ? html`<a href="#" @click="${this.onProfileClicked}" class="dropdown-item">${i18n.t('profile')}</a>` :''}
--
GitLab