imacat/lucia-frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: #333 hover blue. fix: #332 v-if replacing v-show

Browse Source
This commit is contained in:
Cindy Chang
2024-08-14 11:14:35 +08:00
parent 2ec7029887
commit 840d81da9f
2 changed files with 13 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
src/components/Header.vue
View File

@@ -6,15 +6,21 @@
</figure>
<div class="flex justify-between items-center relative"
v-show="showMember">
<img v-show="true" id="acct_mgmt_button" src="@/assets/icon-head-black.svg" width="32" height="32"
class="cursor-pointer z-50" @click="toggleIsAcctMenuOpen" alt="user-head"
/>
<img id="acct_mgmt_button" v-if="!isHeadHovered" src="@/assets/icon-head-black.svg" @mouseenter='isHeadHovered = true'
width="32" height="32" @click="toggleIsAcctMenuOpen"
class="cursor-pointer z-50" alt="user-head"
/>
<img id="acct_mgmt_button" v-else src="@/assets/icon-head-blue.svg" @mouseleave='isHeadHovered = false'
width="32" height="32" @click="toggleIsAcctMenuOpen"
class="cursor-pointer z-50" alt="user-head"
/>
</div>
</div>
</div>
</template>
<script>
import { ref, } from 'vue';
import { storeToRefs, } from 'pinia';
import i18next from '@/i18n/i18n';
import loginStore from '@/stores/login.ts';
@@ -39,6 +45,7 @@ export default {
const acctMgmtStore = useAcctMgmtStore();
const { tempFilterId, temporaryData, postRuleData, ruleData } = storeToRefs(allMapDataStore);
const { conformanceLogTempCheckId, conformanceFilterTempCheckId, conformanceFileName } = storeToRefs(conformanceStore);
const isHeadHovered = ref(false);
const toggleIsAcctMenuOpen = () => {
acctMgmtStore.toggleIsAcctMenuOpen();
@@ -51,6 +58,7 @@ export default {
allMapDataStore, conformanceStore,
conformanceFileName,
toggleIsAcctMenuOpen,
isHeadHovered,
};
},
components: {