enhance: ノートヘッダーにflex-shrinkを設定し、Acctを優先的に縮小して見栄えをよくするように (#7752)
* MAKE NOTE HEADER FLEX AGAIN * span => div * remove submodules
This commit is contained in:
		
							parent
							
								
									388de9dc96
								
							
						
					
					
						commit
						90bf976fe2
					
				
					 1 changed files with 8 additions and 4 deletions
				
			
		|  | @ -3,10 +3,10 @@ | ||||||
| 	<MkA class="name" :to="userPage(note.user)" v-user-preview="note.user.id"> | 	<MkA class="name" :to="userPage(note.user)" v-user-preview="note.user.id"> | ||||||
| 		<MkUserName :user="note.user"/> | 		<MkUserName :user="note.user"/> | ||||||
| 	</MkA> | 	</MkA> | ||||||
| 	<span class="is-bot" v-if="note.user.isBot">bot</span> | 	<div class="is-bot" v-if="note.user.isBot">bot</div> | ||||||
| 	<span class="username"><MkAcct :user="note.user"/></span> | 	<div class="username"><MkAcct :user="note.user"/></div> | ||||||
| 	<span class="admin" v-if="note.user.isAdmin"><i class="fas fa-bookmark"></i></span> | 	<div class="admin" v-if="note.user.isAdmin"><i class="fas fa-bookmark"></i></div> | ||||||
| 	<span class="moderator" v-if="!note.user.isAdmin && note.user.isModerator"><i class="far fa-bookmark"></i></span> | 	<div class="moderator" v-if="!note.user.isAdmin && note.user.isModerator"><i class="far fa-bookmark"></i></div> | ||||||
| 	<div class="info"> | 	<div class="info"> | ||||||
| 		<span class="mobile" v-if="note.viaMobile"><i class="fas fa-mobile-alt"></i></span> | 		<span class="mobile" v-if="note.viaMobile"><i class="fas fa-mobile-alt"></i></span> | ||||||
| 		<MkA class="created-at" :to="notePage(note)"> | 		<MkA class="created-at" :to="notePage(note)"> | ||||||
|  | @ -55,6 +55,7 @@ export default defineComponent({ | ||||||
| 	white-space: nowrap; | 	white-space: nowrap; | ||||||
| 
 | 
 | ||||||
| 	> .name { | 	> .name { | ||||||
|  | 		flex-shrink: 1; | ||||||
| 		display: block; | 		display: block; | ||||||
| 		margin: 0 .5em 0 0; | 		margin: 0 .5em 0 0; | ||||||
| 		padding: 0; | 		padding: 0; | ||||||
|  | @ -81,17 +82,20 @@ export default defineComponent({ | ||||||
| 
 | 
 | ||||||
| 	> .admin, | 	> .admin, | ||||||
| 	> .moderator { | 	> .moderator { | ||||||
|  | 		flex-shrink: 0; | ||||||
| 		margin-right: 0.5em; | 		margin-right: 0.5em; | ||||||
| 		color: var(--badge); | 		color: var(--badge); | ||||||
| 	} | 	} | ||||||
| 
 | 
 | ||||||
| 	> .username { | 	> .username { | ||||||
|  | 		flex-shrink: 9999999; | ||||||
| 		margin: 0 .5em 0 0; | 		margin: 0 .5em 0 0; | ||||||
| 		overflow: hidden; | 		overflow: hidden; | ||||||
| 		text-overflow: ellipsis; | 		text-overflow: ellipsis; | ||||||
| 	} | 	} | ||||||
| 
 | 
 | ||||||
| 	> .info { | 	> .info { | ||||||
|  | 		flex-shrink: 0; | ||||||
| 		margin-left: auto; | 		margin-left: auto; | ||||||
| 		font-size: 0.9em; | 		font-size: 0.9em; | ||||||
| 
 | 
 | ||||||
|  |  | ||||||
		Loading…
	
	Add table
		Add a link
		
	
		Reference in a new issue