From 8cc51b601ece053cf2365507734dea9053fd4322 Mon Sep 17 00:00:00 2001 From: CAG2Mark Date: Mon, 6 May 2024 16:23:36 +0800 Subject: [PATCH] update content and improve font load times --- about.html | 4 +- content/fonts/inter.css | 102 +--------------------------------------- flychrono2.html | 11 +++-- flylivestudio.html | 4 +- index.html | 6 +-- projects.html | 6 +-- styles/global.css | 35 ++++++++++++++ 7 files changed, 53 insertions(+), 115 deletions(-) diff --git a/about.html b/about.html index af393e4..ce14839 100644 --- a/about.html +++ b/about.html @@ -8,8 +8,8 @@ About - Mark Ng - - + + diff --git a/content/fonts/inter.css b/content/fonts/inter.css index 66c7fb6..2c9e945 100644 --- a/content/fonts/inter.css +++ b/content/fonts/inter.css @@ -1,54 +1,3 @@ -@font-face { - font-family: 'Inter'; - font-style: normal; - font-weight: 100; - font-display: swap; - src: url("Inter-Thin.woff2?v=3.15") format("woff2"), - url("Inter-Thin.woff?v=3.15") format("woff"); -} -@font-face { - font-family: 'Inter'; - font-style: italic; - font-weight: 100; - font-display: swap; - src: url("Inter-ThinItalic.woff2?v=3.15") format("woff2"), - url("Inter-ThinItalic.woff?v=3.15") format("woff"); -} - -@font-face { - font-family: 'Inter'; - font-style: normal; - font-weight: 200; - font-display: swap; - src: url("Inter-ExtraLight.woff2?v=3.15") format("woff2"), - url("Inter-ExtraLight.woff?v=3.15") format("woff"); -} -@font-face { - font-family: 'Inter'; - font-style: italic; - font-weight: 200; - font-display: swap; - src: url("Inter-ExtraLightItalic.woff2?v=3.15") format("woff2"), - url("Inter-ExtraLightItalic.woff?v=3.15") format("woff"); -} - -@font-face { - font-family: 'Inter'; - font-style: normal; - font-weight: 300; - font-display: swap; - src: url("Inter-Light.woff2?v=3.15") format("woff2"), - url("Inter-Light.woff?v=3.15") format("woff"); -} -@font-face { - font-family: 'Inter'; - font-style: italic; - font-weight: 300; - font-display: swap; - src: url("Inter-LightItalic.woff2?v=3.15") format("woff2"), - url("Inter-LightItalic.woff?v=3.15") format("woff"); -} - @font-face { font-family: 'Inter'; font-style: normal; @@ -57,6 +6,7 @@ src: url("Inter-Regular.woff2?v=3.15") format("woff2"), url("Inter-Regular.woff?v=3.15") format("woff"); } + @font-face { font-family: 'Inter'; font-style: italic; @@ -66,23 +16,6 @@ url("Inter-Italic.woff?v=3.15") format("woff"); } -@font-face { - font-family: 'Inter'; - font-style: normal; - font-weight: 500; - font-display: swap; - src: url("Inter-Medium.woff2?v=3.15") format("woff2"), - url("Inter-Medium.woff?v=3.15") format("woff"); -} -@font-face { - font-family: 'Inter'; - font-style: italic; - font-weight: 500; - font-display: swap; - src: url("Inter-MediumItalic.woff2?v=3.15") format("woff2"), - url("Inter-MediumItalic.woff?v=3.15") format("woff"); -} - @font-face { font-family: 'Inter'; font-style: normal; @@ -91,14 +24,6 @@ src: url("Inter-SemiBold.woff2?v=3.15") format("woff2"), url("Inter-SemiBold.woff?v=3.15") format("woff"); } -@font-face { - font-family: 'Inter'; - font-style: italic; - font-weight: 600; - font-display: swap; - src: url("Inter-SemiBoldItalic.woff2?v=3.15") format("woff2"), - url("Inter-SemiBoldItalic.woff?v=3.15") format("woff"); -} @font-face { font-family: 'Inter'; @@ -108,31 +33,6 @@ src: url("Inter-Bold.woff2?v=3.15") format("woff2"), url("Inter-Bold.woff?v=3.15") format("woff"); } -@font-face { - font-family: 'Inter'; - font-style: italic; - font-weight: 700; - font-display: swap; - src: url("Inter-BoldItalic.woff2?v=3.15") format("woff2"), - url("Inter-BoldItalic.woff?v=3.15") format("woff"); -} - -@font-face { - font-family: 'Inter'; - font-style: normal; - font-weight: 800; - font-display: swap; - src: url("Inter-ExtraBold.woff2?v=3.15") format("woff2"), - url("Inter-ExtraBold.woff?v=3.15") format("woff"); -} -@font-face { - font-family: 'Inter'; - font-style: italic; - font-weight: 800; - font-display: swap; - src: url("Inter-ExtraBoldItalic.woff2?v=3.15") format("woff2"), - url("Inter-ExtraBoldItalic.woff?v=3.15") format("woff"); -} @font-face { font-family: 'Inter'; diff --git a/flychrono2.html b/flychrono2.html index 8d21da1..280e10e 100644 --- a/flychrono2.html +++ b/flychrono2.html @@ -8,8 +8,8 @@ About - Mark Ng - - + + @@ -83,15 +83,18 @@

FlyChrono v2

This does not sound glamorous, but before my original FlyChrono project, people had to buy another piece of software for $10 to do this. - FlyChrono put an end to this and made it accessible to everyone. + FlyChrono put an end to this and made it accessible to everyone, and is now open source.

The new version of FlyChrono included new features such as an improved UI, alarms, and more.

+

+ Source code +

- FlyLive Studio Screenshot + FlyChrono Screenshot
diff --git a/flylivestudio.html b/flylivestudio.html index ee1a77b..a755307 100644 --- a/flylivestudio.html +++ b/flylivestudio.html @@ -8,8 +8,8 @@ About - Mark Ng - - + + diff --git a/index.html b/index.html index 62dec8a..36e53ce 100644 --- a/index.html +++ b/index.html @@ -8,8 +8,8 @@ Portfolio of Mark Ng - - + + @@ -229,7 +229,7 @@

FlyLive Studio

FlyChrono v2

- FlyChrono v2 is a flight simulator time-syncing tool. It aims to + FlyChrono v2 is an open source flight simulator time-syncing tool. It aims to provide more and better features than existing paid solutions for free, while improving on my FlyChrono application.

diff --git a/projects.html b/projects.html index 2cc3f0c..114843c 100644 --- a/projects.html +++ b/projects.html @@ -8,8 +8,8 @@ Projects - Mark Ng - - + + @@ -133,7 +133,7 @@

FlyLive Studio

FlyChrono v2

- FlyChrono v2 is a flight simulator time-syncing tool. It aims to + FlyChrono v2 is an open source flight simulator time-syncing tool. It aims to provide more and better features than existing paid solutions for free, while improving on my FlyChrono application.

diff --git a/styles/global.css b/styles/global.css index 73ca069..7f09dcf 100644 --- a/styles/global.css +++ b/styles/global.css @@ -520,6 +520,41 @@ a.skip-main:focus, a.skip-main:active { transform: translateX(14px); } +p > a { + color: white; + border-radius: 6px; + background-color: #ffffff17; + + padding: 0 4px; + text-decoration: none; + + transition: background-color 250ms ease; +} + +p > a:hover { + background-color: #ffffff24; +} + +p > a::after { + content: '🡕'; + font-weight: normal; + font-style: normal; + letter-spacing: normal; + text-transform: none; + display: inline-block; + line-height: 1; + white-space: nowrap; + word-wrap: normal; + direction: ltr; + font-feature-settings: 'liga'; + -webkit-font-feature-settings: 'liga'; + -webkit-font-smoothing: antialiased; + vertical-align: middle; + margin-bottom: 1px; + margin-left: 3px; + color: #aaaaaa; +} + .indented-link:hover { background-color: #ffffff10; color: rgb(231, 231, 231);