Reformat files

src/data/projects/ad-astra.ts

@@ -1,11 +1,10 @@
-import adAstraWebP from '../media/ad_astra.jpg?format=webp';
-import adAstraJpeg from '../media/ad_astra.jpg?format=jpg';
-import adAstraMp4 from '../media/mp4/ad_astra.mp4';
-import adAstraWebM from '../media/webm/ad_astra.webm';
-
-import { GitHub } from '../shared';
 import { Video } from '../../page/basics/video/video';
 import { TimelineElementParameters } from '../../page/timeline/timeline-element/timeline-element';
+import adAstraJpeg from '../media/ad_astra.jpg?format=jpg';
+import adAstraWebP from '../media/ad_astra.jpg?format=webp';
+import adAstraMp4 from '../media/mp4/ad_astra.mp4';
+import adAstraWebM from '../media/webm/ad_astra.webm';
+import { GitHub } from '../shared';
 
 export const adAstraTimelineElement: TimelineElementParameters = {
   title: `Gaming on an ATtiny85`,

src/data/projects/city-simulation.ts

@@ -1,10 +1,9 @@
-import citySimulationPosterWebP from '../media/simulation.jpg?format=webp';
-import citySimulationPosterJpeg from '../media/simulation.jpg?format=jpg';
-import citySimulationMp4 from '../media/mp4/simulation.mp4';
-import citySimulationWebM from '../media/webm/simulation.webm';
-
 import { Video } from '../../page/basics/video/video';
 import { TimelineElementParameters } from '../../page/timeline/timeline-element/timeline-element';
+import citySimulationMp4 from '../media/mp4/simulation.mp4';
+import citySimulationPosterJpeg from '../media/simulation.jpg?format=jpg';
+import citySimulationPosterWebP from '../media/simulation.jpg?format=webp';
+import citySimulationWebM from '../media/webm/simulation.webm';
 
 export const citySimulationTimelineElement: TimelineElementParameters = {
   title: `City simulation`,

src/data/projects/colors.ts

@@ -1,8 +1,7 @@
-import colourJpeg from '../media/color.jpg?format=jpg';
-import colourWebP from '../media/color.jpg?format=webp';
-
 import { Image } from '../../page/basics/image/image';
 import { TimelineElementParameters } from '../../page/timeline/timeline-element/timeline-element';
+import colourJpeg from '../media/color.jpg?format=jpg';
+import colourWebP from '../media/color.jpg?format=webp';
 
 export const colorsTimelineElement: TimelineElementParameters = {
   title: `Photo colour grader`,

src/data/projects/forex.ts

@@ -1,10 +1,9 @@
-import forexPosterWebP from '../media/forex.jpg?format=webp';
-import forexPosterJpeg from '../media/forex.jpg?format=jpg';
-import forexMp4 from '../media/mp4/forex.mp4';
-import forexWebM from '../media/webm/forex.webm';
-
 import { Video } from '../../page/basics/video/video';
 import { TimelineElementParameters } from '../../page/timeline/timeline-element/timeline-element';
+import forexPosterJpeg from '../media/forex.jpg?format=jpg';
+import forexPosterWebP from '../media/forex.jpg?format=webp';
+import forexMp4 from '../media/mp4/forex.mp4';
+import forexWebM from '../media/webm/forex.webm';
 
 export const forexTimelineElement: TimelineElementParameters = {
   title: `Predicting foreign exchange rates`,

src/data/projects/leds.ts

@@ -1,10 +1,9 @@
-import ledPosterWebP from '../media/led.jpg?format=webp';
-import ledPosterJpeg from '../media/led.jpg?format=jpg';
-import ledMp4 from '../media/mp4/led.mp4';
-import ledWebM from '../media/webm/led.webm';
-
 import { Video } from '../../page/basics/video/video';
 import { TimelineElementParameters } from '../../page/timeline/timeline-element/timeline-element';
+import ledPosterJpeg from '../media/led.jpg?format=jpg';
+import ledPosterWebP from '../media/led.jpg?format=webp';
+import ledMp4 from '../media/mp4/led.mp4';
+import ledWebM from '../media/webm/led.webm';
 
 export const ledsTimelineElement: TimelineElementParameters = {
   title: `Lights synchronised to music`,

src/data/projects/my-notes.ts

@@ -1,9 +1,8 @@
+import { Image } from '../../page/basics/image/image';
+import { TimelineElementParameters } from '../../page/timeline/timeline-element/timeline-element';
 import myNotesJpeg from '../media/my-notes.png?format=jpg';
 import myNotesWebP from '../media/my-notes.png?format=webp';
-
-import { Image } from '../../page/basics/image/image';
 import { GitHub } from '../shared';
-import { TimelineElementParameters } from '../../page/timeline/timeline-element/timeline-element';
 
 export const myNotesTimelineElement: TimelineElementParameters = {
   title: `My Notes`,

src/data/projects/nuclear-editor.ts

@@ -1,8 +1,7 @@
-import processSimulatorInputJpeg from '../media/process-simulator-input.jpg?format=jpg';
-import processSimulatorInputWebP from '../media/process-simulator-input.jpg?format=webp';
-
 import { Image } from '../../page/basics/image/image';
 import { TimelineElementParameters } from '../../page/timeline/timeline-element/timeline-element';
+import processSimulatorInputJpeg from '../media/process-simulator-input.jpg?format=jpg';
+import processSimulatorInputWebP from '../media/process-simulator-input.jpg?format=webp';
 
 export const nuclearEditorTimelineElement: TimelineElementParameters = {
   title: `Graph editing application`,

src/data/projects/nuclear.ts

@@ -1,8 +1,7 @@
-import processSimulatorJpeg from '../media/process-simulator.jpg?format=jpg';
-import processSimulatorWebP from '../media/process-simulator.jpg?format=webp';
-
 import { Image } from '../../page/basics/image/image';
 import { TimelineElementParameters } from '../../page/timeline/timeline-element/timeline-element';
+import processSimulatorJpeg from '../media/process-simulator.jpg?format=jpg';
+import processSimulatorWebP from '../media/process-simulator.jpg?format=webp';
 
 export const nuclearTimelineElement: TimelineElementParameters = {
   title: `Simulating the cooling system of a nuclear facility`,

src/data/projects/photos.ts

@@ -1,9 +1,8 @@
+import { Image } from '../../page/basics/image/image';
+import { TimelineElementParameters } from '../../page/timeline/timeline-element/timeline-element';
 import photosJpeg from '../media/photos.jpg?format=jpg';
 import photosWebP from '../media/photos.jpg?format=webp';
-
-import { Image } from '../../page/basics/image/image';
 import { Open } from '../shared';
-import { TimelineElementParameters } from '../../page/timeline/timeline-element/timeline-element';
 
 export const photosTimelineElement: TimelineElementParameters = {
   title: `Photos`,

src/data/projects/platform-game.ts

@@ -1,10 +1,9 @@
-import platformPosterWebP from '../media/platform.png?format=webp';
-import platformPosterJpeg from '../media/platform.png?format=jpg';
-import platformMp4 from '../media/mp4/platform.mp4';
-import platformWebM from '../media/webm/platform.webm';
-
 import { Video } from '../../page/basics/video/video';
 import { TimelineElementParameters } from '../../page/timeline/timeline-element/timeline-element';
+import platformMp4 from '../media/mp4/platform.mp4';
+import platformPosterJpeg from '../media/platform.png?format=jpg';
+import platformPosterWebP from '../media/platform.png?format=webp';
+import platformWebM from '../media/webm/platform.webm';
 
 export const platformGameTimelineElement: TimelineElementParameters = {
   title: `Platform game`,

src/data/projects/sdf2d.ts

@@ -1,9 +1,8 @@
+import { Preview } from '../../page/basics/preview/preview';
+import { TimelineElementParameters } from '../../page/timeline/timeline-element/timeline-element';
 import sdf2dJpeg from '../media/sdf2d.png?format=jpg';
 import sdf2dWebP from '../media/sdf2d.png?format=webp';
-
-import { Preview } from '../../page/basics/preview/preview';
-import { Open, NPM, Youtube } from '../shared';
-import { TimelineElementParameters } from '../../page/timeline/timeline-element/timeline-element';
+import { NPM, Open, Youtube } from '../shared';
 
 export const sdf2dTimelineElement: TimelineElementParameters = {
   title: `2D ray tracing`,

src/data/projects/towers.ts

@@ -1,9 +1,8 @@
+import { Image } from '../../page/basics/image/image';
+import { TimelineElementParameters } from '../../page/timeline/timeline-element/timeline-element';
 import towersJpeg from '../media/towers.png?format=jpg';
 import towersWebP from '../media/towers.png?format=webp';
-
-import { Image } from '../../page/basics/image/image';
-import { Open, GitHub } from '../shared';
-import { TimelineElementParameters } from '../../page/timeline/timeline-element/timeline-element';
+import { GitHub, Open } from '../shared';
 
 export const towersTimelineElement: TimelineElementParameters = {
   title: `Towers tracking app`,

src/page/background/background.html.ts

@@ -1,5 +1,5 @@
-import './background.scss';
 import { html } from '../../types/html';
+import './background.scss';
 
 export const generate = (): html => `
   <div id="background"></div>

src/page/background/background.ts

@@ -1,12 +1,10 @@
-import { PageElement } from '../page-element';
-import { generate } from './background.html';
-
 import { createElement } from '../../helper/create-element';
-import { sum } from '../../helper/sum';
 import { getHeight } from '../../helper/get-height';
-
 import { mix } from '../../helper/mix';
 import { Random } from '../../helper/random';
+import { sum } from '../../helper/sum';
+import { PageElement } from '../page-element';
+import { generate } from './background.html';
 
 export class PageBackground extends PageElement {
   private static readonly perspective = 5;

src/page/basics/image-anchor/image-anchor.html.ts

@@ -1,6 +1,6 @@
-import './image-anchor.scss';
 import { html } from '../../../types/html';
 import { url } from '../../../types/url';
+import './image-anchor.scss';
 
 export const generate = ({
   href,

src/page/basics/image-anchor/image-anchor.ts

@@ -1,6 +1,6 @@
-import { PageElement } from '../../page-element';
 import { createElement } from '../../../helper/create-element';
 import { url } from '../../../types/url';
+import { PageElement } from '../../page-element';
 import { generate } from './image-anchor.html';
 
 export const ImageAnchorFactory = (

src/page/basics/image/image.html.ts

@@ -1,7 +1,7 @@
-import './image.scss';
 import { last } from '../../../helper/last';
-import { ResponsiveImage } from '../../../types/responsive-image';
 import { html } from '../../../types/html';
+import { ResponsiveImage } from '../../../types/responsive-image';
+import './image.scss';
 
 export const generate = ({
   sizes,

src/page/basics/image/image.ts

@@ -1,8 +1,8 @@
-import { PageElement } from '../../page-element';
 import { createElement } from '../../../helper/create-element';
-import { generate } from './image.html';
 import { last } from '../../../helper/last';
 import { ResponsiveImage } from '../../../types/responsive-image';
+import { PageElement } from '../../page-element';
+import { generate } from './image.html';
 
 export class Image extends PageElement {
   private static readonly imageScreenRatio = 0.8;

src/page/basics/preview/preview.html.ts

@@ -1,7 +1,7 @@
-import './preview.scss';
-import play from '../../../../static/icons/play-button.svg';
 import loading from '../../../../static/icons/loading.svg';
+import play from '../../../../static/icons/play-button.svg';
 import { html } from '../../../types/html';
+import './preview.scss';
 
 export const generate = ({ alt }: { alt: string }): html => `
   <div class="preview">

src/page/basics/preview/preview.ts

@@ -1,8 +1,8 @@
-import { PageElement } from '../../page-element';
 import { createElement } from '../../../helper/create-element';
-import { generate } from './preview.html';
-import { Image } from '../image/image';
 import { ResponsiveImage } from '../../../types/responsive-image';
+import { PageElement } from '../../page-element';
+import { Image } from '../image/image';
+import { generate } from './preview.html';
 
 export class Preview extends PageElement {
   public constructor(

src/page/basics/video/video.html.ts

@@ -1,10 +1,8 @@
-import './video.scss';
-
 import loading from '../../../../static/icons/loading.svg';
-
-import { html } from '../../../types/html';
 import play from '../../../../static/icons/play-button.svg';
+import { html } from '../../../types/html';
 import { VideoParameters } from './video';
+import './video.scss';
 
 export const generate = ({
   webm,

src/page/basics/video/video.ts

@@ -1,9 +1,9 @@
-import { PageElement } from '../../page-element';
 import { createElement } from '../../../helper/create-element';
-import { generate } from './video.html';
-import { Image } from '../image/image';
-import { url } from '../../../types/url';
 import { ResponsiveImage } from '../../../types/responsive-image';
+import { url } from '../../../types/url';
+import { PageElement } from '../../page-element';
+import { Image } from '../image/image';
+import { generate } from './video.html';
 
 export interface VideoParameters {
   mp4: url;

src/page/content/content.html.ts

@@ -1,5 +1,5 @@
-import './content.scss';
 import { html } from '../../types/html';
+import './content.scss';
 
 export const generate = (): html => `
     <div class="content"></div>

src/page/footer/footer.html.ts

@@ -1,9 +1,9 @@
-import './footer.scss';
 import cvIcon from '../../../static/icons/cv.svg';
 import emailIcon from '../../../static/icons/email.svg';
 import linkedinIcon from '../../../static/icons/linkedin.svg';
 import { html } from '../../types/html';
 import { FooterParameters } from './footer';
+import './footer.scss';
 
 export const generate = ({
   title,

src/page/footer/footer.ts

@@ -1,7 +1,7 @@
-import { PageElement } from '../page-element';
-import { generate } from './footer.html';
 import { createElement } from '../../helper/create-element';
 import { url } from '../../types/url';
+import { PageElement } from '../page-element';
+import { generate } from './footer.html';
 
 export interface FooterParameters {
   title: string;

src/page/header/header.html.ts

@@ -1,6 +1,5 @@
-import './header.scss';
-
 import { html } from '../../types/html';
+import './header.scss';
 
 export const generate = (name: string): html => `
   <section id="about">

src/page/header/header.ts

@@ -1,10 +1,9 @@
-import { PageContent } from '../content/content';
-
-import { generate } from './header.html';
 import { createElement } from '../../helper/create-element';
-import { PageThemeSwitcher } from '../theme-switcher/theme-switcher';
-import { PageElement } from '../page-element';
 import { Image } from '../basics/image/image';
+import { PageContent } from '../content/content';
+import { PageElement } from '../page-element';
+import { PageThemeSwitcher } from '../theme-switcher/theme-switcher';
+import { generate } from './header.html';
 
 export class PageHeader extends PageElement {
   public constructor(header: { name: string; photo: Image; about: Array<string> }) {

src/page/image-viewer/image-viewer.html.ts

@@ -1,7 +1,6 @@
 import cancel from '../../../static/icons/cancel.svg';
-
-import './image-viewer.scss';
 import { html } from '../../types/html';
+import './image-viewer.scss';
 
 export const generate = (): html => `
   <section id="image-viewer">

src/page/main/main.html.ts

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

src/page/main/main.ts

@@ -1,6 +1,6 @@
+import { createElement } from '../../helper/create-element';
 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>) {

src/page/page-element.ts

@@ -5,7 +5,7 @@ export abstract class PageElement {
   ) {}
 
   // eslint-disable-next-line @typescript-eslint/no-unused-vars
-  protected setParent(parent?: PageElement): void {
+  protected setParent(parent?: PageElement | null): void {
     this.children.forEach((c) => c.setParent(this));
   }
 

src/page/theme-switcher/theme-switcher.html.ts

@@ -1,5 +1,5 @@
-import './theme-switcher.scss';
 import { html } from '../../types/html';
+import './theme-switcher.scss';
 
 export const generate = (): html => `
   <input id="theme-switcher" aria-label="color-theme-switch" type="checkbox" name="switch-theme"/>

src/page/theme-switcher/theme-switcher.ts

@@ -1,12 +1,12 @@
-import { PageElement } from '../page-element';
 import { createElement } from '../../helper/create-element';
-import { generate } from './theme-switcher.html';
+import { turnOffAnimations, turnOnAnimations } from '../../style/animations/animations';
 import {
   isSystemLevelDarkModeEnabled,
   turnOnDarkMode,
   turnOnLightMode,
 } from '../../style/dark-mode/dark-mode';
-import { turnOffAnimations, turnOnAnimations } from '../../style/animations/animations';
+import { PageElement } from '../page-element';
+import { generate } from './theme-switcher.html';
 
 export class PageThemeSwitcher extends PageElement {
   private static readonly localStorageKey = 'dark-mode';

src/page/timeline/timeline-element/timeline-element.html.ts

@@ -1,8 +1,8 @@
 import info from '../../../../static/icons/info.svg';
-import './timeline-element.scss';
+import { titleToFragment } from '../../../helper/title-to-fragment';
 import { html } from '../../../types/html';
 import { TimelineElementParameters } from './timeline-element';
-import { titleToFragment } from '../../../helper/title-to-fragment';
+import './timeline-element.scss';
 
 export const generate = (
   { date, title, description, more }: TimelineElementParameters,

src/page/timeline/timeline-element/timeline-element.ts

@@ -1,10 +1,10 @@
+import { createElement } from '../../../helper/create-element';
+import { Image } from '../../basics/image/image';
+import { Preview } from '../../basics/preview/preview';
+import { Video } from '../../basics/video/video';
 import { PageContent } from '../../content/content';
 import { PageElement } from '../../page-element';
 import { generate } from './timeline-element.html';
-import { createElement } from '../../../helper/create-element';
-import { Video } from '../../basics/video/video';
-import { Image } from '../../basics/image/image';
-import { Preview } from '../../basics/preview/preview';
 
 export interface TimelineElementParameters {
   date: string;

src/page/timeline/timeline.html.ts

@@ -1,5 +1,5 @@
-import './timeline.scss';
 import { html } from '../../types/html';
+import './timeline.scss';
 
 export const generate = (): html => `
   <div id="timeline"></div>

src/page/timeline/timeline.ts

@@ -1,10 +1,10 @@
+import { createElement } from '../../helper/create-element';
+import { PageElement } from '../page-element';
 import {
   PageTimelineElement,
   TimelineElementParameters,
 } from './timeline-element/timeline-element';
 import { generate } from './timeline.html';
-import { createElement } from '../../helper/create-element';
-import { PageElement } from '../page-element';
 
 export class PageTimeline extends PageElement {
   public constructor({