Ghost/ghost/admin/app/templates/mentions.hbs

<section class="gh-canvas" {{scroll-top}}>
    <GhCanvasHeader class="gh-canvas-header">
        <div class="flex flex-column flex-grow-1">
            {{#if this.post }}
                <div class="gh-canvas-breadcrumb">
                    <LinkTo @route="posts">
                        Posts
                    </LinkTo>
                    {{svg-jar "arrow-right-small"}}
                    <LinkTo @route="posts.analytics" @model={{this.post.id}}>
                        Analytics
                    </LinkTo>
                    {{svg-jar "arrow-right-small"}}Mentions
                </div>
            {{else}}
                <div class="gh-canvas-breadcrumb">
                    <LinkTo @route="dashboard">
                        Dashboard
                    </LinkTo>
                    {{svg-jar "arrow-right-small"}}Mentions
                </div>
            {{/if}}
            <h2 class="gh-canvas-title gh-post-title" data-test-screen-title>
                {{#if this.post }}
                    {{this.post.title}}
                {{else}}
                    Mentions
                {{/if}}
            </h2>

            {{#if (and this.post this.mentionsInfinityModel)}}
                <div class="gh-post-analytics-meta">
                    <div class="gh-post-analytics-meta-text">
                        This post was mentioned in:
                    </div>
                </div>
            {{/if}}
        </div>
    </GhCanvasHeader>
    <section class="gh-mentions-main-section">
        <div class="gh-mentions-list {{unless this.mentionsInfinityModel "is-empty"}}">
            {{#if this.mentionsInfinityModel}}
                <div>
                    {{#each this.mentionsInfinityModel as |mention|}}
                        <a href="{{mention.source}}" class="gh-mention-card" rel="noreferrer noopener" target="_blank">
                            {{!-- TODO: link to the post analytics page of your post --}}
                            <div class="gh-mention-header">
                                {{#if mention.sourceFavicon}}
                                    <img src="{{mention.sourceFavicon}}" alt="{{mention.sourceSiteTitle}}" class="gh-mention-icon">
                                {{/if}}
                                <div class="gh-mention-publisher">{{mention.sourceSiteTitle}}</div>
                                {{#unless this.post }}
                                    <div class="gh-mention-link-icon">
                                        {{svg-jar "twitter-link"}}
                                    </div>
                                    <div>
                                        {{!-- TODO: Add logic so when there are multiple links, this span gets a .has-multiple-links class --}}
                                        <span class="gh-mention-your-link">{{if mention.resource mention.resource.name mention.target}}</span>
                                        <EmberPopover @tooltipClass="popover" @spacing={{30}} @arrowClass="popover-arrow" @side="down">
                                            <ul class="gh-mention-multiple-links">
                                                <li>Weekly Links - Week #13</li>
                                                <li>Welcome to my blog!</li>
                                                <li>Introducing: New Tool I Just Built</li>
                                                <li>Introducing: Even Newer Tool I Just Built For You Guys</li>
                                            </ul>
                                        </EmberPopover>
                                    </div>
                                {{/unless}}
                                <span class="gh-mention-timestamp" title={{gh-format-post-time mention.timestamp}}>{{moment-from-now mention.timestamp}}</span>
                            </div>
                            <div class="gh-mention-content">
                                <div class="gh-mention-source">
                                    <h3 class="gh-mention-title">{{if mention.sourceTitle mention.sourceTitle mention.target}}</h3>
                                    {{#if mention.sourceExcerpt}}
                                        <p class="gh-mention-description">{{mention.sourceExcerpt}}</p>
                                    {{/if}}
                                    <div class="gh-mention-metadata">
                                        {{#if mention.sourceAuthor}}
                                            <span class="gh-mention-author">{{mention.sourceAuthor}}</span>
                                        {{/if}}
                                    </div>
                                </div>
                                {{#if mention.sourceFeaturedImage}}
                                    <div class="gh-mention-thumbnail">
                                        <img src="{{mention.sourceFeaturedImage}}" alt="" role="presentation">
                                    </div>
                                {{/if}}
                            </div>
                        </a>
                    {{/each}}
                </div>
            {{else}}
                <div class="gh-mentions-list-cta">
                    {{svg-jar "email-love-letter" class="love-letter"}}
                    <h4>No mentions yet</h4>
                    <p>When other sites mention your posts, they'll appear here.</p>
                </div>
            {{/if}}
            <GhInfinityLoader
            @infinityModel={{this.mentionsInfinityModel}}
            @scrollable=".gh-main"
            @triggerOffset={{1000}} />
        </div>
        {{#if this.mentionsInfinityModel}}
            <div class="gh-mentions-sidebar">
                <div class="gh-mentions-explainer">
                    <img src="assets/img/mentions-background.png" alt="" role="presentation"/>
                    <h2>Introducing Mentions</h2>
                    <p>Whenever another person or site links to you, you’ll receive a notification in your dashboard to show you who’s talking about your content — and, when you link to someone else’s work, they’ll be notified, too.</p>
                </div>
            </div>
        {{/if}}
    </section>
</section>