Fix background and fix PageElement system

src/page/main/main.html.ts

@@ -0,0 +1,6 @@
+import './main.scss';
+import { html } from '../../types/html';
+
+export const generate = (): html => `
+  <main></main>
+`;

src/page/main/main.scss

@@ -0,0 +1,21 @@
+@use '../../style/mixins' as *;
+
+main {
+  height: 100%;
+  overflow-x: hidden;
+  overflow-y: scroll;
+  perspective: 5px;
+
+  @media (hover: hover) {
+    &::-webkit-scrollbar-track,
+    &::-webkit-scrollbar {
+      background-color: transparent;
+      width: 12px;
+    }
+
+    &::-webkit-scrollbar-thumb {
+      background-color: var(--accent-color);
+      border-radius: var(--border-radius);
+    }
+  }
+}

src/page/main/main.ts

@@ -0,0 +1,10 @@
+import { PageElement } from '../page-element';
+import { generate } from './main.html';
+import { createElement } from '../../helper/create-element';
+
+export class Main extends PageElement {
+  constructor(...children: Array<PageElement>) {
+    super(createElement(generate()), children);
+    children.forEach(c => this.attachElement(c));
+  }
+}