Merge branch 'develop'
This commit is contained in:
		
						commit
						5e1d17dff2
					
				
					 19 changed files with 229 additions and 170 deletions
				
			
		|  | @ -717,6 +717,8 @@ unlikeConfirm: "いいね解除しますか?" | |||
| fullView: "フルビュー" | ||||
| quitFullView: "フルビュー解除" | ||||
| addDescription: "説明を追加" | ||||
| userPagePinTip: "個々のノートのメニューから「ピン留め」を選択することで、ここにノートを表示しておくことができます。" | ||||
| notSpecifiedMentionWarning: "宛先に含まれていないメンションがあります" | ||||
| 
 | ||||
| _email: | ||||
|   _follow: | ||||
|  |  | |||
|  | @ -1,7 +1,7 @@ | |||
| { | ||||
| 	"name": "misskey", | ||||
| 	"author": "syuilo <syuilotan@yahoo.co.jp>", | ||||
| 	"version": "12.76.0", | ||||
| 	"version": "12.76.1", | ||||
| 	"codename": "indigo", | ||||
| 	"repository": { | ||||
| 		"type": "git", | ||||
|  | @ -181,7 +181,7 @@ | |||
| 		"markdown-it": "12.0.4", | ||||
| 		"markdown-it-anchor": "7.1.0", | ||||
| 		"matter-js": "0.16.1", | ||||
| 		"mfm-js": "0.14.0", | ||||
| 		"mfm-js": "0.15.0", | ||||
| 		"mocha": "8.3.2", | ||||
| 		"moji": "0.5.1", | ||||
| 		"ms": "2.1.3", | ||||
|  |  | |||
|  | @ -24,11 +24,9 @@ export default defineComponent({ | |||
| 	methods: { | ||||
| 		focus() { | ||||
| 			this.$slots.default[0].elm.focus(); | ||||
| 		} | ||||
| 	}, | ||||
| 		}, | ||||
| 
 | ||||
| 	render() { | ||||
| 		const getDateText = (time: string) => { | ||||
| 		getDateText(time: string) { | ||||
| 			const date = new Date(time).getDate(); | ||||
| 			const month = new Date(time).getMonth() + 1; | ||||
| 			return this.$t('monthAndDay', { | ||||
|  | @ -36,9 +34,13 @@ export default defineComponent({ | |||
| 				day: date.toString() | ||||
| 			}); | ||||
| 		} | ||||
| 	}, | ||||
| 
 | ||||
| 	render() { | ||||
| 		const noGap = [...document.querySelectorAll('._noGap_')].some(el => el.contains(this.$parent.$el)); | ||||
| 
 | ||||
| 		if (this.items.length === 0) return; | ||||
| 
 | ||||
| 		return h(this.$store.state.animation ? TransitionGroup : 'div', this.$store.state.animation ? { | ||||
| 			class: 'sqadhkmv' + (noGap ? ' _block' : ''), | ||||
| 			name: 'list', | ||||
|  | @ -72,10 +74,10 @@ export default defineComponent({ | |||
| 							class: 'icon', | ||||
| 							icon: faAngleUp, | ||||
| 						}), | ||||
| 						getDateText(item.createdAt) | ||||
| 						this.getDateText(item.createdAt) | ||||
| 					]), | ||||
| 					h('span', [ | ||||
| 						getDateText(this.items[i + 1].createdAt), | ||||
| 						this.getDateText(this.items[i + 1].createdAt), | ||||
| 						h(FontAwesomeIcon, { | ||||
| 							class: 'icon', | ||||
| 							icon: faAngleDown, | ||||
|  |  | |||
|  | @ -58,10 +58,13 @@ export default defineComponent({ | |||
| 					const text = token.props.text.replace(/(\r\n|\n|\r)/g, '\n'); | ||||
| 
 | ||||
| 					if (!this.plain) { | ||||
| 						const x = text.split('\n') | ||||
| 							.map(t => t == '' ? [h('br')] : [t, h('br')]); | ||||
| 						x[x.length - 1].pop(); | ||||
| 						return x; | ||||
| 						const res = []; | ||||
| 						for (const t of text.split('\n')) { | ||||
| 							res.push(h('br')); | ||||
| 							res.push(t); | ||||
| 						} | ||||
| 						res.shift(); | ||||
| 						return res; | ||||
| 					} else { | ||||
| 						return [text.replace(/\n/g, ' ')]; | ||||
| 					} | ||||
|  |  | |||
|  | @ -1,7 +1,6 @@ | |||
| <template> | ||||
| <div class="mfcuwfyp _noGap_"> | ||||
| 	<div class="_magnet"></div> | ||||
| 	<XList class="notifications" :items="items" v-slot="{ item: notification }"> | ||||
| <div class="mfcuwfyp _noGap_ _magnetParent"> | ||||
| 	<XList class="notifications _magnetChild" :items="items" v-slot="{ item: notification }"> | ||||
| 		<XNote v-if="['reply', 'quote', 'mention'].includes(notification.type)" :note="notification.note" @update:note="noteUpdated(notification.note, $event)" :key="notification.id"/> | ||||
| 		<XNotification v-else :notification="notification" :with-time="true" :full="true" class="_panel notification" :key="notification.id"/> | ||||
| 	</XList> | ||||
|  |  | |||
|  | @ -34,6 +34,7 @@ | |||
| 				<button @click="addVisibleUser" class="_buttonPrimary"><Fa :icon="faPlus" fixed-width/></button> | ||||
| 			</div> | ||||
| 		</div> | ||||
| 		<MkInfo warn v-if="hasNotSpecifiedMentions" class="hasNotSpecifiedMentions">{{ $ts.notSpecifiedMentionWarning }} - <button class="_textButton" @click="addMissingMention()">{{ $ts.add }}</button></MkInfo> | ||||
| 		<input v-show="useCw" ref="cw" class="cw" v-model="cw" :placeholder="$ts.annotation" @keydown="onKeydown"> | ||||
| 		<textarea v-model="text" class="text" :class="{ withCw: useCw }" ref="text" :disabled="posting" :placeholder="placeholder" @keydown="onKeydown" @paste="onPaste" @compositionupdate="onCompositionUpdate" @compositionend="onCompositionEnd" /> | ||||
| 		<XPostFormAttaches class="attaches" :files="files" @updated="updateFiles" @detach="detachFile" @changeSensitive="updateFileSensitive" @changeName="updateFileName"/> | ||||
|  | @ -71,12 +72,14 @@ import { selectFile } from '@client/scripts/select-file'; | |||
| import { notePostInterruptors, postFormActions } from '@client/store'; | ||||
| import { isMobile } from '@client/scripts/is-mobile'; | ||||
| import { throttle } from 'throttle-debounce'; | ||||
| import MkInfo from '@client/components/ui/info.vue'; | ||||
| 
 | ||||
| export default defineComponent({ | ||||
| 	components: { | ||||
| 		XNotePreview, | ||||
| 		XPostFormAttaches: defineAsyncComponent(() => import('./post-form-attaches.vue')), | ||||
| 		XPollEditor: defineAsyncComponent(() => import('./poll-editor.vue')) | ||||
| 		XPollEditor: defineAsyncComponent(() => import('./poll-editor.vue')), | ||||
| 		MkInfo, | ||||
| 	}, | ||||
| 
 | ||||
| 	inject: ['modal'], | ||||
|  | @ -143,6 +146,7 @@ export default defineComponent({ | |||
| 			autocomplete: null, | ||||
| 			draghover: false, | ||||
| 			quoteId: null, | ||||
| 			hasNotSpecifiedMentions: false, | ||||
| 			recentHashtags: JSON.parse(localStorage.getItem('hashtags') || '[]'), | ||||
| 			imeText: '', | ||||
| 			typing: throttle(3000, () => { | ||||
|  | @ -214,6 +218,18 @@ export default defineComponent({ | |||
| 		} | ||||
| 	}, | ||||
| 
 | ||||
| 	watch: { | ||||
| 		text() { | ||||
| 			this.checkMissingMention(); | ||||
| 		}, | ||||
| 		visibleUsers: { | ||||
| 			handler() { | ||||
| 				this.checkMissingMention(); | ||||
| 			}, | ||||
| 			deep: true | ||||
| 		} | ||||
| 	}, | ||||
| 
 | ||||
| 	mounted() { | ||||
| 		if (this.initialText) { | ||||
| 			this.text = this.initialText; | ||||
|  | @ -338,6 +354,32 @@ export default defineComponent({ | |||
| 			this.$watch('localOnly', () => this.saveDraft()); | ||||
| 		}, | ||||
| 
 | ||||
| 		checkMissingMention() { | ||||
| 			if (this.visibility === 'specified') { | ||||
| 				const ast = mfm.parse(this.text); | ||||
| 
 | ||||
| 				for (const x of extractMentions(ast)) { | ||||
| 					if (!this.visibleUsers.some(u => (u.username === x.username) && (u.host == x.host))) { | ||||
| 						this.hasNotSpecifiedMentions = true; | ||||
| 						return; | ||||
| 					} | ||||
| 				} | ||||
| 				this.hasNotSpecifiedMentions = false; | ||||
| 			} | ||||
| 		}, | ||||
| 
 | ||||
| 		addMissingMention() { | ||||
| 			const ast = mfm.parse(this.text); | ||||
| 
 | ||||
| 			for (const x of extractMentions(ast)) { | ||||
| 				if (!this.visibleUsers.some(u => (u.username === x.username) && (u.host == x.host))) { | ||||
| 					os.api('users/show', { username: x.username, host: x.host }).then(user => { | ||||
| 						this.visibleUsers.push(user); | ||||
| 					}); | ||||
| 				} | ||||
| 			} | ||||
| 		}, | ||||
| 
 | ||||
| 		togglePoll() { | ||||
| 			if (this.poll) { | ||||
| 				this.poll = null; | ||||
|  | @ -741,6 +783,10 @@ export default defineComponent({ | |||
| 			} | ||||
| 		} | ||||
| 
 | ||||
| 		> .hasNotSpecifiedMentions { | ||||
| 			margin: 0 20px 16px 20px; | ||||
| 		} | ||||
| 
 | ||||
| 		> .cw, | ||||
| 		> .text { | ||||
| 			display: block; | ||||
|  |  | |||
|  | @ -85,6 +85,8 @@ export default defineComponent({ | |||
| 	display: flex; | ||||
| 
 | ||||
| 	> .avatar { | ||||
| 		position: sticky; | ||||
| 		top: calc(var(--stickyTop, 0px) + 16px); | ||||
| 		display: block; | ||||
| 		width: 54px; | ||||
| 		height: 54px; | ||||
|  | @ -274,6 +276,11 @@ export default defineComponent({ | |||
| 				background: $me-balloon-color; | ||||
| 				text-align: left; | ||||
| 
 | ||||
| 				::selection { | ||||
| 					color: var(--accent); | ||||
| 					background-color: #fff; | ||||
| 				}  | ||||
| 
 | ||||
| 				&.noText { | ||||
| 					background: transparent; | ||||
| 				} | ||||
|  |  | |||
|  | @ -1,265 +1,261 @@ | |||
| <template> | ||||
| <div class="mwysmxbg"> | ||||
| 	<div class="_section"> | ||||
| 		<div class="_content"> | ||||
| 			<p>{{ $ts._mfm.intro }}</p> | ||||
| 		</div> | ||||
| 	</div> | ||||
| 	<div class="_section"> | ||||
| 		<div class="_title">{{ $ts._mfm.mention }}</div> | ||||
| 		<div class="_content"> | ||||
| 	<div class="_isolated">{{ $ts._mfm.intro }}</div> | ||||
| 	<div class="section _block"> | ||||
| 		<div class="title">{{ $ts._mfm.mention }}</div> | ||||
| 		<div class="content"> | ||||
| 			<p>{{ $ts._mfm.mentionDescription }}</p> | ||||
| 			<div class="preview _panel"> | ||||
| 			<div class="preview"> | ||||
| 				<Mfm :text="preview_mention"/> | ||||
| 				<MkTextarea v-model:value="preview_mention"><span>MFM</span></MkTextarea> | ||||
| 			</div> | ||||
| 		</div> | ||||
| 	</div> | ||||
| 	<div class="_section"> | ||||
| 		<div class="_title">{{ $ts._mfm.hashtag }}</div> | ||||
| 		<div class="_content"> | ||||
| 	<div class="section _block"> | ||||
| 		<div class="title">{{ $ts._mfm.hashtag }}</div> | ||||
| 		<div class="content"> | ||||
| 			<p>{{ $ts._mfm.hashtagDescription }}</p> | ||||
| 			<div class="preview _panel"> | ||||
| 			<div class="preview"> | ||||
| 				<Mfm :text="preview_hashtag"/> | ||||
| 				<MkTextarea v-model:value="preview_hashtag"><span>MFM</span></MkTextarea> | ||||
| 			</div> | ||||
| 		</div> | ||||
| 	</div> | ||||
| 	<div class="_section"> | ||||
| 		<div class="_title">{{ $ts._mfm.url }}</div> | ||||
| 		<div class="_content"> | ||||
| 	<div class="section _block"> | ||||
| 		<div class="title">{{ $ts._mfm.url }}</div> | ||||
| 		<div class="content"> | ||||
| 			<p>{{ $ts._mfm.urlDescription }}</p> | ||||
| 			<div class="preview _panel"> | ||||
| 			<div class="preview"> | ||||
| 				<Mfm :text="preview_url"/> | ||||
| 				<MkTextarea v-model:value="preview_url"><span>MFM</span></MkTextarea> | ||||
| 			</div> | ||||
| 		</div> | ||||
| 	</div> | ||||
| 	<div class="_section"> | ||||
| 		<div class="_title">{{ $ts._mfm.link }}</div> | ||||
| 		<div class="_content"> | ||||
| 	<div class="section _block"> | ||||
| 		<div class="title">{{ $ts._mfm.link }}</div> | ||||
| 		<div class="content"> | ||||
| 			<p>{{ $ts._mfm.linkDescription }}</p> | ||||
| 			<div class="preview _panel"> | ||||
| 			<div class="preview"> | ||||
| 				<Mfm :text="preview_link"/> | ||||
| 				<MkTextarea v-model:value="preview_link"><span>MFM</span></MkTextarea> | ||||
| 			</div> | ||||
| 		</div> | ||||
| 	</div> | ||||
| 	<div class="_section"> | ||||
| 		<div class="_title">{{ $ts._mfm.emoji }}</div> | ||||
| 		<div class="_content"> | ||||
| 	<div class="section _block"> | ||||
| 		<div class="title">{{ $ts._mfm.emoji }}</div> | ||||
| 		<div class="content"> | ||||
| 			<p>{{ $ts._mfm.emojiDescription }}</p> | ||||
| 			<div class="preview _panel"> | ||||
| 			<div class="preview"> | ||||
| 				<Mfm :text="preview_emoji"/> | ||||
| 				<MkTextarea v-model:value="preview_emoji"><span>MFM</span></MkTextarea> | ||||
| 			</div> | ||||
| 		</div> | ||||
| 	</div> | ||||
| 	<div class="_section"> | ||||
| 		<div class="_title">{{ $ts._mfm.bold }}</div> | ||||
| 		<div class="_content"> | ||||
| 	<div class="section _block"> | ||||
| 		<div class="title">{{ $ts._mfm.bold }}</div> | ||||
| 		<div class="content"> | ||||
| 			<p>{{ $ts._mfm.boldDescription }}</p> | ||||
| 			<div class="preview _panel"> | ||||
| 			<div class="preview"> | ||||
| 				<Mfm :text="preview_bold"/> | ||||
| 				<MkTextarea v-model:value="preview_bold"><span>MFM</span></MkTextarea> | ||||
| 			</div> | ||||
| 		</div> | ||||
| 	</div> | ||||
| 	<div class="_section"> | ||||
| 		<div class="_title">{{ $ts._mfm.small }}</div> | ||||
| 		<div class="_content"> | ||||
| 	<div class="section _block"> | ||||
| 		<div class="title">{{ $ts._mfm.small }}</div> | ||||
| 		<div class="content"> | ||||
| 			<p>{{ $ts._mfm.smallDescription }}</p> | ||||
| 			<div class="preview _panel"> | ||||
| 			<div class="preview"> | ||||
| 				<Mfm :text="preview_small"/> | ||||
| 				<MkTextarea v-model:value="preview_small"><span>MFM</span></MkTextarea> | ||||
| 			</div> | ||||
| 		</div> | ||||
| 	</div> | ||||
| 	<div class="_section"> | ||||
| 		<div class="_title">{{ $ts._mfm.quote }}</div> | ||||
| 		<div class="_content"> | ||||
| 	<div class="section _block"> | ||||
| 		<div class="title">{{ $ts._mfm.quote }}</div> | ||||
| 		<div class="content"> | ||||
| 			<p>{{ $ts._mfm.quoteDescription }}</p> | ||||
| 			<div class="preview _panel"> | ||||
| 			<div class="preview"> | ||||
| 				<Mfm :text="preview_quote"/> | ||||
| 				<MkTextarea v-model:value="preview_quote"><span>MFM</span></MkTextarea> | ||||
| 			</div> | ||||
| 		</div> | ||||
| 	</div> | ||||
| 	<div class="_section"> | ||||
| 		<div class="_title">{{ $ts._mfm.center }}</div> | ||||
| 		<div class="_content"> | ||||
| 	<div class="section _block"> | ||||
| 		<div class="title">{{ $ts._mfm.center }}</div> | ||||
| 		<div class="content"> | ||||
| 			<p>{{ $ts._mfm.centerDescription }}</p> | ||||
| 			<div class="preview _panel"> | ||||
| 			<div class="preview"> | ||||
| 				<Mfm :text="preview_center"/> | ||||
| 				<MkTextarea v-model:value="preview_center"><span>MFM</span></MkTextarea> | ||||
| 			</div> | ||||
| 		</div> | ||||
| 	</div> | ||||
| 	<div class="_section"> | ||||
| 		<div class="_title">{{ $ts._mfm.inlineCode }}</div> | ||||
| 		<div class="_content"> | ||||
| 	<div class="section _block"> | ||||
| 		<div class="title">{{ $ts._mfm.inlineCode }}</div> | ||||
| 		<div class="content"> | ||||
| 			<p>{{ $ts._mfm.inlineCodeDescription }}</p> | ||||
| 			<div class="preview _panel"> | ||||
| 			<div class="preview"> | ||||
| 				<Mfm :text="preview_inlineCode"/> | ||||
| 				<MkTextarea v-model:value="preview_inlineCode"><span>MFM</span></MkTextarea> | ||||
| 			</div> | ||||
| 		</div> | ||||
| 	</div> | ||||
| 	<div class="_section"> | ||||
| 		<div class="_title">{{ $ts._mfm.blockCode }}</div> | ||||
| 		<div class="_content"> | ||||
| 	<div class="section _block"> | ||||
| 		<div class="title">{{ $ts._mfm.blockCode }}</div> | ||||
| 		<div class="content"> | ||||
| 			<p>{{ $ts._mfm.blockCodeDescription }}</p> | ||||
| 			<div class="preview _panel"> | ||||
| 			<div class="preview"> | ||||
| 				<Mfm :text="preview_blockCode"/> | ||||
| 				<MkTextarea v-model:value="preview_blockCode"><span>MFM</span></MkTextarea> | ||||
| 			</div> | ||||
| 		</div> | ||||
| 	</div> | ||||
| 	<div class="_section"> | ||||
| 		<div class="_title">{{ $ts._mfm.inlineMath }}</div> | ||||
| 		<div class="_content"> | ||||
| 	<div class="section _block"> | ||||
| 		<div class="title">{{ $ts._mfm.inlineMath }}</div> | ||||
| 		<div class="content"> | ||||
| 			<p>{{ $ts._mfm.inlineMathDescription }}</p> | ||||
| 			<div class="preview _panel"> | ||||
| 			<div class="preview"> | ||||
| 				<Mfm :text="preview_inlineMath"/> | ||||
| 				<MkTextarea v-model:value="preview_inlineMath"><span>MFM</span></MkTextarea> | ||||
| 			</div> | ||||
| 		</div> | ||||
| 	</div> | ||||
| 	<div class="_section"> | ||||
| 		<div class="_title">{{ $ts._mfm.search }}</div> | ||||
| 		<div class="_content"> | ||||
| 	<div class="section _block"> | ||||
| 		<div class="title">{{ $ts._mfm.search }}</div> | ||||
| 		<div class="content"> | ||||
| 			<p>{{ $ts._mfm.searchDescription }}</p> | ||||
| 			<div class="preview _panel"> | ||||
| 			<div class="preview"> | ||||
| 				<Mfm :text="preview_search"/> | ||||
| 				<MkTextarea v-model:value="preview_search"><span>MFM</span></MkTextarea> | ||||
| 			</div> | ||||
| 		</div> | ||||
| 	</div> | ||||
| 	<div class="_section"> | ||||
| 		<div class="_title">{{ $ts._mfm.flip }}</div> | ||||
| 		<div class="_content"> | ||||
| 	<div class="section _block"> | ||||
| 		<div class="title">{{ $ts._mfm.flip }}</div> | ||||
| 		<div class="content"> | ||||
| 			<p>{{ $ts._mfm.flipDescription }}</p> | ||||
| 			<div class="preview _panel"> | ||||
| 			<div class="preview"> | ||||
| 				<Mfm :text="preview_flip"/> | ||||
| 				<MkTextarea v-model:value="preview_flip"><span>MFM</span></MkTextarea> | ||||
| 			</div> | ||||
| 		</div> | ||||
| 	</div> | ||||
| 	<div class="_section"> | ||||
| 		<div class="_title">{{ $ts._mfm.font }}</div> | ||||
| 		<div class="_content"> | ||||
| 	<div class="section _block"> | ||||
| 		<div class="title">{{ $ts._mfm.font }}</div> | ||||
| 		<div class="content"> | ||||
| 			<p>{{ $ts._mfm.fontDescription }}</p> | ||||
| 			<div class="preview _panel"> | ||||
| 			<div class="preview"> | ||||
| 				<Mfm :text="preview_font"/> | ||||
| 				<MkTextarea v-model:value="preview_font"><span>MFM</span></MkTextarea> | ||||
| 			</div> | ||||
| 		</div> | ||||
| 	</div> | ||||
| 	<div class="_section"> | ||||
| 		<div class="_title">{{ $ts._mfm.x2 }}</div> | ||||
| 		<div class="_content"> | ||||
| 	<div class="section _block"> | ||||
| 		<div class="title">{{ $ts._mfm.x2 }}</div> | ||||
| 		<div class="content"> | ||||
| 			<p>{{ $ts._mfm.x2Description }}</p> | ||||
| 			<div class="preview _panel"> | ||||
| 			<div class="preview"> | ||||
| 				<Mfm :text="preview_x2"/> | ||||
| 				<MkTextarea v-model:value="preview_x2"><span>MFM</span></MkTextarea> | ||||
| 			</div> | ||||
| 		</div> | ||||
| 	</div> | ||||
| 	<div class="_section"> | ||||
| 		<div class="_title">{{ $ts._mfm.x3 }}</div> | ||||
| 		<div class="_content"> | ||||
| 	<div class="section _block"> | ||||
| 		<div class="title">{{ $ts._mfm.x3 }}</div> | ||||
| 		<div class="content"> | ||||
| 			<p>{{ $ts._mfm.x3Description }}</p> | ||||
| 			<div class="preview _panel"> | ||||
| 			<div class="preview"> | ||||
| 				<Mfm :text="preview_x3"/> | ||||
| 				<MkTextarea v-model:value="preview_x3"><span>MFM</span></MkTextarea> | ||||
| 			</div> | ||||
| 		</div> | ||||
| 	</div> | ||||
| 	<div class="_section"> | ||||
| 		<div class="_title">{{ $ts._mfm.x4 }}</div> | ||||
| 		<div class="_content"> | ||||
| 	<div class="section _block"> | ||||
| 		<div class="title">{{ $ts._mfm.x4 }}</div> | ||||
| 		<div class="content"> | ||||
| 			<p>{{ $ts._mfm.x4Description }}</p> | ||||
| 			<div class="preview _panel"> | ||||
| 			<div class="preview"> | ||||
| 				<Mfm :text="preview_x4"/> | ||||
| 				<MkTextarea v-model:value="preview_x4"><span>MFM</span></MkTextarea> | ||||
| 			</div> | ||||
| 		</div> | ||||
| 	</div> | ||||
| 	<div class="_section"> | ||||
| 		<div class="_title">{{ $ts._mfm.blur }}</div> | ||||
| 		<div class="_content"> | ||||
| 	<div class="section _block"> | ||||
| 		<div class="title">{{ $ts._mfm.blur }}</div> | ||||
| 		<div class="content"> | ||||
| 			<p>{{ $ts._mfm.blurDescription }}</p> | ||||
| 			<div class="preview _panel"> | ||||
| 			<div class="preview"> | ||||
| 				<Mfm :text="preview_blur"/> | ||||
| 				<MkTextarea v-model:value="preview_blur"><span>MFM</span></MkTextarea> | ||||
| 			</div> | ||||
| 		</div> | ||||
| 	</div> | ||||
| 	<div class="_section"> | ||||
| 		<div class="_title">{{ $ts._mfm.jelly }}</div> | ||||
| 		<div class="_content"> | ||||
| 	<div class="section _block"> | ||||
| 		<div class="title">{{ $ts._mfm.jelly }}</div> | ||||
| 		<div class="content"> | ||||
| 			<p>{{ $ts._mfm.jellyDescription }}</p> | ||||
| 			<div class="preview _panel"> | ||||
| 			<div class="preview"> | ||||
| 				<Mfm :text="preview_jelly"/> | ||||
| 				<MkTextarea v-model:value="preview_jelly"><span>MFM</span></MkTextarea> | ||||
| 			</div> | ||||
| 		</div> | ||||
| 	</div> | ||||
| 	<div class="_section"> | ||||
| 		<div class="_title">{{ $ts._mfm.tada }}</div> | ||||
| 		<div class="_content"> | ||||
| 	<div class="section _block"> | ||||
| 		<div class="title">{{ $ts._mfm.tada }}</div> | ||||
| 		<div class="content"> | ||||
| 			<p>{{ $ts._mfm.tadaDescription }}</p> | ||||
| 			<div class="preview _panel"> | ||||
| 			<div class="preview"> | ||||
| 				<Mfm :text="preview_tada"/> | ||||
| 				<MkTextarea v-model:value="preview_tada"><span>MFM</span></MkTextarea> | ||||
| 			</div> | ||||
| 		</div> | ||||
| 	</div> | ||||
| 	<div class="_section"> | ||||
| 		<div class="_title">{{ $ts._mfm.jump }}</div> | ||||
| 		<div class="_content"> | ||||
| 	<div class="section _block"> | ||||
| 		<div class="title">{{ $ts._mfm.jump }}</div> | ||||
| 		<div class="content"> | ||||
| 			<p>{{ $ts._mfm.jumpDescription }}</p> | ||||
| 			<div class="preview _panel"> | ||||
| 			<div class="preview"> | ||||
| 				<Mfm :text="preview_jump"/> | ||||
| 				<MkTextarea v-model:value="preview_jump"><span>MFM</span></MkTextarea> | ||||
| 			</div> | ||||
| 		</div> | ||||
| 	</div> | ||||
| 	<div class="_section"> | ||||
| 		<div class="_title">{{ $ts._mfm.bounce }}</div> | ||||
| 		<div class="_content"> | ||||
| 	<div class="section _block"> | ||||
| 		<div class="title">{{ $ts._mfm.bounce }}</div> | ||||
| 		<div class="content"> | ||||
| 			<p>{{ $ts._mfm.bounceDescription }}</p> | ||||
| 			<div class="preview _panel"> | ||||
| 			<div class="preview"> | ||||
| 				<Mfm :text="preview_bounce"/> | ||||
| 				<MkTextarea v-model:value="preview_bounce"><span>MFM</span></MkTextarea> | ||||
| 			</div> | ||||
| 		</div> | ||||
| 	</div> | ||||
| 	<div class="_section"> | ||||
| 		<div class="_title">{{ $ts._mfm.spin }}</div> | ||||
| 		<div class="_content"> | ||||
| 	<div class="section _block"> | ||||
| 		<div class="title">{{ $ts._mfm.spin }}</div> | ||||
| 		<div class="content"> | ||||
| 			<p>{{ $ts._mfm.spinDescription }}</p> | ||||
| 			<div class="preview _panel"> | ||||
| 			<div class="preview"> | ||||
| 				<Mfm :text="preview_spin"/> | ||||
| 				<MkTextarea v-model:value="preview_spin"><span>MFM</span></MkTextarea> | ||||
| 			</div> | ||||
| 		</div> | ||||
| 	</div> | ||||
| 	<div class="_section"> | ||||
| 		<div class="_title">{{ $ts._mfm.shake }}</div> | ||||
| 		<div class="_content"> | ||||
| 	<div class="section _block"> | ||||
| 		<div class="title">{{ $ts._mfm.shake }}</div> | ||||
| 		<div class="content"> | ||||
| 			<p>{{ $ts._mfm.shakeDescription }}</p> | ||||
| 			<div class="preview _panel"> | ||||
| 			<div class="preview"> | ||||
| 				<Mfm :text="preview_shake"/> | ||||
| 				<MkTextarea v-model:value="preview_shake"><span>MFM</span></MkTextarea> | ||||
| 			</div> | ||||
| 		</div> | ||||
| 	</div> | ||||
| 	<div class="_section"> | ||||
| 		<div class="_title">{{ $ts._mfm.twitch }}</div> | ||||
| 		<div class="_content"> | ||||
| 	<div class="section _block"> | ||||
| 		<div class="title">{{ $ts._mfm.twitch }}</div> | ||||
| 		<div class="content"> | ||||
| 			<p>{{ $ts._mfm.twitchDescription }}</p> | ||||
| 			<div class="preview _panel"> | ||||
| 			<div class="preview"> | ||||
| 				<Mfm :text="preview_twitch"/> | ||||
| 				<MkTextarea v-model:value="preview_twitch"><span>MFM</span></MkTextarea> | ||||
| 			</div> | ||||
|  | @ -318,8 +314,29 @@ export default defineComponent({ | |||
| 
 | ||||
| <style lang="scss" scoped> | ||||
| .mwysmxbg { | ||||
| 	.preview { | ||||
| 		padding: 16px; | ||||
| 	> .section { | ||||
| 		> .title { | ||||
| 			position: sticky; | ||||
| 			z-index: 1; | ||||
| 			top: var(--stickyTop, 0px); | ||||
| 			padding: 16px; | ||||
| 			font-weight: bold; | ||||
| 			-webkit-backdrop-filter: blur(10px); | ||||
| 			backdrop-filter: blur(10px); | ||||
| 			background-color: var(--X16); | ||||
| 		} | ||||
| 
 | ||||
| 		> .content { | ||||
| 			> p { | ||||
| 				margin: 0; | ||||
| 				padding: 16px; | ||||
| 			} | ||||
| 
 | ||||
| 			> .preview { | ||||
| 				border-top: solid 0.5px var(--divider); | ||||
| 				padding: 16px; | ||||
| 			} | ||||
| 		} | ||||
| 	} | ||||
| } | ||||
| </style> | ||||
|  |  | |||
|  | @ -1,8 +1,6 @@ | |||
| <template> | ||||
| <div class="xcukqgmh _root" v-if="page" :key="page.id" v-size="{ max: [450] }"> | ||||
| 	<div class="_magnet"></div> | ||||
| 
 | ||||
| 	<div class="_block main"> | ||||
| <div class="xcukqgmh _root _magnetParent" v-if="page" :key="page.id" v-size="{ max: [450] }"> | ||||
| 	<div class="_block _magnetChild main"> | ||||
| 		<!-- | ||||
| 		<div class="header"> | ||||
| 			<h1>{{ page.title }}</h1> | ||||
|  |  | |||
|  | @ -1,6 +1,5 @@ | |||
| <template> | ||||
| <FormBase> | ||||
| 	<FormSwitch v-model:value="titlebar">{{ $ts.showTitlebar }}</FormSwitch> | ||||
| 	<FormSwitch v-model:value="showFixedPostForm">{{ $ts.showFixedPostForm }}</FormSwitch> | ||||
| 
 | ||||
| 	<FormSelect v-model:value="lang"> | ||||
|  | @ -137,7 +136,6 @@ export default defineComponent({ | |||
| 		useOsNativeEmojis: defaultStore.makeGetterSetter('useOsNativeEmojis'), | ||||
| 		disableShowingAnimatedImages: defaultStore.makeGetterSetter('disableShowingAnimatedImages'), | ||||
| 		loadRawImages: defaultStore.makeGetterSetter('loadRawImages'), | ||||
| 		titlebar: defaultStore.makeGetterSetter('titlebar'), | ||||
| 		imageNewTab: defaultStore.makeGetterSetter('imageNewTab'), | ||||
| 		nsfw: defaultStore.makeGetterSetter('nsfw'), | ||||
| 		disablePagesScript: defaultStore.makeGetterSetter('disablePagesScript'), | ||||
|  | @ -182,10 +180,6 @@ export default defineComponent({ | |||
| 			this.reloadAsk(); | ||||
| 		}, | ||||
| 
 | ||||
| 		titlebar() { | ||||
| 			this.reloadAsk(); | ||||
| 		}, | ||||
| 
 | ||||
| 		instanceTicker() { | ||||
| 			this.reloadAsk(); | ||||
| 		}, | ||||
|  |  | |||
|  | @ -1,11 +1,10 @@ | |||
| <template> | ||||
| <div class="cmuxhskf _root" v-hotkey.global="keymap"> | ||||
| 	<div class="new" v-if="queue > 0" :style="{ width: width + 'px' }"><button class="_buttonPrimary" @click="top()">{{ $ts.newNoteRecived }}</button></div> | ||||
| <div class="cmuxhskf _root _magnetParent" v-hotkey.global="keymap"> | ||||
| 	<div class="new" v-if="queue > 0"><button class="_buttonPrimary" @click="top()">{{ $ts.newNoteRecived }}</button></div> | ||||
| 
 | ||||
| 	<div class="_magnet"></div> | ||||
| 	<XTutorial v-if="$store.reactiveState.tutorial.value != -1" class="tutorial _block"/> | ||||
| 	<XPostForm v-if="$store.reactiveState.showFixedPostForm.value" class="post-form _block" fixed/> | ||||
| 	<div class="tabs _block"> | ||||
| 	<div class="tabs _block _magnetChild"> | ||||
| 		<div class="left"> | ||||
| 			<button class="_button tab" @click="() => { src = 'home'; saveSrc(); }" :class="{ active: src === 'home' }" v-tooltip="$ts._timelines.home"><Fa :icon="faHome"/></button> | ||||
| 			<button class="_button tab" @click="() => { src = 'local'; saveSrc(); }" :class="{ active: src === 'local' }" v-tooltip="$ts._timelines.local" v-if="isLocalTimelineAvailable"><Fa :icon="faComments"/></button> | ||||
|  | @ -64,7 +63,6 @@ export default defineComponent({ | |||
| 			channel: null, | ||||
| 			menuOpened: false, | ||||
| 			queue: 0, | ||||
| 			width: 0, | ||||
| 			[symbols.PAGE_INFO]: computed(() => ({ | ||||
| 				title: this.$ts.timeline, | ||||
| 				icon: this.src === 'local' ? faComments : this.src === 'social' ? faShareAlt : this.src === 'global' ? faGlobe : faHome, | ||||
|  | @ -126,10 +124,6 @@ export default defineComponent({ | |||
| 		} | ||||
| 	}, | ||||
| 
 | ||||
| 	mounted() { | ||||
| 		this.width = this.$el.offsetWidth; | ||||
| 	}, | ||||
| 
 | ||||
| 	methods: { | ||||
| 		before() { | ||||
| 			Progress.start(); | ||||
|  | @ -140,7 +134,6 @@ export default defineComponent({ | |||
| 		}, | ||||
| 
 | ||||
| 		queueUpdated(q) { | ||||
| 			if (this.$el.offsetWidth !== 0) this.width = this.$el.offsetWidth; | ||||
| 			this.queue = q; | ||||
| 		}, | ||||
| 
 | ||||
|  | @ -223,8 +216,10 @@ export default defineComponent({ | |||
| <style lang="scss" scoped> | ||||
| .cmuxhskf { | ||||
| 	> .new { | ||||
| 		position: fixed; | ||||
| 		position: sticky; | ||||
| 		top: calc(var(--stickyTop, 0px) + 16px); | ||||
| 		z-index: 1000; | ||||
| 		width: 100%; | ||||
| 
 | ||||
| 		> button { | ||||
| 			display: block; | ||||
|  |  | |||
|  | @ -198,6 +198,7 @@ | |||
| 					<div v-if="user.pinnedNotes.length > 0"> | ||||
| 						<XNote v-for="note in user.pinnedNotes" class="note _block" :note="note" @update:note="pinnedNoteUpdated(note, $event)" :key="note.id" :pinned="true"/> | ||||
| 					</div> | ||||
| 					<MkInfo v-else-if="$i && $i.id === user.id">{{ $ts.userPagePinTip }}</MkInfo> | ||||
| 					<XPhotos :user="user" :key="user.id"/> | ||||
| 					<XActivity :user="user" :key="user.id"/> | ||||
| 				</div> | ||||
|  | @ -229,6 +230,7 @@ import MkContainer from '@client/components/ui/container.vue'; | |||
| import MkFolder from '@client/components/ui/folder.vue'; | ||||
| import MkRemoteCaution from '@client/components/remote-caution.vue'; | ||||
| import MkTab from '@client/components/tab.vue'; | ||||
| import MkInfo from '@client/components/ui/info.vue'; | ||||
| import Progress from '@client/scripts/loading'; | ||||
| import parseAcct from '@/misc/acct/parse'; | ||||
| import { getScrollPosition } from '@client/scripts/scroll'; | ||||
|  | @ -247,6 +249,7 @@ export default defineComponent({ | |||
| 		MkRemoteCaution, | ||||
| 		MkFolder, | ||||
| 		MkTab, | ||||
| 		MkInfo, | ||||
| 		XFollowList: defineAsyncComponent(() => import('./follow-list.vue')), | ||||
| 		XClips: defineAsyncComponent(() => import('./clips.vue')), | ||||
| 		XPages: defineAsyncComponent(() => import('./pages.vue')), | ||||
|  |  | |||
|  | @ -184,10 +184,6 @@ export const defaultStore = markRaw(new Storage('base', { | |||
| 		where: 'device', | ||||
| 		default: 'full' as 'full' | 'icon' | ||||
| 	}, | ||||
| 	titlebar: { | ||||
| 		where: 'device', | ||||
| 		default: true | ||||
| 	}, | ||||
| 	reportError: { | ||||
| 		where: 'device', | ||||
| 		default: false | ||||
|  |  | |||
|  | @ -366,10 +366,6 @@ hr { | |||
| 		border-radius: var(--radius); | ||||
| 	} | ||||
| 
 | ||||
| 	._magnet { | ||||
| 		margin-bottom: calc(var(--margin) * -1); | ||||
| 	}	 | ||||
| 
 | ||||
| 	@media (max-width: 500px) { | ||||
| 		._root { | ||||
| 			--root-margin: 0; | ||||
|  | @ -377,6 +373,12 @@ hr { | |||
| 	} | ||||
| } | ||||
| 
 | ||||
| ._magnetParent { | ||||
| 	._magnetChild:not(* + ._magnetChild) { | ||||
| 		margin-top: 0; | ||||
| 	} | ||||
| } | ||||
| 
 | ||||
| ._narrow_ ._card { | ||||
| 	> ._title { | ||||
| 		padding: 16px; | ||||
|  |  | |||
|  | @ -16,8 +16,6 @@ | |||
| 		panelShadow: '" 0 8px 24px rgb(0 0 0 / 25%)', | ||||
| 		panelHeaderBg: '@panel', | ||||
| 		panelHeaderDivider: '@divider', | ||||
| 		infoFg: '@accent', | ||||
| 		infoBg: 'rgb(0, 0, 0)', | ||||
| 		header: ':alpha<0.7<@panel', | ||||
| 		navBg: '#363636', | ||||
| 		renote: '@accent', | ||||
|  |  | |||
|  | @ -6,7 +6,7 @@ | |||
| 		</div> | ||||
| 
 | ||||
| 		<main class="main _panel" @contextmenu.stop="onContextmenu"> | ||||
| 			<header v-if="$store.state.titlebar" class="header" @click="onHeaderClick"> | ||||
| 			<header class="header" @click="onHeaderClick"> | ||||
| 				<XHeader :info="pageInfo"/> | ||||
| 			</header> | ||||
| 			<div class="content" :class="{ _flat_: !fullView }"> | ||||
|  |  | |||
|  | @ -2,8 +2,8 @@ | |||
| <div class="mk-app" :class="{ wallpaper }"> | ||||
| 	<XSidebar ref="nav" class="sidebar"/> | ||||
| 
 | ||||
| 	<div class="contents" ref="contents" :class="{ withHeader: $store.state.titlebar }" @contextmenu.stop="onContextmenu"> | ||||
| 		<header v-if="$store.state.titlebar" class="header" ref="header" @click="onHeaderClick"> | ||||
| 	<div class="contents" ref="contents" @contextmenu.stop="onContextmenu"> | ||||
| 		<header class="header" ref="header" @click="onHeaderClick"> | ||||
| 			<XHeader :info="pageInfo"/> | ||||
| 		</header> | ||||
| 		<main ref="main"> | ||||
|  | @ -260,10 +260,7 @@ export default defineComponent({ | |||
| 		width: 100%; | ||||
| 		min-width: 0; | ||||
| 		--stickyTop: #{$header-height}; | ||||
| 
 | ||||
| 		&.withHeader { | ||||
| 			padding-top: $header-height; | ||||
| 		} | ||||
| 		padding-top: $header-height; | ||||
| 
 | ||||
| 		> .header { | ||||
| 			position: fixed; | ||||
|  |  | |||
|  | @ -22,7 +22,7 @@ | |||
| 		</div> | ||||
| 	</div> | ||||
| 	<div class="deliver"> | ||||
| 		<div class="label">Deliver queue<Fa :icon="faExclamationTriangle" v-if="inbox.waiting > 0" class="icon"/></div> | ||||
| 		<div class="label">Deliver queue<Fa :icon="faExclamationTriangle" v-if="deliver.waiting > 0" class="icon"/></div> | ||||
| 		<div class="values"> | ||||
| 			<div> | ||||
| 				<div>Process</div> | ||||
|  |  | |||
|  | @ -6613,10 +6613,10 @@ methods@^1.1.2: | |||
|   resolved "https://registry.yarnpkg.com/methods/-/methods-1.1.2.tgz#5529a4d67654134edcc5266656835b0f851afcee" | ||||
|   integrity sha1-VSmk1nZUE07cxSZmVoNbD4Ua/O4= | ||||
| 
 | ||||
| mfm-js@0.14.0: | ||||
|   version "0.14.0" | ||||
|   resolved "https://registry.yarnpkg.com/mfm-js/-/mfm-js-0.14.0.tgz#0952ed6f0dd8553866bde7e646c3d5d3d23aeae9" | ||||
|   integrity sha512-snCiszquj6DIOARdgJfI8b6o9PbojAmJe1thrsBkUTxG+XG27rCOmjEL1kc1705XraJo0aVCLR9vE6YmjHiUQg== | ||||
| mfm-js@0.15.0: | ||||
|   version "0.15.0" | ||||
|   resolved "https://registry.yarnpkg.com/mfm-js/-/mfm-js-0.15.0.tgz#b7dea4225a992ac4fd873ad6b2cad069f171dc24" | ||||
|   integrity sha512-JW7AAQzXejo60JGwx+wzodkp45XKYBEq4bYlMDcxjmi2e+P0IOhAcpz2HPBbzxnO/4X3WPuklU8B16RUZpFFdg== | ||||
|   dependencies: | ||||
|     twemoji-parser "13.0.x" | ||||
| 
 | ||||
|  |  | |||
		Loading…
	
	Add table
		Add a link
		
	
		Reference in a new issue