wip
This commit is contained in:
		
							parent
							
								
									ffb0dadbc7
								
							
						
					
					
						commit
						10f9fd6146
					
				
					 5 changed files with 47 additions and 16 deletions
				
			
		|  | @ -138,13 +138,19 @@ export default defineComponent({ | |||
| 		}, | ||||
| 
 | ||||
| 		async openAccountMenu(ev) { | ||||
| 			const storedAccounts = getAccounts(); | ||||
| 			const accounts = (await os.api('users/show', { userIds: storedAccounts.map(x => x.id) })).filter(x => x.id !== this.$i.id); | ||||
| 			const storedAccounts = getAccounts().filter(x => x.id !== this.$i.id); | ||||
| 			const accountsPromise = os.api('users/show', { userIds: storedAccounts.map(x => x.id) }); | ||||
| 
 | ||||
| 			const accountItems = accounts.map(account => ({ | ||||
| 			const accountItemPromises = storedAccounts.map(a => new Promise(res => { | ||||
| 				accountsPromise.then(accounts => { | ||||
| 					const account = accounts.find(x => x.id === a.id); | ||||
| 					if (account == null) return res(null); | ||||
| 					res({ | ||||
| 						type: 'user', | ||||
| 						user: account, | ||||
| 						action: () => { this.switchAccount(account); } | ||||
| 					}); | ||||
| 				}); | ||||
| 			})); | ||||
| 
 | ||||
| 			os.modalMenu([...[{ | ||||
|  | @ -152,7 +158,7 @@ export default defineComponent({ | |||
| 				text: this.$ts.profile, | ||||
| 				to: `/@${ this.$i.username }`, | ||||
| 				avatar: this.$i, | ||||
| 			}, null, ...accountItems, { | ||||
| 			}, null, ...accountItemPromises, { | ||||
| 				icon: faPlus, | ||||
| 				text: this.$ts.addAcount, | ||||
| 				action: () => { | ||||
|  |  | |||
|  | @ -16,6 +16,8 @@ | |||
| 		bg: '#000', | ||||
| 		acrylicBg: ':alpha<0.5<@bg', | ||||
| 		fg: '#dadada', | ||||
| 		fgTransparentWeak: ':alpha<0.75<@fg', | ||||
| 		fgTransparent: ':alpha<0.5<@fg', | ||||
| 		fgHighlighted: ':lighten<3<@fg', | ||||
| 		divider: 'rgba(255, 255, 255, 0.1)', | ||||
| 		indicator: '@accent', | ||||
|  | @ -77,5 +79,6 @@ | |||
| 		X14: ':alpha<0.5<@navBg', | ||||
| 		X15: ':alpha<0<@panel', | ||||
| 		X16: ':alpha<0.7<@panel', | ||||
| 		X17: ':alpha<0.8<@bg', | ||||
| 	}, | ||||
| } | ||||
|  |  | |||
|  | @ -16,6 +16,8 @@ | |||
| 		bg: '#fff', | ||||
| 		acrylicBg: ':alpha<0.5<@bg', | ||||
| 		fg: '#5f5f5f', | ||||
| 		fgTransparentWeak: ':alpha<0.75<@fg', | ||||
| 		fgTransparent: ':alpha<0.5<@fg', | ||||
| 		fgHighlighted: ':darken<3<@fg', | ||||
| 		divider: 'rgba(0, 0, 0, 0.1)', | ||||
| 		indicator: '@accent', | ||||
|  | @ -77,5 +79,6 @@ | |||
| 		X14: ':alpha<0.5<@navBg', | ||||
| 		X15: ':alpha<0<@panel', | ||||
| 		X16: ':alpha<0.7<@panel', | ||||
| 		X17: ':alpha<0.8<@bg', | ||||
| 	}, | ||||
| } | ||||
|  |  | |||
|  | @ -200,6 +200,11 @@ export default defineComponent({ | |||
| 	}, | ||||
| 
 | ||||
| 	created() { | ||||
| 		if (window.innerWidth < 1024) { | ||||
| 			localStorage.setItem('ui', 'default'); | ||||
| 			location.reload(); | ||||
| 		} | ||||
| 
 | ||||
| 		router.beforeEach((to, from) => { | ||||
| 			this.$refs.side.navigate(to.fullPath); | ||||
| 			// search?q=foo のようなクエリを受け取れるようにするため、return falseはできない | ||||
|  | @ -414,10 +419,12 @@ export default defineComponent({ | |||
| 		> .body { | ||||
| 			flex: 1; | ||||
| 			min-width: 0; | ||||
| 			padding: 8px 0; | ||||
| 			overflow: auto; | ||||
| 
 | ||||
| 			> .container { | ||||
| 				margin-top: 8px; | ||||
| 				margin-bottom: 8px; | ||||
| 
 | ||||
| 				& + .container { | ||||
| 					margin-top: 16px; | ||||
| 				} | ||||
|  | @ -426,10 +433,21 @@ export default defineComponent({ | |||
| 					display: flex; | ||||
| 					font-size: 0.9em; | ||||
| 					padding: 8px 16px; | ||||
| 					opacity: 0.7; | ||||
| 					position: sticky; | ||||
| 					top: 0; | ||||
| 					background: var(--X17); | ||||
| 					-webkit-backdrop-filter: blur(8px); | ||||
| 					backdrop-filter: blur(8px); | ||||
| 					z-index: 1; | ||||
| 					color: var(--fgTransparentWeak); | ||||
| 
 | ||||
| 					> .add { | ||||
| 						margin-left: auto; | ||||
| 						color: var(--fgTransparentWeak); | ||||
| 
 | ||||
| 						&:hover { | ||||
| 							color: var(--fg); | ||||
| 						} | ||||
| 					} | ||||
| 				} | ||||
| 
 | ||||
|  | @ -448,11 +466,11 @@ export default defineComponent({ | |||
| 
 | ||||
| 						&.active, &.active:hover { | ||||
| 							background: var(--accent); | ||||
| 							color: #fff; | ||||
| 							color: #fff !important; | ||||
| 						} | ||||
| 
 | ||||
| 						&.read { | ||||
| 							opacity: 0.5; | ||||
| 							color: var(--fgTransparent); | ||||
| 						} | ||||
| 
 | ||||
| 						> .icon { | ||||
|  | @ -527,6 +545,7 @@ export default defineComponent({ | |||
| 
 | ||||
| 				> .instance { | ||||
| 					margin-right: 16px; | ||||
| 					font-size: 0.9em; | ||||
| 				} | ||||
| 
 | ||||
| 				> .clock { | ||||
|  |  | |||
|  | @ -65,21 +65,21 @@ | |||
| 			</div> | ||||
| 			<XReactionsViewer :note="appearNote" ref="reactionsViewer"/> | ||||
| 			<footer class="footer _panel"> | ||||
| 				<button @click="reply()" class="button _button"> | ||||
| 				<button @click="reply()" class="button _button" v-tooltip="$ts.reply"> | ||||
| 					<template v-if="appearNote.reply"><Fa :icon="faReplyAll"/></template> | ||||
| 					<template v-else><Fa :icon="faReply"/></template> | ||||
| 					<p class="count" v-if="appearNote.repliesCount > 0">{{ appearNote.repliesCount }}</p> | ||||
| 				</button> | ||||
| 				<button v-if="canRenote" @click="renote()" class="button _button" ref="renoteButton"> | ||||
| 				<button v-if="canRenote" @click="renote()" class="button _button" ref="renoteButton" v-tooltip="$ts.renote"> | ||||
| 					<Fa :icon="faRetweet"/><p class="count" v-if="appearNote.renoteCount > 0">{{ appearNote.renoteCount }}</p> | ||||
| 				</button> | ||||
| 				<button v-else class="button _button"> | ||||
| 					<Fa :icon="faBan"/> | ||||
| 				</button> | ||||
| 				<button v-if="appearNote.myReaction == null" class="button _button" @click="react()" ref="reactButton"> | ||||
| 				<button v-if="appearNote.myReaction == null" class="button _button" @click="react()" ref="reactButton" v-tooltip="$ts.reaction"> | ||||
| 					<Fa :icon="faPlus"/> | ||||
| 				</button> | ||||
| 				<button v-if="appearNote.myReaction != null" class="button _button reacted" @click="undoReact(appearNote)" ref="reactButton"> | ||||
| 				<button v-if="appearNote.myReaction != null" class="button _button reacted" @click="undoReact(appearNote)" ref="reactButton" v-tooltip="$ts.reaction"> | ||||
| 					<Fa :icon="faMinus"/> | ||||
| 				</button> | ||||
| 				<button class="button _button" @click="menu()" ref="menuButton"> | ||||
|  | @ -911,7 +911,7 @@ export default defineComponent({ | |||
| 		align-items: center; | ||||
| 		padding: 12px 16px 4px 16px; | ||||
| 		line-height: 24px; | ||||
| 		font-size: 90%; | ||||
| 		font-size: 85%; | ||||
| 		white-space: pre; | ||||
| 		color: #d28a3f; | ||||
| 
 | ||||
|  |  | |||
		Loading…
	
	Add table
		Add a link
		
	
		Reference in a new issue