Refactor

src/page/about/about.html.ts

@@ -1,12 +1,12 @@
-import { Header } from "../../model/portfolio";
-import { html } from "../../model/misc";
-import { PageContent } from "../content/content";
+import { Header } from '../../model/portfolio';
+import { html } from '../../model/misc';
 
-import "./about.scss";
+import './about.scss';
 
 export const generate = ({ name, picture }: Header): html => `
     <section id="about">
-        ${PageContent.parseTypedContent(picture, true)}
+        ${picture.toHTML(true)}
         <div class="placeholder"></div>
         <h1>${name}</h1>
-    </section>`;
+    </section>
+`;

src/page/about/about.scss

@@ -16,7 +16,6 @@
   img {
     @include square($img-size);
     border-radius: 100%;
-    cursor: pointer;
   }
 
   p {

src/page/about/about.ts

@@ -4,14 +4,10 @@ import { PageElement } from '../../framework/page-element';
 
 import { generate } from './about.html';
 import { createElement } from '../../framework/helper/create-element';
+import { ContainerPage } from '../../framework/container-page';
 
-export class PageHeader extends PageElement {
+export class PageHeader extends ContainerPage {
   public constructor(header: Header) {
-    const root = createElement(generate(header));
-    const content = new PageContent(header.about);
-
-    super([content]);
-    this.setElement(root);
-    root.appendChild(content.getElement());
+    super(createElement(generate(header)), [new PageContent(header.about)]);
   }
 }