-<h2 class="instance-name">{{ about?.instance.name }}</h2>
+<h2 *ngIf="displayInstanceName" class="instance-name">{{ about?.instance.name }}</h2>
-<div class="instance-short-description">{{ about?.instance.shortDescription }}</div>
+<div *ngIf="displayInstanceShortDescription" class="instance-short-description">{{ about?.instance.shortDescription }}</div>
<ngb-accordion #accordion="ngbAccordion" [closeOthers]="true">
- <ngb-panel *ngIf="panels.features" id="instance-features" i18n-title title="Features found on this instance">
+ <ngb-panel *ngIf="panels.features" id="instance-features">
+ <ng-template ngbPanelTitle>
+ <my-global-icon iconName="playlists"></my-global-icon>
+
+ <ng-container i18n>Features found on this instance</ng-container>
+ </ng-template>
+
<ng-template ngbPanelContent>
<my-instance-features-table></my-instance-features-table>
</ng-template>
</ngb-panel>
<ng-container *ngIf="about">
- <ngb-panel
- *ngIf="getAdministratorsPanel()"
- id="admin-sustainability" i18n-title title="Administrators & Sustainability"
- >
+ <ngb-panel *ngIf="getAdministratorsPanel()" >
+ <ng-template ngbPanelTitle>
+ <my-global-icon iconName="playlists"></my-global-icon>
+
+ <ng-container i18n>Administrators & Sustainability</ng-container>
+ </ng-template>
+
<ng-template ngbPanelContent>
<div class="block">
<strong i18n>Who are we?</strong>
</ng-template>
</ngb-panel>
- <ngb-panel *ngIf="termsPanel" id="terms" i18n-title title="Terms">
+ <ngb-panel *ngIf="termsPanel" id="terms">
+ <ng-template ngbPanelTitle>
+ <my-global-icon iconName="playlists"></my-global-icon>
+
+ {{ getTermsTitle() }}
+ </ng-template>
+
<ng-template ngbPanelContent>
<div class="block" [innerHTML]="aboutHtml.terms"></div>
</ng-template>
</ngb-panel>
- <ngb-panel *ngIf="moderationPanel" id="moderation-information" i18n-title title="Moderation information">
+ <ngb-panel *ngIf="moderationPanel" id="moderation-information">
+ <ng-template ngbPanelTitle>
+ <my-global-icon iconName="playlists"></my-global-icon>
+
+ <ng-container i18n>Moderation information</ng-container>
+ </ng-template>
+
<ng-template ngbPanelContent>
<div class="block" [innerHTML]="aboutHtml.moderationInformation"></div>
</ng-template>
</ngb-panel>
- <ngb-panel *ngIf="codeOfConductPanel" id="code-of-conduct" i18n-title title="Code of conduct">
+ <ngb-panel *ngIf="codeOfConductPanel" id="code-of-conduct">
+ <ng-template ngbPanelTitle>
+ <my-global-icon iconName="playlists"></my-global-icon>
+
+ <ng-container i18n>Code of conduct</ng-container>
+ </ng-template>
+
<ng-template ngbPanelContent>
<div class="block" [innerHTML]="aboutHtml.codeOfConduct"></div>
</ng-template>
</ngb-panel>
- <ngb-panel *ngFor="let pluginPanel of pluginPanels" [id]="pluginPanel.id" [title]="pluginPanel.title">
+ <ngb-panel *ngFor="let pluginPanel of pluginPanels" [id]="pluginPanel.id">
+ <ng-template ngbPanelTitle>
+ <my-global-icon iconName="playlists"></my-global-icon>
+
+ <ng-container i18n>{{ pluginPanel.title }}</ng-container>
+ </ng-template>
+
<ng-template ngbPanelContent>
<div class="block" [innerHTML]="pluginPanel.html"></div>
</ng-template>