chore(client): tweak style
This commit is contained in:
		
							parent
							
								
									1cb847aa80
								
							
						
					
					
						commit
						dc1a35c13c
					
				
					 2 changed files with 15 additions and 3 deletions
				
			
		|  | @ -6,7 +6,7 @@ | |||
| 				<span v-for="note in notes" :key="note.id" class="item"> | ||||
| 					<img class="avatar" :src="note.user.avatarUrl" decoding="async"/> | ||||
| 					<MkA class="text" :to="notePage(note)"> | ||||
| 						<Mfm :text="getNoteSummary(note)" :plain="true" :nowrap="true" :custom-emojis="note.emojis"/> | ||||
| 						<Mfm class="text" :text="getNoteSummary(note)" :plain="true" :nowrap="true" :custom-emojis="note.emojis"/> | ||||
| 					</MkA> | ||||
| 					<span class="divider"></span> | ||||
| 				</span> | ||||
|  | @ -91,11 +91,18 @@ useInterval(tick, Math.max(5000, props.refreshIntervalSec * 1000), { | |||
| 			margin-right: 8px; | ||||
| 		} | ||||
| 
 | ||||
| 		> .text { | ||||
| 			> .text { | ||||
| 				display: inline-block; | ||||
| 				vertical-align: bottom; | ||||
| 			} | ||||
| 		} | ||||
| 
 | ||||
| 		> .divider { | ||||
| 			display: inline-block; | ||||
| 			width: 0.5px; | ||||
| 			height: 16px; | ||||
| 			margin: 0 1em; | ||||
| 			margin: 0 2em; | ||||
| 			background: currentColor; | ||||
| 			opacity: 0; | ||||
| 		} | ||||
|  |  | |||
|  | @ -29,25 +29,30 @@ const XUserList = defineAsyncComponent(() => import('./statusbar-user-list.vue') | |||
| <style lang="scss" scoped> | ||||
| .dlrsnxqu { | ||||
| 	--height: 24px; | ||||
| 	--nameMargin: 10px; | ||||
| 	background: var(--panel); | ||||
| 	font-size: 0.85em; | ||||
| 
 | ||||
| 	&.verySmall { | ||||
| 		--nameMargin: 7px; | ||||
| 		--height: 16px; | ||||
| 		font-size: 0.75em; | ||||
| 	} | ||||
| 
 | ||||
| 	&.small { | ||||
| 		--nameMargin: 8px; | ||||
| 		--height: 20px; | ||||
| 		font-size: 0.8em; | ||||
| 	} | ||||
| 
 | ||||
| 	&.large { | ||||
| 		--nameMargin: 12px; | ||||
| 		--height: 26px; | ||||
| 		font-size: 0.875em; | ||||
| 	} | ||||
| 
 | ||||
| 	&.veryLarge { | ||||
| 		--nameMargin: 14px; | ||||
| 		--height: 30px; | ||||
| 		font-size: 0.9em; | ||||
| 	} | ||||
|  | @ -62,7 +67,7 @@ const XUserList = defineAsyncComponent(() => import('./statusbar-user-list.vue') | |||
| 		contain: strict; | ||||
| 
 | ||||
| 		> .name { | ||||
| 			padding: 0 6px; | ||||
| 			padding: 0 var(--nameMargin); | ||||
| 			font-weight: bold; | ||||
| 			color: var(--accent); | ||||
| 		} | ||||
|  |  | |||
		Loading…
	
	Add table
		Add a link
		
	
		Reference in a new issue