simplify ExternalLink
This commit is contained in:
		
							parent
							
								
									689cd97071
								
							
						
					
					
						commit
						c73223c968
					
				
					 4 changed files with 26 additions and 39 deletions
				
			
		| 
						 | 
				
			
			@ -1,31 +1,30 @@
 | 
			
		|||
{{#if class}}
 | 
			
		||||
  <a rel="nofollow noopener" target="_blank" href="{{href}}" class="external-link {{class}}">
 | 
			
		||||
    <slot></slot>
 | 
			
		||||
    {{#if showIcon}}
 | 
			
		||||
      <svg>
 | 
			
		||||
        <use xlink:href="#fa-external-link" />
 | 
			
		||||
      </svg>
 | 
			
		||||
    {{/if}}
 | 
			
		||||
  </a>
 | 
			
		||||
{{else}}
 | 
			
		||||
  <a rel="nofollow noopener" target="_blank" href="{{href}}" class="external-link">
 | 
			
		||||
    <slot></slot>
 | 
			
		||||
    {{#if showIcon}}
 | 
			
		||||
      <svg>
 | 
			
		||||
        <use xlink:href="#fa-external-link" />
 | 
			
		||||
      </svg>
 | 
			
		||||
    {{/if}}
 | 
			
		||||
  </a>
 | 
			
		||||
{{/if}}
 | 
			
		||||
<a rel="nofollow noopener"
 | 
			
		||||
   target="_blank"
 | 
			
		||||
   href="{{href}}"
 | 
			
		||||
   class="{{className || ''}} {{showIcon ? 'external-link-with-icon' : ''}}">
 | 
			
		||||
  <slot></slot>
 | 
			
		||||
  {{#if showIcon}}
 | 
			
		||||
    <svg>
 | 
			
		||||
      <use xlink:href="#fa-external-link" />
 | 
			
		||||
    </svg>
 | 
			
		||||
  {{/if}}
 | 
			
		||||
</a>
 | 
			
		||||
<style>
 | 
			
		||||
  .external-link {
 | 
			
		||||
  .external-link-with-icon {
 | 
			
		||||
    display: inline-flex;
 | 
			
		||||
    align-items: center;
 | 
			
		||||
  }
 | 
			
		||||
  .external-link svg {
 | 
			
		||||
  .external-link-with-icon svg {
 | 
			
		||||
    margin-left: 4px;
 | 
			
		||||
    width: 14px;
 | 
			
		||||
    height: 14px;
 | 
			
		||||
    fill: var(--deemphasized-text-color);
 | 
			
		||||
  }
 | 
			
		||||
</style>
 | 
			
		||||
</style>
 | 
			
		||||
<script>
 | 
			
		||||
  export default {
 | 
			
		||||
    oncreate() {
 | 
			
		||||
      this.set({className: this.get('class')}) // workaround for "class" property name bug in svelte
 | 
			
		||||
    }
 | 
			
		||||
  }
 | 
			
		||||
</script>
 | 
			
		||||
| 
						 | 
				
			
			@ -7,25 +7,15 @@
 | 
			
		|||
        <use xlink:href="#fa-retweet" />
 | 
			
		||||
      </svg>
 | 
			
		||||
      <span>
 | 
			
		||||
        {{#if timelineType === 'account' && timelineValue === status.account.id}}
 | 
			
		||||
          <ExternalLink href="{{status.account.url}}">{{status.account.username}}</ExternalLink>
 | 
			
		||||
        {{else}}
 | 
			
		||||
          <a href="/accounts/{{status.account.id}}">{{status.account.username}}</a>
 | 
			
		||||
        {{/if}}
 | 
			
		||||
        <a href="/accounts/{{status.account.id}}">{{status.account.username}}</a>
 | 
			
		||||
        boosted
 | 
			
		||||
      </span>
 | 
			
		||||
    </div>
 | 
			
		||||
  {{/if}}
 | 
			
		||||
  <div class="status-author">
 | 
			
		||||
    {{#if timelineType === 'account' && timelineValue === originalAccount.id}}
 | 
			
		||||
      <ExternalLink class="status-author-name" href="{{originalAccount.url}}">
 | 
			
		||||
        {{originalAccount.display_name || originalAccount.username}}
 | 
			
		||||
      </ExternalLink>
 | 
			
		||||
    {{else}}
 | 
			
		||||
      <a class="status-author-name" href="/accounts/{{originalAccount.id}}">
 | 
			
		||||
        {{originalAccount.display_name || originalAccount.username}}
 | 
			
		||||
      </a>
 | 
			
		||||
    {{/if}}
 | 
			
		||||
    <a class="status-author-name" href="/accounts/{{originalAccount.id}}">
 | 
			
		||||
      {{originalAccount.display_name || originalAccount.username}}
 | 
			
		||||
    </a>
 | 
			
		||||
    <span class="status-author-handle">
 | 
			
		||||
      {{'@' + originalAccount.acct}}
 | 
			
		||||
    </span>
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -1,6 +1,5 @@
 | 
			
		|||
<Status status="{{virtualProps.status}}"
 | 
			
		||||
        timelineType="{{virtualProps.timelineType}}"
 | 
			
		||||
        timelineValue="{{virtualProps.timelineValue}}"
 | 
			
		||||
        index="{{virtualIndex}}"
 | 
			
		||||
        length="{{virtualLength}}"
 | 
			
		||||
        on:recalculateHeight />
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -33,9 +33,8 @@
 | 
			
		|||
      LoadingFooter: LoadingFooter
 | 
			
		||||
    }),
 | 
			
		||||
    computed: {
 | 
			
		||||
      makeProps: ($currentInstance, timelineType, timelineValue) => async (statusId) => ({
 | 
			
		||||
      makeProps: ($currentInstance, timelineType) => async (statusId) => ({
 | 
			
		||||
        timelineType: timelineType,
 | 
			
		||||
        timelineValue: timelineValue,
 | 
			
		||||
        status: await database.getStatus($currentInstance, statusId)
 | 
			
		||||
      }),
 | 
			
		||||
      label: (timeline, $currentInstance, timelineType, timelineValue) => {
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
		Loading…
	
	Add table
		
		Reference in a new issue