aboutsummaryrefslogtreecommitdiff
path: root/src/components/timeline/timeline_quick_settings.vue
diff options
context:
space:
mode:
authorHenry Jameson <me@hjkos.com>2021-03-08 22:01:28 +0200
committerHenry Jameson <me@hjkos.com>2021-03-08 22:01:28 +0200
commit2e7bd99444546b3a71e1ff0753e12e6706c8228e (patch)
treeb01067c88bc969041d23392e7e34c976fae7b801 /src/components/timeline/timeline_quick_settings.vue
parent9a8bc245a6f76f1a41da9d05408dadc36625ffe9 (diff)
parent6281241b92bc17a9535b15a52e656b9f218e3322 (diff)
Merge remote-tracking branch 'origin/develop' into websocket-fixes
* origin/develop: (119 commits) Apply 1 suggestion(s) to 1 file(s) Make it possible to localize user highlight options remove shoutbox test hacks fix shoutbox header, use custom scroll-to-bottom system, remove vue-chat-scroll, temporarily add chat test hack update changelog with 2.3.0 change icons around Translated using Weblate (Japanese) Update timeline_quick_settings.js add screen_name_ui to tests separate screen_name and screen_name_ui with decoded punycode Update CHANGELOG.md add basic validation for statusless status notifications changelog mention fix chat unread badge update shelljs to get rid of warnings on build save a few characters focus input in emoji picker and react picker fix vue warnings add only to wording basic loggedin check for reply filtering ...
Diffstat (limited to 'src/components/timeline/timeline_quick_settings.vue')
-rw-r--r--src/components/timeline/timeline_quick_settings.vue107
1 files changed, 107 insertions, 0 deletions
diff --git a/src/components/timeline/timeline_quick_settings.vue b/src/components/timeline/timeline_quick_settings.vue
new file mode 100644
index 00000000..4ad2842b
--- /dev/null
+++ b/src/components/timeline/timeline_quick_settings.vue
@@ -0,0 +1,107 @@
+<template>
+ <Popover
+ trigger="click"
+ class="TimelineQuickSettings"
+ :bound-to="{ x: 'container' }"
+ >
+ <div
+ slot="content"
+ class="timeline-settings-menu dropdown-menu"
+ >
+ <div v-if="loggedIn">
+ <button
+ class="button-default dropdown-item"
+ @click="replyVisibilityAll = true"
+ >
+ <span
+ class="menu-checkbox"
+ :class="{ 'menu-checkbox-radio': replyVisibilityAll }"
+ />{{ $t('settings.reply_visibility_all') }}
+ </button>
+ <button
+ class="button-default dropdown-item"
+ @click="replyVisibilityFollowing = true"
+ >
+ <span
+ class="menu-checkbox"
+ :class="{ 'menu-checkbox-radio': replyVisibilityFollowing }"
+ />{{ $t('settings.reply_visibility_following_short') }}
+ </button>
+ <button
+ class="button-default dropdown-item"
+ @click="replyVisibilitySelf = true"
+ >
+ <span
+ class="menu-checkbox"
+ :class="{ 'menu-checkbox-radio': replyVisibilitySelf }"
+ />{{ $t('settings.reply_visibility_self_short') }}
+ </button>
+ <div
+ role="separator"
+ class="dropdown-divider"
+ />
+ </div>
+ <button
+ class="button-default dropdown-item"
+ @click="hideMedia = !hideMedia"
+ >
+ <span
+ class="menu-checkbox"
+ :class="{ 'menu-checkbox-checked': hideMedia }"
+ />{{ $t('settings.hide_media_previews') }}
+ </button>
+ <button
+ class="button-default dropdown-item"
+ @click="hideMutedPosts = !hideMutedPosts"
+ >
+ <span
+ class="menu-checkbox"
+ :class="{ 'menu-checkbox-checked': hideMutedPosts }"
+ />{{ $t('settings.hide_all_muted_posts') }}
+ </button>
+ <button
+ class="button-default dropdown-item dropdown-item-icon"
+ @click="openTab('filtering')"
+ >
+ <FAIcon icon="font" />{{ $t('settings.word_filter') }}
+ </button>
+ <button
+ class="button-default dropdown-item dropdown-item-icon"
+ @click="openTab('general')"
+ >
+ <FAIcon icon="wrench" />{{ $t('settings.more_settings') }}
+ </button>
+ </div>
+ <div slot="trigger">
+ <FAIcon icon="filter" />
+ </div>
+ </Popover>
+</template>
+
+<script src="./timeline_quick_settings.js"></script>
+
+<style lang="scss">
+
+.TimelineQuickSettings {
+ align-self: stretch;
+
+ > button {
+ font-size: 1.2em;
+ padding-left: 0.7em;
+ padding-right: 0.2em;
+ line-height: 100%;
+ height: 100%;
+ }
+
+ .dropdown-item {
+ margin: 0;
+ }
+
+ .timeline-settings-menu {
+ display: flex;
+ min-width: 12em;
+ flex-direction: column;
+ }
+}
+
+</style>