<div class="attachment" [ngStyle]="{ 'border-left-color': borderColor }">
    <div class="left" style="width: 100%;">
        <!-- Author -->
        <span *ngIf="!!attachment.author_link" class="author">
            <img *ngIf="!!attachment.author_icon" [src]="authorIcon" class="author-icon" />
            <span>
                <a class="author-name" [href]="attachment.author_link">{{attachment.author_name}}</a>

                <span class="author-subname" *ngIf="!!attachment.author_subname">
                    <a class="author-subname" [href]="attachment.author_link">{{attachment.author_subname}}</a>
                </span>
            </span>
        </span>

        <!-- Service -->
        <div *ngIf="!!attachment.service_name" class="service">
            <img *ngIf="!!attachment.service_icon" [src]="attachment.service_icon" class="service-icon"/>

            <span class="service-name">
                {{attachment.service_name}}
            </span>
        </div>

        <!-- Title -->
        <div *ngIf="!!attachment.title" class="title">
            <span [ngSwitch]="!!attachment.title_link">
                <a class="title" [href]="attachment.title_link" *ngSwitchCase="true" [innerHTML]="attachment.title"></a>
                <b class="title" *ngSwitchDefault [innerHTML]="attachment.title"></b>
            </span>
        </div>

        <!-- Text -->
        <div *ngIf="!!attachment.text" class="text" [innerHTML]="attachmentTextParse(attachment.text) | safeHtml">
        </div>

        <!-- Fields -->
        <div *ngIf="!!attachment.fields" class="row" style="margin-right: 0;">
            <div *ngFor="let field of attachment.fields" class="field" [class.col-xs-6]="field.short" [class.col-xs-12]="!field.short">
                <label *ngIf="!!field.title" style="margin-bottom: 0;" [innerHTML]="parse(field.title)"></label>
                <div [innerHTML]="parse(field.value)"></div>
            </div>
        </div>

        <!-- Footer -->
        <div *ngIf="!!attachment.footer" class="footer">
            <span *ngIf="!!attachment.footer_icon" class="footer-icon">
                <img class="footer-icon-image" [src]="attachment.footer_icon" />
            </span>

            <span class="footer-text" [innerHTML]="parse(attachment.footer)"></span>

            <a *ngIf="!!attachment.ts" class="footer-ts" [href]="attachment.from_url">{{attachment.ts | ts2time}}</a>
        </div>

        <div *ngIf="showImage">
            <img [src]="attachment.image_url" class="image" [class.small]="smallImage"/>
        </div>
    </div>

    <div *ngIf="!!attachment.thumb_url" class="right">
        <!-- Image -->
        <div *ngIf="!!attachment.thumb_url">
            <img [src]="attachment.thumb_url" class="thumbnail"/>
        </div>
    </div>
</div>
