リファクタリングなど
This commit is contained in:
@ -1,8 +1,6 @@
|
||||
<template>
|
||||
<div class="root sub">
|
||||
<router-link class="avatar-anchor" :to="note.user | userPage">
|
||||
<img class="avatar" :src="`${note.user.avatarUrl}?thumbnail&size=64`" alt="avatar"/>
|
||||
</router-link>
|
||||
<mk-avatar class="avatar" :user="note.user"/>
|
||||
<div class="main">
|
||||
<header>
|
||||
<router-link class="name" :to="note.user | userPage">{{ note.user | userName }}</router-link>
|
||||
@ -43,18 +41,13 @@ root(isDark)
|
||||
display block
|
||||
clear both
|
||||
|
||||
> .avatar-anchor
|
||||
> .avatar
|
||||
display block
|
||||
float left
|
||||
margin 0 12px 0 0
|
||||
|
||||
> .avatar
|
||||
display block
|
||||
width 48px
|
||||
height 48px
|
||||
margin 0
|
||||
border-radius 8px
|
||||
vertical-align bottom
|
||||
width 48px
|
||||
height 48px
|
||||
border-radius 8px
|
||||
|
||||
> .main
|
||||
float left
|
||||
|
@ -17,17 +17,12 @@
|
||||
</div>
|
||||
<div class="renote" v-if="isRenote">
|
||||
<p>
|
||||
<router-link class="avatar-anchor" :to="note.user | userPage">
|
||||
<img class="avatar" :src="`${note.user.avatarUrl}?thumbnail&size=32`" alt="avatar"/>
|
||||
</router-link>
|
||||
%fa:retweet%<router-link class="name" :to="note.user | userPage">{{ note.user | userName }}</router-link>がRenote
|
||||
<mk-avatar class="avatar" :user="note.user"/>%fa:retweet%<router-link class="name" :to="note.user | userPage">{{ note.user | userName }}</router-link>がRenote
|
||||
</p>
|
||||
</div>
|
||||
<article>
|
||||
<header>
|
||||
<router-link class="avatar-anchor" :to="p.user | userPage">
|
||||
<img class="avatar" :src="`${p.user.avatarUrl}?thumbnail&size=64`" alt="avatar"/>
|
||||
</router-link>
|
||||
<mk-avatar class="avatar" :user="p.user"/>
|
||||
<div>
|
||||
<router-link class="name" :to="p.user | userPage">{{ p.user | userName }}</router-link>
|
||||
<span class="username">@{{ p.user | acct }}</span>
|
||||
@ -152,7 +147,7 @@ export default Vue.extend({
|
||||
|
||||
// Draw map
|
||||
if (this.p.geo) {
|
||||
const shouldShowMap = (this as any).os.isSignedIn ? (this as any).os.i.clientSettings.showMaps : true;
|
||||
const shouldShowMap = (this as any).os.isSignedIn ? (this as any).clientSettings.showMaps : true;
|
||||
if (shouldShowMap) {
|
||||
(this as any).os.getGoogleMaps().then(maps => {
|
||||
const uluru = new maps.LatLng(this.p.geo.coordinates[1], this.p.geo.coordinates[0]);
|
||||
@ -262,17 +257,12 @@ root(isDark)
|
||||
margin 0
|
||||
padding 16px 32px
|
||||
|
||||
.avatar-anchor
|
||||
.avatar
|
||||
display inline-block
|
||||
|
||||
.avatar
|
||||
vertical-align bottom
|
||||
min-width 28px
|
||||
min-height 28px
|
||||
max-width 28px
|
||||
max-height 28px
|
||||
margin 0 8px 0 0
|
||||
border-radius 6px
|
||||
width 28px
|
||||
height 28px
|
||||
margin 0 8px 0 0
|
||||
border-radius 6px
|
||||
|
||||
[data-fa]
|
||||
margin-right 4px
|
||||
@ -301,21 +291,16 @@ root(isDark)
|
||||
display flex
|
||||
line-height 1.1em
|
||||
|
||||
> .avatar-anchor
|
||||
> .avatar
|
||||
display block
|
||||
padding 0 12px 0 0
|
||||
margin 0 12px 0 0
|
||||
width 54px
|
||||
height 54px
|
||||
border-radius 8px
|
||||
|
||||
> .avatar
|
||||
display block
|
||||
width 54px
|
||||
height 54px
|
||||
margin 0
|
||||
border-radius 8px
|
||||
vertical-align bottom
|
||||
|
||||
@media (min-width 500px)
|
||||
width 60px
|
||||
height 60px
|
||||
@media (min-width 500px)
|
||||
width 60px
|
||||
height 60px
|
||||
|
||||
> div
|
||||
|
||||
|
@ -1,8 +1,6 @@
|
||||
<template>
|
||||
<div class="mk-note-preview">
|
||||
<router-link class="avatar-anchor" :to="note.user | userPage">
|
||||
<img class="avatar" :src="`${note.user.avatarUrl}?thumbnail&size=64`" alt="avatar"/>
|
||||
</router-link>
|
||||
<mk-avatar class="avatar" :user="note.user"/>
|
||||
<div class="main">
|
||||
<header>
|
||||
<router-link class="name" :to="note.user | userPage">{{ note.user | userName }}</router-link>
|
||||
@ -37,18 +35,13 @@ root(isDark)
|
||||
display block
|
||||
clear both
|
||||
|
||||
> .avatar-anchor
|
||||
> .avatar
|
||||
display block
|
||||
float left
|
||||
margin 0 12px 0 0
|
||||
|
||||
> .avatar
|
||||
display block
|
||||
width 48px
|
||||
height 48px
|
||||
margin 0
|
||||
border-radius 8px
|
||||
vertical-align bottom
|
||||
width 48px
|
||||
height 48px
|
||||
border-radius 8px
|
||||
|
||||
> .main
|
||||
float left
|
||||
|
@ -1,8 +1,6 @@
|
||||
<template>
|
||||
<div class="sub">
|
||||
<router-link class="avatar-anchor" :to="note.user | userPage">
|
||||
<img class="avatar" :src="`${note.user.avatarUrl}?thumbnail&size=96`" alt="avatar"/>
|
||||
</router-link>
|
||||
<mk-avatar class="avatar" :user="note.user"/>
|
||||
<div class="main">
|
||||
<header>
|
||||
<router-link class="name" :to="note.user | userPage">{{ note.user | userName }}</router-link>
|
||||
@ -49,25 +47,18 @@ root(isDark)
|
||||
display block
|
||||
clear both
|
||||
|
||||
> .avatar-anchor
|
||||
> .avatar
|
||||
display block
|
||||
float left
|
||||
margin 0 10px 0 0
|
||||
width 44px
|
||||
height 44px
|
||||
border-radius 8px
|
||||
|
||||
@media (min-width 500px)
|
||||
margin-right 16px
|
||||
|
||||
> .avatar
|
||||
display block
|
||||
width 44px
|
||||
height 44px
|
||||
margin 0
|
||||
border-radius 8px
|
||||
vertical-align bottom
|
||||
|
||||
@media (min-width 500px)
|
||||
width 52px
|
||||
height 52px
|
||||
width 52px
|
||||
height 52px
|
||||
|
||||
> .main
|
||||
float left
|
||||
|
@ -1,12 +1,10 @@
|
||||
<template>
|
||||
<div class="note" :class="{ renote: isRenote }">
|
||||
<div class="reply-to" v-if="p.reply && (!os.isSignedIn || os.i.clientSettings.showReplyTarget)">
|
||||
<div class="reply-to" v-if="p.reply && (!os.isSignedIn || clientSettings.showReplyTarget)">
|
||||
<x-sub :note="p.reply"/>
|
||||
</div>
|
||||
<div class="renote" v-if="isRenote">
|
||||
<router-link class="avatar-anchor" :to="note.user | userPage">
|
||||
<img class="avatar" :src="`${note.user.avatarUrl}?thumbnail&size=64`" alt="avatar"/>
|
||||
</router-link>
|
||||
<mk-avatar class="avatar" :user="note.user"/>
|
||||
%fa:retweet%
|
||||
<span>{{ '%i18n:!@reposted-by%'.substr(0, '%i18n:!@reposted-by%'.indexOf('{')) }}</span>
|
||||
<router-link class="name" :to="note.user | userPage">{{ note.user | userName }}</router-link>
|
||||
@ -14,9 +12,7 @@
|
||||
<mk-time :time="note.createdAt"/>
|
||||
</div>
|
||||
<article>
|
||||
<router-link class="avatar-anchor" :to="p.user | userPage">
|
||||
<img class="avatar" :src="`${p.user.avatarUrl}?thumbnail&size=96`" alt="avatar"/>
|
||||
</router-link>
|
||||
<mk-avatar class="avatar" :user="p.user"/>
|
||||
<div class="main">
|
||||
<header>
|
||||
<router-link class="name" :to="p.user | userPage">{{ p.user | userName }}</router-link>
|
||||
@ -154,7 +150,7 @@ export default Vue.extend({
|
||||
|
||||
// Draw map
|
||||
if (this.p.geo) {
|
||||
const shouldShowMap = (this as any).os.isSignedIn ? (this as any).os.i.clientSettings.showMaps : true;
|
||||
const shouldShowMap = (this as any).os.isSignedIn ? (this as any).clientSettings.showMaps : true;
|
||||
if (shouldShowMap) {
|
||||
(this as any).os.getGoogleMaps().then(maps => {
|
||||
const uluru = new maps.LatLng(this.p.geo.coordinates[1], this.p.geo.coordinates[0]);
|
||||
@ -268,15 +264,12 @@ root(isDark)
|
||||
@media (min-width 600px)
|
||||
padding 16px 32px
|
||||
|
||||
.avatar-anchor
|
||||
.avatar
|
||||
display inline-block
|
||||
|
||||
.avatar
|
||||
vertical-align bottom
|
||||
width 28px
|
||||
height 28px
|
||||
margin 0 8px 0 0
|
||||
border-radius 6px
|
||||
width 28px
|
||||
height 28px
|
||||
margin 0 8px 0 0
|
||||
border-radius 6px
|
||||
|
||||
[data-fa]
|
||||
margin-right 4px
|
||||
@ -314,29 +307,22 @@ root(isDark)
|
||||
display block
|
||||
clear both
|
||||
|
||||
> .avatar-anchor
|
||||
> .avatar
|
||||
display block
|
||||
float left
|
||||
margin 0 10px 8px 0
|
||||
width 48px
|
||||
height 48px
|
||||
border-radius 6px
|
||||
//position -webkit-sticky
|
||||
//position sticky
|
||||
//top 62px
|
||||
|
||||
@media (min-width 500px)
|
||||
margin-right 16px
|
||||
|
||||
> .avatar
|
||||
display block
|
||||
width 48px
|
||||
height 48px
|
||||
margin 0
|
||||
border-radius 6px
|
||||
vertical-align bottom
|
||||
|
||||
@media (min-width 500px)
|
||||
width 58px
|
||||
height 58px
|
||||
border-radius 8px
|
||||
width 58px
|
||||
height 58px
|
||||
border-radius 8px
|
||||
|
||||
> .main
|
||||
float left
|
||||
|
@ -116,13 +116,13 @@ export default Vue.extend({
|
||||
const isMyNote = note.userId == (this as any).os.i.id;
|
||||
const isPureRenote = note.renoteId != null && note.text == null && note.mediaIds.length == 0 && note.poll == null;
|
||||
|
||||
if ((this as any).os.i.clientSettings.showMyRenotes === false) {
|
||||
if ((this as any).clientSettings.showMyRenotes === false) {
|
||||
if (isMyNote && isPureRenote) {
|
||||
return;
|
||||
}
|
||||
}
|
||||
|
||||
if ((this as any).os.i.clientSettings.showRenotedMyNotes === false) {
|
||||
if ((this as any).clientSettings.showRenotedMyNotes === false) {
|
||||
if (isPureRenote && (note.renote.userId == (this as any).os.i.id)) {
|
||||
return;
|
||||
}
|
||||
@ -187,7 +187,7 @@ export default Vue.extend({
|
||||
this.clearNotification();
|
||||
}
|
||||
|
||||
if ((this as any).os.i.clientSettings.fetchOnScroll !== false) {
|
||||
if ((this as any).clientSettings.fetchOnScroll !== false) {
|
||||
const current = window.scrollY + window.innerHeight;
|
||||
if (current > document.body.offsetHeight - 8) this.loadMore();
|
||||
}
|
||||
|
@ -1,9 +1,7 @@
|
||||
<template>
|
||||
<div class="mk-notification">
|
||||
<div class="notification reaction" v-if="notification.type == 'reaction'">
|
||||
<router-link class="avatar-anchor" :to="notification.user | userPage">
|
||||
<img class="avatar" :src="`${notification.user.avatarUrl}?thumbnail&size=64`" alt="avatar"/>
|
||||
</router-link>
|
||||
<mk-avatar class="avatar" :user="notification.user"/>
|
||||
<div>
|
||||
<header>
|
||||
<mk-reaction-icon :reaction="notification.reaction"/>
|
||||
@ -18,9 +16,7 @@
|
||||
</div>
|
||||
|
||||
<div class="notification renote" v-if="notification.type == 'renote'">
|
||||
<router-link class="avatar-anchor" :to="notification.user | userPage">
|
||||
<img class="avatar" :src="`${notification.user.avatarUrl}?thumbnail&size=64`" alt="avatar"/>
|
||||
</router-link>
|
||||
<mk-avatar class="avatar" :user="notification.user"/>
|
||||
<div>
|
||||
<header>
|
||||
%fa:retweet%
|
||||
@ -34,9 +30,7 @@
|
||||
</div>
|
||||
|
||||
<div class="notification follow" v-if="notification.type == 'follow'">
|
||||
<router-link class="avatar-anchor" :to="notification.user | userPage">
|
||||
<img class="avatar" :src="`${notification.user.avatarUrl}?thumbnail&size=64`" alt="avatar"/>
|
||||
</router-link>
|
||||
<mk-avatar class="avatar" :user="notification.user"/>
|
||||
<div>
|
||||
<header>
|
||||
%fa:user-plus%
|
||||
@ -47,9 +41,7 @@
|
||||
</div>
|
||||
|
||||
<div class="notification poll_vote" v-if="notification.type == 'poll_vote'">
|
||||
<router-link class="avatar-anchor" :to="notification.user | userPage">
|
||||
<img class="avatar" :src="`${notification.user.avatarUrl}?thumbnail&size=64`" alt="avatar"/>
|
||||
</router-link>
|
||||
<mk-avatar class="avatar" :user="notification.user"/>
|
||||
<div>
|
||||
<header>
|
||||
%fa:chart-pie%
|
||||
@ -111,18 +103,16 @@ root(isDark)
|
||||
display block
|
||||
clear both
|
||||
|
||||
> .avatar-anchor
|
||||
> .avatar
|
||||
display block
|
||||
float left
|
||||
width 36px
|
||||
height 36px
|
||||
border-radius 6px
|
||||
|
||||
img
|
||||
width 36px
|
||||
height 36px
|
||||
border-radius 6px
|
||||
|
||||
@media (min-width 500px)
|
||||
width 42px
|
||||
height 42px
|
||||
@media (min-width 500px)
|
||||
width 42px
|
||||
height 42px
|
||||
|
||||
> div
|
||||
float right
|
||||
|
@ -166,7 +166,7 @@ export default Vue.extend({
|
||||
|
||||
post() {
|
||||
this.posting = true;
|
||||
const viaMobile = (this as any).os.i.clientSettings.disableViaMobile !== true;
|
||||
const viaMobile = (this as any).clientSettings.disableViaMobile !== true;
|
||||
(this as any).api('notes/create', {
|
||||
text: this.text == '' ? undefined : this.text,
|
||||
mediaIds: this.files.length > 0 ? this.files.map(f => f.id) : undefined,
|
||||
|
@ -46,8 +46,8 @@ export default Vue.extend({
|
||||
(this as any).api('notes/user-list-timeline', {
|
||||
listId: this.list.id,
|
||||
limit: fetchLimit + 1,
|
||||
includeMyRenotes: (this as any).os.i.clientSettings.showMyRenotes,
|
||||
includeRenotedMyNotes: (this as any).os.i.clientSettings.showRenotedMyNotes
|
||||
includeMyRenotes: (this as any).clientSettings.showMyRenotes,
|
||||
includeRenotedMyNotes: (this as any).clientSettings.showRenotedMyNotes
|
||||
}).then(notes => {
|
||||
if (notes.length == fetchLimit + 1) {
|
||||
notes.pop();
|
||||
@ -66,8 +66,8 @@ export default Vue.extend({
|
||||
listId: this.list.id,
|
||||
limit: fetchLimit + 1,
|
||||
untilId: (this.$refs.timeline as any).tail().id,
|
||||
includeMyRenotes: (this as any).os.i.clientSettings.showMyRenotes,
|
||||
includeRenotedMyNotes: (this as any).os.i.clientSettings.showRenotedMyNotes
|
||||
includeMyRenotes: (this as any).clientSettings.showMyRenotes,
|
||||
includeRenotedMyNotes: (this as any).clientSettings.showRenotedMyNotes
|
||||
}).then(notes => {
|
||||
if (notes.length == fetchLimit + 1) {
|
||||
notes.pop();
|
||||
|
@ -1,8 +1,6 @@
|
||||
<template>
|
||||
<div class="mk-user-preview">
|
||||
<router-link class="avatar-anchor" :to="user | userPage">
|
||||
<img class="avatar" :src="`${user.avatarUrl}?thumbnail&size=64`" alt="avatar"/>
|
||||
</router-link>
|
||||
<mk-avatar class="avatar" :user="user"/>
|
||||
<div class="main">
|
||||
<header>
|
||||
<router-link class="name" :to="user | userPage">{{ user | userName }}</router-link>
|
||||
@ -40,26 +38,19 @@ export default Vue.extend({
|
||||
display block
|
||||
clear both
|
||||
|
||||
> .avatar-anchor
|
||||
> .avatar
|
||||
display block
|
||||
float left
|
||||
margin 0 10px 0 0
|
||||
width 48px
|
||||
height 48px
|
||||
border-radius 6px
|
||||
|
||||
@media (min-width 500px)
|
||||
margin-right 16px
|
||||
|
||||
> .avatar
|
||||
display block
|
||||
width 48px
|
||||
height 48px
|
||||
margin 0
|
||||
border-radius 6px
|
||||
vertical-align bottom
|
||||
|
||||
@media (min-width 500px)
|
||||
width 58px
|
||||
height 58px
|
||||
border-radius 8px
|
||||
width 58px
|
||||
height 58px
|
||||
border-radius 8px
|
||||
|
||||
> .main
|
||||
float left
|
||||
|
Reference in New Issue
Block a user