Commit 5be2f63e authored by Rafael's avatar Rafael

Topbar: Use v-if instead of display:none.

parent 16092a58
Pipeline #150269818 failed with stages
in 17 minutes and 29 seconds
<template>
<b-nav-item-dropdown
v-if="show"
v-b-tooltip="$i18n(menuTitle)"
right
:lazy="lazy"
......@@ -40,8 +41,10 @@
</b-nav-item-dropdown>
</template>
<script>
import MediaQueryMixin from '@/utils/VueMediaQueryMixin'
export default {
mixins: [MediaQueryMixin],
props: {
menuTitle: {
type: String,
......@@ -65,6 +68,16 @@ export default {
},
showOnlyOnMobile: { type: Boolean, default: false },
hideOnlyOnMobile: { type: Boolean, default: false }
},
computed: {
show () {
if (this.hideOnlyOnMobile) {
return !(this.wXS || this.wSM)
} else if (this.showOnlyOnMobile) {
return this.wXS || this.wSM
}
return true
}
}
}
</script>
......
<template>
<b-nav-item
v-if="show"
v-b-tooltip.hover.bottom
:class="{'d-none d-md-inline-block': hideOnMobile, 'd-md-none': showOnlyOnMobile}"
:href="url"
:title="title"
:aria-label="title"
......@@ -19,9 +19,11 @@
<script>
import { VBTooltip } from 'bootstrap-vue'
import MediaQueryMixin from '@/utils/VueMediaQueryMixin'
export default {
directives: { VBTooltip },
mixins: [MediaQueryMixin],
props: {
url: { type: String, default: undefined },
icon: { type: String, default: undefined },
......@@ -31,6 +33,16 @@ export default {
hideTitleMobile: { type: Boolean, default: false },
hideOnMobile: { type: Boolean, default: false },
showOnlyOnMobile: { type: Boolean, default: false }
},
computed: {
show () {
if (this.hideOnMobile) {
return !(this.wXS || this.wSM)
} else if (this.showOnlyOnMobile) {
return this.wXS || this.wSM
}
return true
}
}
}
</script>
......
......@@ -39,7 +39,7 @@ export default {
},
methods: {
getWindowWidth (event) {
const w = document.documentElement.clientWidth
const w = window.innerWidth
this.windowWidth = w
this.wXS = w <= mediaQuery.xs.max
this.wSM = w >= mediaQuery.sm.min && w <= mediaQuery.sm.max
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment