diff --git a/README.md b/README.md index 6a02cb58..303ad315 100644 --- a/README.md +++ b/README.md @@ -15,6 +15,7 @@ Some requirements in this alpha stage are that your Nextcloud: - **๐Ÿ“œ Profile info:** No need to fill out more profiles โ€“ your info from Nextcloud will be used and extended. - **๐Ÿ‘ Own your posts:** Everything you post stays on your Nextcloud! - **๐Ÿ•ธ Open standards:** We use the established [ActivityPub](https://en.wikipedia.org/wiki/ActivityPub) standard! +- **๐ŸŽจ Nice illustrations:** Made by [Katerina Limpitsouni of unDraw](https://undraw.co). ## Development setup diff --git a/img/undraw/direct.svg b/img/undraw/direct.svg new file mode 100644 index 00000000..e05224b7 --- /dev/null +++ b/img/undraw/direct.svg @@ -0,0 +1 @@ +word of mouth diff --git a/img/undraw/global.svg b/img/undraw/global.svg new file mode 100644 index 00000000..500b086b --- /dev/null +++ b/img/undraw/global.svg @@ -0,0 +1 @@ +group chat diff --git a/img/undraw/likes.svg b/img/undraw/likes.svg new file mode 100644 index 00000000..ac852647 --- /dev/null +++ b/img/undraw/likes.svg @@ -0,0 +1 @@ +super thank you diff --git a/img/undraw/local.svg b/img/undraw/local.svg new file mode 100644 index 00000000..6f9bf0a0 --- /dev/null +++ b/img/undraw/local.svg @@ -0,0 +1 @@ +work chat diff --git a/img/undraw/notifications.svg b/img/undraw/notifications.svg new file mode 100644 index 00000000..84f3f1c9 --- /dev/null +++ b/img/undraw/notifications.svg @@ -0,0 +1 @@ +texting diff --git a/img/undraw/posts.svg b/img/undraw/posts.svg new file mode 100644 index 00000000..0804e4b5 --- /dev/null +++ b/img/undraw/posts.svg @@ -0,0 +1 @@ +hang out diff --git a/img/undraw/profile.svg b/img/undraw/profile.svg new file mode 100644 index 00000000..7133e5b5 --- /dev/null +++ b/img/undraw/profile.svg @@ -0,0 +1 @@ +blank canvas diff --git a/img/undraw/setup.svg b/img/undraw/setup.svg new file mode 100644 index 00000000..ba0eab52 --- /dev/null +++ b/img/undraw/setup.svg @@ -0,0 +1 @@ +server status diff --git a/src/components/Composer.vue b/src/components/Composer.vue index 11f20a0e..1bdb78b6 100644 --- a/src/components/Composer.vue +++ b/src/components/Composer.vue @@ -33,7 +33,7 @@
+ placeholder="What would you like to share?" @keyup.enter="keyup" /> diff --git a/src/components/EmptyContent.vue b/src/components/EmptyContent.vue new file mode 100644 index 00000000..82e62ef0 --- /dev/null +++ b/src/components/EmptyContent.vue @@ -0,0 +1,56 @@ + + + + + + diff --git a/src/views/Timeline.vue b/src/views/Timeline.vue index d719c04f..81b9fdea 100644 --- a/src/views/Timeline.vue +++ b/src/views/Timeline.vue @@ -17,10 +17,7 @@
-
-
-

{{ t('social', 'No posts found.') }}

-
+
@@ -90,6 +87,7 @@ import InfiniteLoading from 'vue-infinite-loading' import TimelineEntry from './../components/TimelineEntry' import Composer from './../components/Composer' import CurrentUserMixin from './../mixins/currentUserMixin' +import EmptyContent from './../components/EmptyContent' export default { name: 'Timeline', @@ -99,16 +97,45 @@ export default { TimelineEntry, Multiselect, Composer, - InfiniteLoading + InfiniteLoading, + EmptyContent }, mixins: [CurrentUserMixin], data: function() { return { infoHidden: false, - state: [] + state: [], + emptyContent: { + default: { + image: 'img/undraw/posts.svg', + title: t('social', 'No posts found'), + description: t('social', 'Posts from people you follow will show up here') + }, + direct: { + image: 'img/undraw/direct.svg', + title: t('social', 'No direct messages found'), + description: t('social', 'Posts directed to you will show up here') + }, + timeline: { + image: 'img/undraw/local.svg', + title: t('social', 'No local posts found'), + description: t('social', 'Posts from other people on this instance will show up here') + }, + federated: { + image: 'img/undraw/global.svg', + title: t('social', 'No global posts found'), + description: t('social', 'Posts from federated instances will show up here') + } + } } }, computed: { + emptyContentData() { + if (typeof this.emptyContent[this.$route.params.type] !== 'undefined') { + return this.emptyContent[this.$route.params.type] + } + return this.emptyContent.default + }, type: function() { if (this.$route.params.type) { return this.$route.params.type