Skirda/LiveAtlas
4
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Fix server button active state

Browse Source
This commit is contained in:
James Lyne 2021-05-17 15:41:08 +01:00
parent 78a818491e
commit 97fed3fed2
1 changed files with 8 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
src/components/sidebar/ServerListItem.vue
View File

@ -15,8 +15,10 @@
--> -->
<template> <template>
<li :class="{'server': true, 'server--selected': server.id === currentServer.id}"> <li :class="{'server': true, 'server--selected': server.id === currentServer}">
<button type="button" :title="server.label || server.id" @click="setCurrentServer(server.id)">{{ server.label || server.id }}</button> <button type="button" :class="{'active': server.id === currentServer}"
:title="server.label || server.id"
@click="setCurrentServer(server.id)">{{ server.label || server.id }}</button>
</li> </li>
</template> </template>
@ -36,7 +38,7 @@ export default defineComponent({
}, },
computed: { computed: {
currentServer(): LiveAtlasServerDefinition | undefined { currentServer(): string | undefined {
return useStore().state.currentServer; return useStore().state.currentServer;
} }
}, },
@ -50,19 +52,18 @@ export default defineComponent({
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
@import '../../scss/placeholders';
.server { .server {
height: 3.2rem; height: 3.2rem;
button { button {
@extend %button;
text-align: left; text-align: left;
display: block; display: block;
height: 100%; height: 100%;
width: 100%; width: 100%;
border-radius: 0.5rem; border-radius: 0.5rem;
} }
&.server--selected button {
background-color: var(--background-hover);
}
} }
</style> </style>