Merge pull request #1726 from nextcloud/artonge/fix/aother_tiny_fixes

Another round of tiny fixes

src/components/Composer/Composer.vue

@@ -197,13 +197,12 @@ export default {
 								+ '</div>'
 						},
 						selectTemplate(item) {
-							return `
-								<span class="mention" contenteditable="false">
-									<a href="${item.original.url}" target="_blank">
-										<img src="${item.original.avatar}"/>
-										@${item.original.value}
-									</a>
-								</span>`
+							return '<span class="mention" contenteditable="false">'
+									+ `<a href="${item.original.url}" target="_blank">`
+										+ `<img src="${item.original.avatar}"/>`
+										+ `@${item.original.value}`
+									+ '</a>'
+								+ '</span>&nbsp;'
 						},
 						values: debounce(async (text, populate) => {
 							if (text.length < 1) {
@@ -305,13 +304,19 @@ export default {
 				return
 			}
 
-			this.$refs.composerInput.innerHTML = `
-				<span class="mention" contenteditable="false">
-					<a href="${account.url}" target="_blank">
-						<img src="${account.avatar}"/>
-						@${account.acct}
-					</a>
-				</span>&nbsp;`
+			let handle = account.acct
+
+			if (!handle.includes('@')) {
+				handle += `@${this.hostname}`
+			}
+
+			this.$refs.composerInput.innerHTML
+				= '<span class="mention" contenteditable="false">'
+					+ `<a href="${account.url}" target="_blank">`
+						+ `<img src="${account.avatar}"/>`
+						+ `@${handle}`
+					+ '</a>'
+				+ '</span>&nbsp;'
 			this.updateStatusContent()
 		},
 		updateStatusContent() {
@@ -486,10 +491,16 @@ export default {
 	padding: 5px;
 	padding-left: 30px;
 
+	.avatardiv {
+		margin: 0 4px;
+		margin-block-start: 2px;
+	}
+
 	.reply-info {
 		display: flex;
 		align-items: center;
 	}
+
 	.close-button {
 		margin-left: auto;
 		opacity: .7;

src/components/ProfileInfo.vue

@@ -31,20 +31,19 @@
 			:disable-tooltip="true"
 			:size="128" />
 		<h2>{{ displayName }}</h2>
-		<!-- TODO: we have no details, timeline and follower list for non-local accounts for now -->
-		<ul v-if="isLocal" class="user-profile__info user-profile__sections">
+		<ul class="user-profile__info user-profile__sections">
 			<li>
-				<router-link :to="{ name: 'profile', params: { account: uid } }" class="icon-category-monitoring">
+				<router-link :class="{ disabled: !isLocal }" :to="{ name: 'profile', params: { account: uid } }" class="icon-category-monitoring">
 					{{ accountInfo.statuses_count }} {{ t('social', 'posts') }}
 				</router-link>
 			</li>
 			<li>
-				<router-link :to="{ name: 'profile.following', params: { account: uid } }" class="icon-category-social">
+				<router-link :class="{ disabled: !isLocal }" :to="{ name: 'profile.following', params: { account: uid } }" class="icon-category-social">
 					{{ accountInfo.following_count }}  {{ t('social', 'following') }}
 				</router-link>
 			</li>
 			<li>
-				<router-link :to="{ name: 'profile.followers', params: { account: uid } }" class="icon-category-social">
+				<router-link :class="{ disabled: !isLocal }" :to="{ name: 'profile.followers', params: { account: uid } }" class="icon-category-social">
 					{{ accountInfo.followers_count }}  {{ t('social', 'followers') }}
 				</router-link>
 			</li>
@@ -58,7 +57,7 @@
 		</p>
 
 		<!-- Hack to render note safely -->
-		<MessageContent v-if="accountInfo.note" class="user-profile__note" :item="{content: accountInfo.note, tag: [], mentions: []}" />
+		<MessageContent v-if="accountInfo.note" class="user-profile__note user-profile__info" :item="{content: accountInfo.note, tag: [], mentions: []}" />
 
 		<FollowButton class="user-profile__info" :account="accountInfo.acct" :uid="uid" />
 		<NcButton v-if="serverData.public"
@@ -184,6 +183,14 @@ export default {
 						opacity: 1;
 						border-bottom: 1px solid var(--color-main-text);
 					}
+
+					&.disabled {
+						opacity: 1;
+						border-bottom: none;
+						text-decoration: none;
+						cursor: auto;
+						pointer-events: none;
+					}
 				}
 			}
 		}