6 files changed, 117 insertions, 0 deletions

diff --git a/client/src/app/about/about-routing.module.ts b/client/src/app/about/about-routing.module.ts
new file mode 100644
index 000000000..11a650c80
--- /dev/null
+++ b/client/src/app/about/about-routing.module.ts
@@ -0,0 +1,23 @@
+import { NgModule } from '@angular/core'
+import { RouterModule, Routes } from '@angular/router'
+import { MetaGuard } from '@ngx-meta/core'
+import { AboutComponent } from './about.component'
+
+const aboutRoutes: Routes = [
+  {
+    path: 'about',
+    component: AboutComponent,
+    canActivate: [ MetaGuard ],
+    data: {
+      meta: {
+        title: 'About'
+      }
+    }
+  }
+]
+
+@NgModule({
+  imports: [ RouterModule.forChild(aboutRoutes) ],
+  exports: [ RouterModule ]
+})
+export class AboutRoutingModule {}
diff --git a/client/src/app/about/about.component.html b/client/src/app/about/about.component.html
new file mode 100644
index 000000000..c0be53581
--- /dev/null
+++ b/client/src/app/about/about.component.html
@@ -0,0 +1,17 @@
+<div class="margin-content">
+  <div class="title-page title-page-single">
+    Welcome to the {{ instanceName }} instance
+  </div>
+
+  <div class="description">
+    <div class="section-title">Description</div>
+
+    <div [innerHTML]="descriptionHTML"></div>
+  </div>
+
+  <div class="terms">
+    <div class="section-title">Terms</div>
+
+    <div [innerHTML]="termsHTML"></div>
+  </div>
+</div>
diff --git a/client/src/app/about/about.component.scss b/client/src/app/about/about.component.scss
new file mode 100644
index 000000000..dba4df729
--- /dev/null
+++ b/client/src/app/about/about.component.scss
@@ -0,0 +1,12 @@
+@import '_variables';
+@import '_mixins';
+
+.section-title {
+  font-weight: $font-semibold;
+  font-size: 20px;
+  margin-bottom: 5px;
+}
+
+.description {
+  margin-bottom: 30px;
+}
diff --git a/client/src/app/about/about.component.ts b/client/src/app/about/about.component.ts
new file mode 100644
index 000000000..6a2e59be1
--- /dev/null
+++ b/client/src/app/about/about.component.ts
@@ -0,0 +1,38 @@
+import { Component, OnInit } from '@angular/core'
+import { ServerService } from '@app/core'
+import { MarkdownService } from '@app/videos/shared'
+import { NotificationsService } from 'angular2-notifications'
+
+@Component({
+  selector: 'my-about',
+  templateUrl: './about.component.html',
+  styleUrls: [ './about.component.scss' ]
+})
+
+export class AboutComponent implements OnInit {
+  descriptionHTML = ''
+  termsHTML = ''
+
+  constructor (
+    private notificationsService: NotificationsService,
+    private serverService: ServerService,
+    private markdownService: MarkdownService
+  ) {}
+
+  get instanceName () {
+    return this.serverService.getConfig().instance.name
+  }
+
+  ngOnInit () {
+    this.serverService.getAbout()
+      .subscribe(
+        res => {
+          this.descriptionHTML = this.markdownService.markdownToHTML(res.instance.description)
+          this.termsHTML = this.markdownService.markdownToHTML(res.instance.terms)
+        },
+
+        err => this.notificationsService.error('Error', err)
+      )
+  }
+
+}
diff --git a/client/src/app/about/about.module.ts b/client/src/app/about/about.module.ts
new file mode 100644
index 000000000..da3163f43
--- /dev/null
+++ b/client/src/app/about/about.module.ts
@@ -0,0 +1,24 @@
+import { NgModule } from '@angular/core'
+
+import { AboutRoutingModule } from './about-routing.module'
+import { AboutComponent } from './about.component'
+import { SharedModule } from '../shared'
+
+@NgModule({
+  imports: [
+    AboutRoutingModule,
+    SharedModule
+  ],
+
+  declarations: [
+    AboutComponent
+  ],
+
+  exports: [
+    AboutComponent
+  ],
+
+  providers: [
+  ]
+})
+export class AboutModule { }
diff --git a/client/src/app/about/index.ts b/client/src/app/about/index.ts
new file mode 100644
index 000000000..218d09801
--- /dev/null
+++ b/client/src/app/about/index.ts
@@ -0,0 +1,3 @@
+export * from './about-routing.module'
+export * from './about.component'
+export * from './about.module'