Page MenuHomePhorge
Files F140724

No OneTemporary
Actions

Size
6 KB
Referenced Files
None
Subscribers
None

View Options

diff --git a/src/components/conversation/conversation.js b/src/components/conversation/conversation.js
index a94d2130..6f6f2cac 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 52d578b1..51c01632 100644
--- a/src/components/conversation/conversation.vue
+++ b/src/components/conversation/conversation.vue
@@ -20,7 +20,7 @@
{{ $t('timeline.collapse') }}
</button>
<QuickFilterSettings
- v-if="!collapsable"
+ v-if="!collapsable && mobileLayout"
:conversation="true"
class="rightside-button"
/>
diff --git a/src/components/quick_filter_settings/quick_filter_settings.js b/src/components/quick_filter_settings/quick_filter_settings.js
index 0d667df5..08565c94 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 3a6ea0bf..0929fd6b 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 @@
<template>
<Popover
- trigger="click"
+ :trigger="nested ? 'hover' : 'click'"
class="QuickFilterSettings"
:bound-to="{ x: 'container' }"
- :trigger-attrs="{ title: $t('timeline.quick_filter_settings') }"
+ :position="nested ? 'right' : 'top'"
+ :trigger-attrs="triggerAttrs"
>
<template #content>
<div
@@ -137,7 +138,19 @@
</div>
</template>
<template #trigger>
- <FAIcon icon="filter" />
+ <div :class="mobileLayout ? 'main-button' : ''">
+ <FAIcon icon="filter" :fixed-width="nested"/>
+ <template v-if="nested">
+ {{$t('timeline.filter_settings')}}
+ </template>
+ <FAIcon
+ v-if="nested"
+ class="chevron-icon"
+ size="lg"
+ icon="chevron-right"
+ fixed-width
+ />
+ </div>
</template>
</Popover>
</template>
diff --git a/src/components/quick_view_settings/quick_view_settings.js b/src/components/quick_view_settings/quick_view_settings.js
index e35fd579..48e04e5b 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 bb7e63d4..342354bd 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"
>
<template #content>
<div
class="dropdown-menu"
role="menu"
>
+ <div
+ v-if="mobileLayout"
+ class="menu-item dropdown-item -icon"
+ >
+ <QuickFilterSettings :nested="true" />
+ </div>
+ <div
+ v-if="mobileLayout"
+ role="separator"
+ class="dropdown-divider"
+ />
<div role="group">
<div class="menu-item dropdown-item -icon-double">
<button
diff --git a/src/components/timeline/timeline.vue b/src/components/timeline/timeline.vue
index f96ffe9d..f003d0ce 100644
--- a/src/components/timeline/timeline.vue
+++ b/src/components/timeline/timeline.vue
@@ -77,6 +77,7 @@
</template>
<QuickFilterSettings
class="rightside-button"
+ v-if="!mobileLayout"
/>
<QuickViewSettings
class="rightside-button"
diff --git a/src/i18n/en.json b/src/i18n/en.json
index 682f7c18..3766e641 100644
--- a/src/i18n/en.json
+++ b/src/i18n/en.json
@@ -1214,7 +1214,8 @@
"socket_reconnected": "Realtime connection established",
"socket_broke": "Realtime connection lost: CloseEvent code {0}",
"quick_view_settings": "Quick view settings",
- "quick_filter_settings": "Quick filter settings"
+ "quick_filter_settings": "Quick filter settings",
+ "filter_settings": "Filter"
},
"status": {
"favorites": "Favorites",

File Metadata

Mime Type
text/x-diff
Expires
Tue, Jan 21, 7:23 AM (22 h, 36 m)
Storage Engine
blob
Storage Format
Raw Data
Storage Handle
55678
Default Alt Text
(6 KB)

Event Timeline