fix: use BaseButton in MenuButton and fix computed #1532

Merged
konrad merged 1 commits from dpschen/frontend:feature/fix-menu-button into main 2022-02-13 22:01:37 +00:00
1 changed files with 8 additions and 11 deletions

View File

@ -1,8 +1,7 @@
<template> <template>
<button <BaseButton
type="button"
@click="$store.commit('toggleMenu')"
class="menu-show-button" class="menu-show-button"
@click="$store.commit('toggleMenu')"
@shortkey="() => $store.commit('toggleMenu')" @shortkey="() => $store.commit('toggleMenu')"
v-shortcut="'Control+e'" v-shortcut="'Control+e'"
:title="$t('keyboardShortcuts.toggleMenu')" :title="$t('keyboardShortcuts.toggleMenu')"
@ -10,11 +9,14 @@
/> />
</template> </template>
<script setup> <script setup lang="ts">
import {computed} from 'vue' import {computed} from 'vue'
import {store} from '@/store' import {useStore} from 'vuex'
const menuActive = computed(() => store.menuActive) import BaseButton from '@/components/base/BaseButton.vue'
const store = useStore()
const menuActive = computed(() => store.state.menuActive)
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
@ -22,11 +24,6 @@ $lineWidth: 2rem;
$size: $lineWidth + 1rem; $size: $lineWidth + 1rem;
.menu-show-button { .menu-show-button {
// FIXME: create general button component
appearance: none;
background-color: transparent;
border: 0;
min-height: $size; min-height: $size;
width: $size; width: $size;