51 lines
		
	
	
		
			No EOL
		
	
	
		
			1.2 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
			
		
		
	
	
			51 lines
		
	
	
		
			No EOL
		
	
	
		
			1.2 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
{{#if error}}
 | 
						|
<svg class="{{className || ''}} avatar size-{{size}}" aria-hidden="true">
 | 
						|
  <use xlink:href="#fa-user" />
 | 
						|
</svg>
 | 
						|
{{elseif $autoplayGifs}}
 | 
						|
  <img class="{{className || ''}} avatar size-{{size}}" aria-hidden="true" alt=""
 | 
						|
     src="{{account.avatar}}" on:imgLoadError="set({error: true})" />
 | 
						|
{{else}}
 | 
						|
  <NonAutoplayImg className="{{className || ''}} avatar size-{{size}}" ariaHidden="true" alt=""
 | 
						|
       src="{{account.avatar}}" staticSrc="{{account.avatar_static}}" on:imgLoadError="set({error: true})" />
 | 
						|
{{/if}}
 | 
						|
<style>
 | 
						|
  :global(.avatar) {
 | 
						|
    border-radius: 4px;
 | 
						|
  }
 | 
						|
  :global(.avatar.size-small) {
 | 
						|
    width: 48px;
 | 
						|
    height: 48px;
 | 
						|
  }
 | 
						|
 | 
						|
  :global(.avatar.size-big) {
 | 
						|
    width: 100px;
 | 
						|
    height: 100px;
 | 
						|
  }
 | 
						|
 | 
						|
  @media (max-width: 767px) {
 | 
						|
    :global(.avatar.size-big) {
 | 
						|
      width: 80px;
 | 
						|
      height: 80px;
 | 
						|
    }
 | 
						|
  }
 | 
						|
 | 
						|
  svg.avatar {
 | 
						|
    fill: var(--deemphasized-text-color);
 | 
						|
  }
 | 
						|
</style>
 | 
						|
<script>
 | 
						|
  import { imgLoadError } from '../_utils/events'
 | 
						|
  import { store } from '../_store/store'
 | 
						|
  import NonAutoplayImg from './NonAutoplayImg.html'
 | 
						|
 | 
						|
  export default {
 | 
						|
    events: {
 | 
						|
      imgLoadError
 | 
						|
    },
 | 
						|
    store: () => store,
 | 
						|
    components: {
 | 
						|
      NonAutoplayImg
 | 
						|
    }
 | 
						|
  }
 | 
						|
</script> |