diff options
Diffstat (limited to 'src')
| -rw-r--r-- | src/components/status/status.js | 10 | ||||
| -rw-r--r-- | src/components/status/status.vue | 12 | ||||
| -rw-r--r-- | src/main.js | 3 | ||||
| -rw-r--r-- | src/modules/users.js | 7 | ||||
| -rw-r--r-- | src/services/style_setter/style_setter.js | 2 |
5 files changed, 27 insertions, 7 deletions
diff --git a/src/components/status/status.js b/src/components/status/status.js index 3d1d50fb..030e22b5 100644 --- a/src/components/status/status.js +++ b/src/components/status/status.js @@ -3,6 +3,7 @@ import FavoriteButton from '../favorite_button/favorite_button.vue' import RetweetButton from '../retweet_button/retweet_button.vue' import DeleteButton from '../delete_button/delete_button.vue' import PostStatusForm from '../post_status_form/post_status_form.vue' +import UserCardContent from '../user_card_content/user_card_content.vue' const Status = { props: [ @@ -12,7 +13,8 @@ const Status = { data: () => ({ replying: false, expanded: false, - unmuted: false + unmuted: false, + userExpanded: false }), computed: { retweet () { return !!this.statusoid.retweeted_status }, @@ -34,7 +36,8 @@ const Status = { FavoriteButton, RetweetButton, DeleteButton, - PostStatusForm + PostStatusForm, + UserCardContent }, methods: { toggleReplying () { @@ -45,6 +48,9 @@ const Status = { }, toggleMute () { this.unmuted = !this.unmuted + }, + toggleUserExpanded () { + this.userExpanded = !this.userExpanded } } } diff --git a/src/components/status/status.vue b/src/components/status/status.vue index c215a00b..0c004936 100644 --- a/src/components/status/status.vue +++ b/src/components/status/status.vue @@ -18,10 +18,13 @@ <div class="media status container"> <div class="media-left"> <a :href="status.user.statusnet_profile_url"> - <img class='avatar' :src="status.user.profile_image_url_original"> + <img @click.prevent="toggleUserExpanded" class='avatar' :src="status.user.profile_image_url_original"> </a> </div> <div class="media-body"> + <div class="base05 base05=border usercard" v-if="userExpanded"> + <user-card-content :user="status.user"></user-card-content> + </div> <div class="user-content"> <h4 class="media-heading"> {{status.user.name}} @@ -147,4 +150,11 @@ display: block; margin-left: auto; } + + .usercard { + border-style: solid; + border-width: 1px; + border-radius: 1em; + margin-bottom: 1em; + } </style> diff --git a/src/main.js b/src/main.js index 84db5c86..20489d42 100644 --- a/src/main.js +++ b/src/main.js @@ -38,7 +38,8 @@ const store = new Vuex.Store({ api: apiModule, config: configModule }, - plugins: [createPersistedState(persistedStateOptions)] + plugins: [createPersistedState(persistedStateOptions)], + strict: process.env.NODE_ENV !== 'production' }) const routes = [ diff --git a/src/modules/users.js b/src/modules/users.js index dd65afe1..ae90abbd 100644 --- a/src/modules/users.js +++ b/src/modules/users.js @@ -33,6 +33,9 @@ export const mutations = { }, addNewUsers (state, users) { each(users, (user) => mergeOrAdd(state.users, user)) + }, + setUserForStatus (state, status) { + status.user = find(state.users, status.user) } } @@ -54,11 +57,11 @@ const users = { // Reconnect users to statuses each(statuses, (status) => { - status.user = find(store.state.users, status.user) + store.commit('setUserForStatus', status) }) // Reconnect users to retweets each(compact(map(statuses, 'retweeted_status')), (status) => { - status.user = find(store.state.users, status.user) + store.commit('setUserForStatus', status) }) }, loginUser (store, userCredentials) { diff --git a/src/services/style_setter/style_setter.js b/src/services/style_setter/style_setter.js index 79b68b38..0a5be77d 100644 --- a/src/services/style_setter/style_setter.js +++ b/src/services/style_setter/style_setter.js @@ -34,7 +34,7 @@ const setStyle = (href) => { styleSheet.insertRule(`a { color: ${base08Color}`, 'index-max') styleSheet.insertRule(`body { color: ${base05Color}`, 'index-max') - styleSheet.insertRule(`.base05-border { color: ${base05Color}`, 'index-max') + styleSheet.insertRule(`.base05-border { border-color: ${base05Color}`, 'index-max') body.style.display = 'initial' } cssEl.addEventListener('load', setDynamic) |