* allow user display names to contain custom emoji fixes #445 * fix tests * fix focus issue
		
			
				
	
	
		
			47 lines
		
	
	
		
			No EOL
		
	
	
		
			1.2 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
			
		
		
	
	
			47 lines
		
	
	
		
			No EOL
		
	
	
		
			1.2 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
| <a class="status-author-name {isStatusInNotification ? 'status-in-notification' : '' } {isStatusInOwnThread ? 'status-in-own-thread' : ''}"
 | |
|    href="/accounts/{originalAccountId}"
 | |
|    title="{'@' + originalAccount.acct}"
 | |
|    focus-key={focusKey}
 | |
| >
 | |
|   <AccountDisplayName account={originalAccount} />
 | |
| </a>
 | |
| <style>
 | |
|   .status-author-name {
 | |
|     grid-area: author-name;
 | |
|     align-self: center;
 | |
|     margin-left: 5px;
 | |
|     font-size: 1.1em;
 | |
|     min-width: 0;
 | |
|     font-weight: 600;
 | |
|     white-space: nowrap;
 | |
|     overflow: hidden;
 | |
|     text-overflow: ellipsis;
 | |
|   }
 | |
| 
 | |
|   .status-author-name.status-in-own-thread {
 | |
|     font-size: 1.3em;
 | |
|   }
 | |
| 
 | |
|   .status-author-name, .status-author-name:hover, .status-author-name:visited {
 | |
|     color: var(--body-text-color);
 | |
|   }
 | |
| 
 | |
|   .status-author-name.status-in-notification,
 | |
|   .status-author-name.status-in-notification:hover,
 | |
|   .status-author-name.status-in-notification:visited {
 | |
|     color: var(--very-deemphasized-text-color);
 | |
|   }
 | |
| 
 | |
| </style>
 | |
| <script>
 | |
|   import AccountDisplayName from '../profile/AccountDisplayName.html'
 | |
| 
 | |
|   export default {
 | |
|     computed: {
 | |
|       focusKey: ({ uuid }) => `status-author-name-${uuid}`
 | |
|     },
 | |
|     components: {
 | |
|       AccountDisplayName
 | |
|     }
 | |
|   }
 | |
| </script> |