aboutsummaryrefslogtreecommitdiff
path: root/src/components
diff options
context:
space:
mode:
Diffstat (limited to 'src/components')
-rw-r--r--src/components/chat_panel/chat_panel.js2
-rw-r--r--src/components/login_form/login_form.js2
-rw-r--r--src/components/notification/notification.js2
-rw-r--r--src/components/oauth_callback/oauth_callback.js2
-rw-r--r--src/components/registration/registration.js4
-rw-r--r--src/components/status/status.js2
-rw-r--r--src/components/user_card/user_card.js2
-rw-r--r--src/components/user_card_content/user_card_content.js2
-rw-r--r--src/components/user_card_content/user_card_content.vue145
-rw-r--r--src/components/user_settings/user_settings.js2
-rw-r--r--src/components/who_to_follow_panel/who_to_follow_panel.js2
11 files changed, 100 insertions, 67 deletions
diff --git a/src/components/chat_panel/chat_panel.js b/src/components/chat_panel/chat_panel.js
index e175e90c..8db12abb 100644
--- a/src/components/chat_panel/chat_panel.js
+++ b/src/components/chat_panel/chat_panel.js
@@ -22,7 +22,7 @@ const chatPanel = {
this.collapsed = !this.collapsed
},
userProfileLink (user) {
- return generateProfileLink(user.id, user.screen_name)
+ return generateProfileLink(user.id, user.screen_name, this.$store.state.instance.restrictedNicknames)
}
}
}
diff --git a/src/components/login_form/login_form.js b/src/components/login_form/login_form.js
index 81426b44..013222a8 100644
--- a/src/components/login_form/login_form.js
+++ b/src/components/login_form/login_form.js
@@ -32,7 +32,7 @@ const LoginForm = {
.then((result) => {
this.$store.commit('setToken', result.access_token)
this.$store.dispatch('loginUser', result.access_token)
- this.$router.push('/~/main/friends')
+ this.$router.push({name: 'friends'})
})
})
}
diff --git a/src/components/notification/notification.js b/src/components/notification/notification.js
index 9ab870b6..e83b2263 100644
--- a/src/components/notification/notification.js
+++ b/src/components/notification/notification.js
@@ -23,7 +23,7 @@ const Notification = {
this.userExpanded = !this.userExpanded
},
userProfileLink (user) {
- return generateProfileLink(user.id, user.screen_name)
+ return generateProfileLink(user.id, user.screen_name, this.$store.state.instance.restrictedNicknames)
}
},
computed: {
diff --git a/src/components/oauth_callback/oauth_callback.js b/src/components/oauth_callback/oauth_callback.js
index 18e24159..e3d45ee1 100644
--- a/src/components/oauth_callback/oauth_callback.js
+++ b/src/components/oauth_callback/oauth_callback.js
@@ -11,7 +11,7 @@ const oac = {
}).then((result) => {
this.$store.commit('setToken', result.access_token)
this.$store.dispatch('loginUser', result.access_token)
- this.$router.push('/~/main/friends')
+ this.$router.push({name: 'friends'})
})
}
}
diff --git a/src/components/registration/registration.js b/src/components/registration/registration.js
index dd8e6e5d..ab6cd64d 100644
--- a/src/components/registration/registration.js
+++ b/src/components/registration/registration.js
@@ -28,7 +28,7 @@ const registration = {
},
created () {
if ((!this.registrationOpen && !this.token) || this.signedIn) {
- this.$router.push('/~/main/all')
+ this.$router.push({name: 'root'})
}
this.setCaptcha()
@@ -58,7 +58,7 @@ const registration = {
if (!this.$v.$invalid) {
try {
await this.signUp(this.user)
- this.$router.push('/~/main/friends')
+ this.$router.push({name: 'friends'})
} catch (error) {
console.warn('Registration failed: ' + error)
}
diff --git a/src/components/status/status.js b/src/components/status/status.js
index e683056f..d4eb0d60 100644
--- a/src/components/status/status.js
+++ b/src/components/status/status.js
@@ -291,7 +291,7 @@ const Status = {
this.showPreview = false
},
userProfileLink (id, name) {
- return generateProfileLink(id, name)
+ return generateProfileLink(id, name, this.$store.state.instance.restrictedNicknames)
}
},
watch: {
diff --git a/src/components/user_card/user_card.js b/src/components/user_card/user_card.js
index f0fff335..615e6487 100644
--- a/src/components/user_card/user_card.js
+++ b/src/components/user_card/user_card.js
@@ -33,7 +33,7 @@ const UserCard = {
this.$store.dispatch('removeFollowRequest', this.user)
},
userProfileLink (user) {
- return generateProfileLink(user.id, user.screen_name)
+ return generateProfileLink(user.id, user.screen_name, this.$store.state.instance.restrictedNicknames)
}
}
}
diff --git a/src/components/user_card_content/user_card_content.js b/src/components/user_card_content/user_card_content.js
index 75185053..6d9b3c2f 100644
--- a/src/components/user_card_content/user_card_content.js
+++ b/src/components/user_card_content/user_card_content.js
@@ -180,7 +180,7 @@ export default {
}
},
userProfileLink (user) {
- return generateProfileLink(user.id, user.screen_name)
+ return generateProfileLink(user.id, user.screen_name, this.$store.state.instance.restrictedNicknames)
}
}
}
diff --git a/src/components/user_card_content/user_card_content.vue b/src/components/user_card_content/user_card_content.vue
index c5222519..c76c41a9 100644
--- a/src/components/user_card_content/user_card_content.vue
+++ b/src/components/user_card_content/user_card_content.vue
@@ -2,22 +2,25 @@
<div id="heading" class="profile-panel-background" :style="headingStyle">
<div class="panel-heading text-center">
<div class='user-info'>
- <router-link @click.native="activatePanel && activatePanel('timeline')" :to="{ name: 'user-settings' }" style="float: right; margin-top:16px;" v-if="!isOtherUser">
- <i class="button-icon icon-cog usersettings" :title="$t('tool_tip.user_settings')"></i>
- </router-link>
- <a :href="user.statusnet_profile_url" target="_blank" class="floater" v-if="isOtherUser">
- <i class="icon-link-ext usersettings"></i>
- </a>
<div class='container'>
<router-link @click.native="activatePanel && activatePanel('timeline')" :to="userProfileLink(user)">
<StillImage class="avatar" :class='{ "better-shadow": betterShadow }' :src="user.profile_image_url_original"/>
</router-link>
<div class="name-and-screen-name">
- <div :title="user.name" class='user-name' v-if="user.name_html" v-html="user.name_html"></div>
- <div :title="user.name" class='user-name' v-else>{{user.name}}</div>
+ <div class="top-line">
+ <div :title="user.name" class='user-name' v-if="user.name_html" v-html="user.name_html"></div>
+ <div :title="user.name" class='user-name' v-else>{{user.name}}</div>
+ <router-link @click.native="activatePanel && activatePanel('timeline')" :to="{ name: 'user-settings' }" v-if="!isOtherUser">
+ <i class="button-icon icon-cog usersettings" :title="$t('tool_tip.user_settings')"></i>
+ </router-link>
+ <a :href="user.statusnet_profile_url" target="_blank" v-if="isOtherUser">
+ <i class="icon-link-ext usersettings"></i>
+ </a>
+ </div>
+
<router-link @click.native="activatePanel && activatePanel('timeline')" class='user-screen-name' :to="userProfileLink(user)">
- <span>@{{user.screen_name}}</span><span v-if="user.locked"><i class="icon icon-lock"></i></span>
- <span v-if="!hideUserStatsLocal" class="dailyAvg">{{dailyAvg}} {{ $t('user_card.per_day') }}</span>
+ <span class="handle">@{{user.screen_name}}</span><span v-if="user.locked"><i class="icon icon-lock"></i></span>
+ <span v-if="!hideUserStatsLocal && !hideBio" class="dailyAvg">{{dailyAvg}} {{ $t('user_card.per_day') }}</span>
</router-link>
</div>
</div>
@@ -25,7 +28,7 @@
<div v-if="user.follows_you && loggedIn && isOtherUser" class="following">
{{ $t('user_card.follows_you') }}
</div>
- <div class="floater" v-if="isOtherUser && (loggedIn || !switcher)">
+ <div class="highlighter" v-if="isOtherUser && (loggedIn || !switcher)">
<!-- id's need to be unique, otherwise vue confuses which user-card checkbox belongs to -->
<input class="userHighlightText" type="text" :id="'userHighlightColorTx'+user.id" v-if="userHighlightType !== 'disabled'" v-model="userHighlightColor"/>
<input class="userHighlightCl" type="color" :id="'userHighlightColor'+user.id" v-if="userHighlightType !== 'disabled'" v-model="userHighlightColor"/>
@@ -139,7 +142,7 @@
border-bottom-right-radius: 0;
.panel-heading {
- padding: 0.6em 0em;
+ padding: .6em 0;
text-align: center;
box-shadow: none;
}
@@ -158,10 +161,10 @@
.user-info {
color: $fallback--lightText;
color: var(--lightText, $fallback--lightText);
- padding: 0 16px;
+ padding: 0 26px;
.container {
- padding: 16px 10px 6px 10px;
+ padding: 16px 0 6px;
display: flex;
max-height: 56px;
@@ -218,11 +221,15 @@
vertical-align: middle;
object-fit: contain
}
+ .top-line {
+ display: flex;
+ }
}
.user-name{
text-overflow: ellipsis;
overflow: hidden;
+ flex: 1 0 auto;
}
.user-screen-name {
@@ -232,27 +239,73 @@
font-weight: light;
font-size: 15px;
padding-right: 0.1em;
+ width: 100%;
+ display: flex;
+
+ .dailyAvg {
+ min-width: 1px;
+ flex: 0 0 auto;
+ }
+
+ .handle {
+ min-width: 1px;
+ flex: 0 1 auto;
+ text-overflow: ellipsis;
+ overflow: hidden;
+ }
}
.user-meta {
- margin-bottom: .4em;
+ margin-bottom: .15em;
+ display: flex;
+ align-items: baseline;
+ font-size: 14px;
+ line-height: 22px;
+ flex-wrap: wrap;
.following {
- font-size: 14px;
- flex: 0 0 100%;
+ flex: 1 0 auto;
margin: 0;
- padding-left: 16px;
+ margin-bottom: .25em;
text-align: left;
- float: left;
- }
- .floater {
- margin: 0;
}
- &::after {
- display: block;
- content: '';
- clear: both;
+ .highlighter {
+ flex: 0 1 auto;
+ display: flex;
+ flex-wrap: wrap;
+ margin-right: -.5em;
+ align-self: start;
+
+ .userHighlightCl {
+ padding: 2px 10px;
+ flex: 1 0 auto;
+ }
+
+ .userHighlightSel,
+ .userHighlightSel.select {
+ padding-top: 0;
+ padding-bottom: 0;
+ flex: 1 0 auto;
+ }
+ .userHighlightSel.select i {
+ line-height: 22px;
+ }
+
+ .userHighlightText {
+ width: 70px;
+ flex: 1 0 auto;
+ }
+
+ .userHighlightCl,
+ .userHighlightText,
+ .userHighlightSel,
+ .userHighlightSel.select {
+ height: 22px;
+ vertical-align: top;
+ margin-right: .5em;
+ margin-bottom: .25em;
+ }
}
}
.user-interactions {
@@ -260,8 +313,13 @@
flex-flow: row wrap;
justify-content: space-between;
+ margin-right: -.75em;
+
div {
- flex: 1;
+ flex: 1 0 0;
+ margin-right: .75em;
+ margin-bottom: .6em;
+ white-space: nowrap;
}
.mute {
@@ -280,8 +338,9 @@
}
button {
- width: 92%;
+ width: 100%;
height: 100%;
+ margin: 0;
}
.remote-button {
@@ -304,10 +363,11 @@
justify-content: space-between;
color: $fallback--lightText;
color: var(--lightText, $fallback--lightText);
+ flex-wrap: wrap;
}
.user-count {
- flex: 1;
+ flex: 1 0 auto;
padding: .5em 0 .5em 0;
margin: 0 .5em;
@@ -327,32 +387,5 @@
color: #CCC;
}
.floater {
- float: right;
- margin-top: 16px;
-
- .userHighlightCl {
- padding: 2px 10px;
- }
- .userHighlightSel,
- .userHighlightSel.select {
- padding-top: 0;
- padding-bottom: 0;
- }
- .userHighlightSel.select i {
- line-height: 22px;
- }
-
- .userHighlightText {
- width: 70px;
- }
-
- .userHighlightCl,
- .userHighlightText,
- .userHighlightSel,
- .userHighlightSel.select {
- height: 22px;
- vertical-align: top;
- margin-right: 0
- }
}
</style>
diff --git a/src/components/user_settings/user_settings.js b/src/components/user_settings/user_settings.js
index d5fac17d..dcce275a 100644
--- a/src/components/user_settings/user_settings.js
+++ b/src/components/user_settings/user_settings.js
@@ -257,7 +257,7 @@ const UserSettings = {
.then((res) => {
if (res.status === 'success') {
this.$store.dispatch('logout')
- this.$router.push('/~/main/all')
+ this.$router.push({name: 'root'})
} else {
this.deleteAccountError = res.error
}
diff --git a/src/components/who_to_follow_panel/who_to_follow_panel.js b/src/components/who_to_follow_panel/who_to_follow_panel.js
index b2183e6d..eaeb527a 100644
--- a/src/components/who_to_follow_panel/who_to_follow_panel.js
+++ b/src/components/who_to_follow_panel/who_to_follow_panel.js
@@ -62,7 +62,7 @@ const WhoToFollowPanel = {
},
methods: {
userProfileLink (id, name) {
- return generateProfileLink(id, name)
+ return generateProfileLink(id, name, this.$store.state.instance.restrictedNicknames)
}
},
watch: {