diff --git a/src/components/conversation/conversation.js b/src/components/conversation/conversation.js index a94d2130d..6f6f2cac2 100644 --- a/src/components/conversation/conversation.js +++ b/src/components/conversation/conversation.js @@ -350,6 +350,7 @@ const conversation = { }, ...mapGetters(['mergedConfig']), ...mapState({ + mobileLayout: state => state.interface.layoutType === 'mobile', mastoUserSocketStatus: state => state.api.mastoUserSocketStatus }) }, diff --git a/src/components/conversation/conversation.vue b/src/components/conversation/conversation.vue index 52d578b1e..51c016323 100644 --- a/src/components/conversation/conversation.vue +++ b/src/components/conversation/conversation.vue @@ -20,7 +20,7 @@ {{ $t('timeline.collapse') }} diff --git a/src/components/quick_filter_settings/quick_filter_settings.js b/src/components/quick_filter_settings/quick_filter_settings.js index 0d667df5c..08565c943 100644 --- a/src/components/quick_filter_settings/quick_filter_settings.js +++ b/src/components/quick_filter_settings/quick_filter_settings.js @@ -1,5 +1,5 @@ import Popover from '../popover/popover.vue' -import { mapGetters } from 'vuex' +import { mapGetters, mapState } from 'vuex' import { library } from '@fortawesome/fontawesome-svg-core' import { faFilter, faFont, faWrench } from '@fortawesome/free-solid-svg-icons' @@ -11,7 +11,8 @@ library.add( const QuickFilterSettings = { props: { - conversation: Boolean + conversation: Boolean, + nested: Boolean }, components: { Popover @@ -27,6 +28,25 @@ const QuickFilterSettings = { }, computed: { ...mapGetters(['mergedConfig']), + ...mapState({ + mobileLayout: state => state.interface.layoutType === 'mobile' + }), + triggerAttrs () { + if (this.mobileLayout) { + return {} + } else { + return { + title: this.$t('timeline.quick_filter_settings') + } + } + }, + mainClass () { + if (this.mobileLayout) { + return 'main-button' + } else { + return 'dropdown-item' + } + }, loggedIn () { return !!this.$store.state.users.currentUser }, diff --git a/src/components/quick_filter_settings/quick_filter_settings.vue b/src/components/quick_filter_settings/quick_filter_settings.vue index 3a6ea0bf3..0929fd6b5 100644 --- a/src/components/quick_filter_settings/quick_filter_settings.vue +++ b/src/components/quick_filter_settings/quick_filter_settings.vue @@ -1,9 +1,10 @@ diff --git a/src/components/quick_view_settings/quick_view_settings.js b/src/components/quick_view_settings/quick_view_settings.js index e35fd579d..48e04e5b4 100644 --- a/src/components/quick_view_settings/quick_view_settings.js +++ b/src/components/quick_view_settings/quick_view_settings.js @@ -1,5 +1,6 @@ -import Popover from '../popover/popover.vue' -import { mapGetters } from 'vuex' +import Popover from 'src/components/popover/popover.vue' +import QuickFilterSettings from 'src/components/quick_filter_settings/quick_filter_settings.vue' +import { mapGetters, mapState } from 'vuex' import { library } from '@fortawesome/fontawesome-svg-core' import { faList, faFolderTree, faBars, faWrench } from '@fortawesome/free-solid-svg-icons' @@ -15,7 +16,8 @@ const QuickViewSettings = { conversation: Boolean }, components: { - Popover + Popover, + QuickFilterSettings }, methods: { setConversationDisplay (visibility) { @@ -27,6 +29,9 @@ const QuickViewSettings = { }, computed: { ...mapGetters(['mergedConfig']), + ...mapState({ + mobileLayout: state => state.interface.layoutType === 'mobile' + }), loggedIn () { return !!this.$store.state.users.currentUser }, diff --git a/src/components/quick_view_settings/quick_view_settings.vue b/src/components/quick_view_settings/quick_view_settings.vue index bb7e63d40..342354bd0 100644 --- a/src/components/quick_view_settings/quick_view_settings.vue +++ b/src/components/quick_view_settings/quick_view_settings.vue @@ -3,13 +3,24 @@ trigger="click" class="QuickViewSettings" :bound-to="{ x: 'container' }" - :trigger-attrs="{ title: $t('timeline.quick_view_settings') }" + :trigger-attrs="triggerAttrs" >