diff --git a/.idea/workspace.xml b/.idea/workspace.xml
index 3483d2c..106d824 100644
--- a/.idea/workspace.xml
+++ b/.idea/workspace.xml
@@ -5,12 +5,16 @@
+
-
-
-
+
+
-
+
+
+
+
+
@@ -112,6 +116,7 @@
+
diff --git a/package.json b/package.json
index b37d537..d52eb66 100644
--- a/package.json
+++ b/package.json
@@ -28,10 +28,7 @@
}
},
"browserslist": [
- "last 2 version",
- "not dead",
- "iOS >= 9",
- "> 0.2%"
+ "defaults"
],
"homepage": "https://github.com/schmelczerandras/timeline#readme",
"devDependencies": {
@@ -39,6 +36,7 @@
"clean-webpack-plugin": "^3.0.0",
"css-loader": "^3.4.0",
"file-loader": "^5.0.2",
+ "html-webpack-inline-source-plugin": "0.0.10",
"html-webpack-plugin": "^3.2.0",
"image-webpack-loader": "^6.0.0",
"mini-css-extract-plugin": "^0.9.0",
@@ -57,6 +55,7 @@
"typescript": "^3.7.3",
"webpack": "^4.41.4",
"webpack-cli": "^3.3.10",
- "webpack-dev-server": "^3.10.1"
+ "webpack-dev-server": "^3.10.1",
+ "workbox-webpack-plugin": "^4.3.1"
}
}
diff --git a/src/framework/helper.ts b/src/framework/helper.ts
index 194d701..d9664d8 100644
--- a/src/framework/helper.ts
+++ b/src/framework/helper.ts
@@ -92,4 +92,7 @@ export const range = ({
export const last = (list: Array): T =>
list.length > 0 ? list[list.length - 1] : undefined;
-export const isChrome = (): boolean => !!navigator.appVersion.match(/chrome/i);
+export const isChrome = (): boolean =>
+ !!navigator.appVersion.match(/chrome/i) &&
+ // @ts-ignore
+ window.webkitRequestFileSystem !== undefined;
diff --git a/src/framework/page.ts b/src/framework/page.ts
index f70a3ca..0ac18bb 100644
--- a/src/framework/page.ts
+++ b/src/framework/page.ts
@@ -16,7 +16,10 @@ export class Page extends PageElement {
);
}
- rootElement.append(...children.map(e => e.getElement()).filter(e => e));
+ children
+ .map(e => e.getElement())
+ .filter(e => e)
+ .forEach(e => rootElement.appendChild(e));
if (isRootPage) {
this.broadcastEvent({ type: PageEventType.onLoad }, this);
diff --git a/src/index.html b/src/index.html
index 163a888..c746dca 100644
--- a/src/index.html
+++ b/src/index.html
@@ -11,7 +11,7 @@
-
+
Portfolio - András Schmelczer
diff --git a/src/model/content.ts b/src/model/content.ts
index eca9afd..a1fd3bb 100644
--- a/src/model/content.ts
+++ b/src/model/content.ts
@@ -1,10 +1,10 @@
import { ResponsiveImage, url } from "./misc";
-interface Anchor {
+export type Anchor = {
type: "a";
href: url;
text: string;
-}
+};
export type Video = {
type: "video";
diff --git a/src/model/portfolio.ts b/src/model/portfolio.ts
index 1b93c3a..4705d83 100644
--- a/src/model/portfolio.ts
+++ b/src/model/portfolio.ts
@@ -1,5 +1,5 @@
import { url } from "./misc";
-import { Content, Image, Video } from "./content";
+import { Anchor, Content, Image, Video } from "./content";
export interface Portfolio {
config: Config;
@@ -25,7 +25,7 @@ export interface TimelineElement {
figure: Image | Video;
description: string;
more?: Content;
- link?: url;
+ link?: Anchor;
}
export interface Footer {
diff --git a/src/page/background/background.ts b/src/page/background/background.ts
index 4b7ce6c..1184424 100644
--- a/src/page/background/background.ts
+++ b/src/page/background/background.ts
@@ -32,7 +32,6 @@ export class PageBackground extends PageElement {
protected handleEvent(event: PageEvent, parent: PageElement) {
if (event.type === PageEventType.onLoad) {
this.bindListeners(parent);
- this.resize(parent);
} else if (event.type === PageEventType.onBodyDimensionsChanged) {
this.resize(parent, event.data?.deltaHeight);
}
diff --git a/src/page/footer/footer.scss b/src/page/footer/footer.scss
index 5db0fc4..109ff63 100644
--- a/src/page/footer/footer.scss
+++ b/src/page/footer/footer.scss
@@ -43,7 +43,7 @@ footer#page-footer {
h6 {
@include insignificant-font();
- opacity: 0.6;
+ opacity: 0.75;
}
}
}
diff --git a/src/page/timeline/timeline-element/timeline-element.html.ts b/src/page/timeline/timeline-element/timeline-element.html.ts
index 688a737..6bbb223 100644
--- a/src/page/timeline/timeline-element/timeline-element.html.ts
+++ b/src/page/timeline/timeline-element/timeline-element.html.ts
@@ -28,12 +28,7 @@ export const generate = (
`
: ""
}
- ${
- link
- ? `
- ${link}`
- : ""
- }
+ ${link ? PageContent.parseTypedContent(link) : ""}
`;
diff --git a/src/page/timeline/timeline.ts b/src/page/timeline/timeline.ts
index 82123b2..1b9594d 100644
--- a/src/page/timeline/timeline.ts
+++ b/src/page/timeline/timeline.ts
@@ -14,7 +14,7 @@ export class PageTimeline extends PageElement {
const elements = timeline.map(
e => new PageTimelineElement(e, showMore, showLess)
);
- root.append(...elements.map(e => e.getElement()));
+ elements.map(e => e.getElement()).forEach(e => root.appendChild(e));
super(elements);
this.setElement(root);
}
diff --git a/src/portfolio.ts b/src/portfolio.ts
index 421d733..0a9b419 100644
--- a/src/portfolio.ts
+++ b/src/portfolio.ts
@@ -177,7 +177,7 @@ export const portfolio: Portfolio = {
alt: `a picture of the website`
},
description: `A simple web page where you can view my photos.`,
- link: `schmelczer.dev/photos`
+ link: { type: `a`, href: `photos`, text: `schmelczer.dev/photos` }
},
{
date: `2016 spring`,
@@ -203,7 +203,7 @@ export const portfolio: Portfolio = {
footer: {
title: `Learn more`,
cv,
- email: `andras@schmelczer.dev`,
+ email: `schmelczerandras@gmail.com`,
cvName: `Curriculum vitae`,
lastEditName: `Last modified on `,
lastEdit: new Date(2019, 11, 29) // months are 0 indexed
diff --git a/src/styles.scss b/src/styles.scss
index 93ac0fc..fc20af0 100644
--- a/src/styles.scss
+++ b/src/styles.scss
@@ -27,6 +27,8 @@ html {
body {
@include main-font();
height: 100%;
+ padding: env(safe-area-inset-top, 20px) env(safe-area-inset-right, 20px)
+ env(safe-area-inset-bottom, 20px) env(safe-area-inset-left, 20px);
& > main {
height: 100%;
diff --git a/webpack.config.js b/webpack.config.js
index 39563cc..e98696f 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -4,6 +4,7 @@ const { CleanWebpackPlugin } = require("clean-webpack-plugin");
const TerserJSPlugin = require("terser-webpack-plugin");
const OptimizeCSSAssetsPlugin = require("optimize-css-assets-webpack-plugin");
const MiniCssExtractPlugin = require("mini-css-extract-plugin");
+const HtmlWebpackInlineSourcePlugin = require("html-webpack-inline-source-plugin");
const isProduction = process.env.NODE_ENV === "production";
@@ -20,11 +21,12 @@ module.exports = {
plugins: [
new CleanWebpackPlugin(),
new HtmlWebpackPlugin({
- hash: true,
xhtml: true,
minify: true,
- template: "./src/index.html"
+ template: "./src/index.html",
+ inlineSource: ".(js|css)$"
}),
+ new HtmlWebpackInlineSourcePlugin(),
new MiniCssExtractPlugin({
filename: "[name].[contenthash].css",
chunkFilename: "[id].[contenthash].css"