diff --git a/build/utils.js b/build/utils.js index 3beee7742..b45ffc163 100644 --- a/build/utils.js +++ b/build/utils.js @@ -58,7 +58,5 @@ exports.cssLoaders = function (options) { // Generate loaders for standalone style files (outside of .vue) exports.styleLoaders = function (options) { - var output = exports.cssLoaders(options) - console.log(output) - return output + return exports.cssLoaders(options) } diff --git a/build/webpack.prod.conf.js b/build/webpack.prod.conf.js index e7d25bfe3..ed11ebad3 100644 --- a/build/webpack.prod.conf.js +++ b/build/webpack.prod.conf.js @@ -14,8 +14,6 @@ let commitHash = require('child_process') .execSync('git rev-parse --short HEAD') .toString(); -console.log(commitHash) - var webpackConfig = merge(baseWebpackConfig, { mode: 'production', module: { diff --git a/index.html b/index.html index 5fae8b61d..948778924 100644 --- a/index.html +++ b/index.html @@ -2,7 +2,7 @@ - + Pleroma diff --git a/src/App.scss b/src/App.scss index 2729e0b01..52a786ad0 100644 --- a/src/App.scss +++ b/src/App.scss @@ -625,21 +625,6 @@ nav { text-align: right; } -.visibility-tray { - font-size: 1.2em; - padding: 3px; - cursor: pointer; - - .selected { - color: $fallback--lightText; - color: var(--lightText, $fallback--lightText); - } - - div { - padding-top: 5px; - } -} - .visibility-notice { padding: .5em; border: 1px solid $fallback--faint; @@ -740,6 +725,70 @@ nav { } } +.setting-item { + border-bottom: 2px solid var(--fg, $fallback--fg); + margin: 1em 1em 1.4em; + padding-bottom: 1.4em; + + > div { + margin-bottom: .5em; + &:last-child { + margin-bottom: 0; + } + } + + &:last-child { + border-bottom: none; + padding-bottom: 0; + margin-bottom: 1em; + } + + select { + min-width: 10em; + } + + + textarea { + width: 100%; + max-width: 100%; + height: 100px; + } + + .unavailable, + .unavailable i { + color: var(--cRed, $fallback--cRed); + color: $fallback--cRed; + } + + .btn { + min-height: 28px; + min-width: 10em; + padding: 0 2em; + } + + .number-input { + max-width: 6em; + } +} +.select-multiple { + display: flex; + .option-list { + margin: 0; + padding-left: .5em; + } +} +.setting-list, +.option-list{ + list-style-type: none; + padding-left: 2em; + li { + margin-bottom: 0.5em; + } + .suboptions { + margin-top: 0.3em + } +} + .login-hint { text-align: center; diff --git a/src/boot/routes.js b/src/boot/routes.js index 7e54a98bc..1a1790991 100644 --- a/src/boot/routes.js +++ b/src/boot/routes.js @@ -3,7 +3,7 @@ import PublicAndExternalTimeline from 'components/public_and_external_timeline/p import FriendsTimeline from 'components/friends_timeline/friends_timeline.vue' import TagTimeline from 'components/tag_timeline/tag_timeline.vue' import ConversationPage from 'components/conversation-page/conversation-page.vue' -import Mentions from 'components/mentions/mentions.vue' +import Interactions from 'components/interactions/interactions.vue' import DMs from 'components/dm_timeline/dm_timeline.vue' import UserProfile from 'components/user_profile/user_profile.vue' import Settings from 'components/settings/settings.vue' @@ -34,7 +34,7 @@ export default (store) => { { name: 'tag-timeline', path: '/tag/:tag', component: TagTimeline }, { name: 'conversation', path: '/notice/:id', component: ConversationPage, meta: { dontScroll: true } }, { name: 'external-user-profile', path: '/users/:id', component: UserProfile }, - { name: 'mentions', path: '/users/:username/mentions', component: Mentions }, + { name: 'interactions', path: '/users/:username/interactions', component: Interactions }, { name: 'dms', path: '/users/:username/dms', component: DMs }, { name: 'settings', path: '/settings', component: Settings }, { name: 'registration', path: '/registration', component: Registration }, diff --git a/src/components/conversation/conversation.js b/src/components/conversation/conversation.js index ffeb7244f..b30745909 100644 --- a/src/components/conversation/conversation.js +++ b/src/components/conversation/conversation.js @@ -41,7 +41,8 @@ const conversation = { props: [ 'statusoid', 'collapsable', - 'isPage' + 'isPage', + 'showPinned' ], created () { if (this.isPage) { diff --git a/src/components/conversation/conversation.vue b/src/components/conversation/conversation.vue index d04ff7222..0b4998c34 100644 --- a/src/components/conversation/conversation.vue +++ b/src/components/conversation/conversation.vue @@ -14,6 +14,7 @@ :inlineExpanded="collapsable && isExpanded" :statusoid="status" :expandable='!isExpanded' + :showPinned="showPinned" :focused="focused(status.id)" :inConversation="isExpanded" :highlight="getHighlight()" diff --git a/src/components/delete_button/delete_button.js b/src/components/delete_button/delete_button.js deleted file mode 100644 index 22f246257..000000000 --- a/src/components/delete_button/delete_button.js +++ /dev/null @@ -1,21 +0,0 @@ -const DeleteButton = { - props: [ 'status' ], - methods: { - deleteStatus () { - const confirmed = window.confirm('Do you really want to delete this status?') - if (confirmed) { - this.$store.dispatch('deleteStatus', { id: this.status.id }) - } - } - }, - computed: { - currentUser () { return this.$store.state.users.currentUser }, - canDelete () { - if (!this.currentUser) { return } - const superuser = this.currentUser.rights.moderator || this.currentUser.rights.admin - return superuser || this.status.user.id === this.currentUser.id - } - } -} - -export default DeleteButton diff --git a/src/components/delete_button/delete_button.vue b/src/components/delete_button/delete_button.vue deleted file mode 100644 index f4c91cfd7..000000000 --- a/src/components/delete_button/delete_button.vue +++ /dev/null @@ -1,21 +0,0 @@ - - - - - diff --git a/src/components/extra_buttons/extra_buttons.js b/src/components/extra_buttons/extra_buttons.js new file mode 100644 index 000000000..528da301f --- /dev/null +++ b/src/components/extra_buttons/extra_buttons.js @@ -0,0 +1,64 @@ +import Popper from 'vue-popperjs/src/component/popper.js.vue' + +const ExtraButtons = { + props: [ 'status' ], + components: { + Popper + }, + data () { + return { + showDropDown: false, + showPopper: true + } + }, + methods: { + deleteStatus () { + this.refreshPopper() + const confirmed = window.confirm(this.$t('status.delete_confirm')) + if (confirmed) { + this.$store.dispatch('deleteStatus', { id: this.status.id }) + } + }, + toggleMenu () { + this.showDropDown = !this.showDropDown + }, + pinStatus () { + this.refreshPopper() + this.$store.dispatch('pinStatus', this.status.id) + .then(() => this.$emit('onSuccess')) + .catch(err => this.$emit('onError', err.error.error)) + }, + unpinStatus () { + this.refreshPopper() + this.$store.dispatch('unpinStatus', this.status.id) + .then(() => this.$emit('onSuccess')) + .catch(err => this.$emit('onError', err.error.error)) + }, + refreshPopper () { + this.showPopper = false + this.showDropDown = false + setTimeout(() => { + this.showPopper = true + }) + } + }, + computed: { + currentUser () { return this.$store.state.users.currentUser }, + canDelete () { + if (!this.currentUser) { return } + const superuser = this.currentUser.rights.moderator || this.currentUser.rights.admin + return superuser || this.status.user.id === this.currentUser.id + }, + ownStatus () { + return this.status.user.id === this.currentUser.id + }, + canPin () { + return this.ownStatus && (this.status.visibility === 'public' || this.status.visibility === 'unlisted') + }, + enabled () { + return this.canPin || this.canDelete + } + } +} + +export default ExtraButtons diff --git a/src/components/extra_buttons/extra_buttons.vue b/src/components/extra_buttons/extra_buttons.vue new file mode 100644 index 000000000..ef11138db --- /dev/null +++ b/src/components/extra_buttons/extra_buttons.vue @@ -0,0 +1,47 @@ + + + + + diff --git a/src/components/interactions/interactions.js b/src/components/interactions/interactions.js new file mode 100644 index 000000000..d4e3cc172 --- /dev/null +++ b/src/components/interactions/interactions.js @@ -0,0 +1,25 @@ +import Notifications from '../notifications/notifications.vue' + +const tabModeDict = { + mentions: ['mention'], + 'likes+repeats': ['repeat', 'like'], + follows: ['follow'] +} + +const Interactions = { + data () { + return { + filterMode: tabModeDict['mentions'] + } + }, + methods: { + onModeSwitch (index, dataset) { + this.filterMode = tabModeDict[dataset.filter] + } + }, + components: { + Notifications + } +} + +export default Interactions diff --git a/src/components/interactions/interactions.vue b/src/components/interactions/interactions.vue new file mode 100644 index 000000000..5a204ca73 --- /dev/null +++ b/src/components/interactions/interactions.vue @@ -0,0 +1,25 @@ + + + diff --git a/src/components/mentions/mentions.vue b/src/components/mentions/mentions.vue index bba06da62..6b4e96e0b 100644 --- a/src/components/mentions/mentions.vue +++ b/src/components/mentions/mentions.vue @@ -1,5 +1,5 @@ diff --git a/src/components/moderation_tools/moderation_tools.vue b/src/components/moderation_tools/moderation_tools.vue index c24a22805..c9e3fc780 100644 --- a/src/components/moderation_tools/moderation_tools.vue +++ b/src/components/moderation_tools/moderation_tools.vue @@ -127,6 +127,14 @@ width: 100%; height: 100%; + &-icon { + padding-left: 0.5rem; + + i { + margin-right: 0.25rem; + } + } + &:hover { // TODO: improve the look on breeze themes background-color: $fallback--fg; diff --git a/src/components/nav_panel/nav_panel.vue b/src/components/nav_panel/nav_panel.vue index 7a7212fb1..e6e0f0740 100644 --- a/src/components/nav_panel/nav_panel.vue +++ b/src/components/nav_panel/nav_panel.vue @@ -8,8 +8,8 @@
  • - - {{ $t("nav.mentions") }} + + {{ $t("nav.interactions") }}
  • diff --git a/src/components/notifications/notifications.js b/src/components/notifications/notifications.js index 5b13b98ea..8c97eb048 100644 --- a/src/components/notifications/notifications.js +++ b/src/components/notifications/notifications.js @@ -7,15 +7,24 @@ import { } from '../../services/notification_utils/notification_utils.js' const Notifications = { - props: [ - 'noHeading' - ], + props: { + // Disables display of panel header + noHeading: Boolean, + // Disables panel styles, unread mark, potentially other notification-related actions + // meant for "Interactions" timeline + minimalMode: Boolean, + // Custom filter mode, an array of strings, possible values 'mention', 'repeat', 'like', 'follow', used to override global filter for use in "Interactions" timeline + filterMode: Array + }, data () { return { bottomedOut: false } }, computed: { + mainClass () { + return this.minimalMode ? '' : 'panel panel-default' + }, notifications () { return notificationsFromStore(this.$store) }, @@ -26,7 +35,8 @@ const Notifications = { return unseenNotificationsFromStore(this.$store) }, visibleNotifications () { - return visibleNotificationsFromStore(this.$store) + console.log(this.filterMode) + return visibleNotificationsFromStore(this.$store, this.filterMode) }, unseenCount () { return this.unseenNotifications.length diff --git a/src/components/notifications/notifications.scss b/src/components/notifications/notifications.scss index c0b458ccf..622d12f47 100644 --- a/src/components/notifications/notifications.scss +++ b/src/components/notifications/notifications.scss @@ -1,8 +1,10 @@ @import '../../_variables.scss'; .notifications { - // a bit of a hack to allow scrolling below notifications - padding-bottom: 15em; + &:not(.minimal) { + // a bit of a hack to allow scrolling below notifications + padding-bottom: 15em; + } .loadmore-error { color: $fallback--text; diff --git a/src/components/notifications/notifications.vue b/src/components/notifications/notifications.vue index 88775be16..c71499b2b 100644 --- a/src/components/notifications/notifications.vue +++ b/src/components/notifications/notifications.vue @@ -1,6 +1,6 @@