diff --git a/public/.well-known/matrix/client b/public/.well-known/matrix/client new file mode 100644 index 0000000..2a5154e --- /dev/null +++ b/public/.well-known/matrix/client @@ -0,0 +1,8 @@ +{ + "m.homeserver": { + "base_url": "https://matrix.henryhiles.com", + "org.matrix.msc3575.proxy": { + "url": "https://matrix.henryhiles.com" + } + } +} diff --git a/public/.well-known/matrix/server b/public/.well-known/matrix/server new file mode 100644 index 0000000..3e6ac2a --- /dev/null +++ b/public/.well-known/matrix/server @@ -0,0 +1,3 @@ +{ + "m.server": "matrix.henryhiles.com:443" +} diff --git a/public/.well-known/matrix/support b/public/.well-known/matrix/support new file mode 100644 index 0000000..7f0d927 --- /dev/null +++ b/public/.well-known/matrix/support @@ -0,0 +1,9 @@ +{ + "contacts": [ + { + "matrix_id": "@quadradical:henryhiles.com", + "email_address": "henry@henryhiles.com", + "role": "m.role.admin" + } + ] +} diff --git a/src/components/BottomBar.astro b/src/components/BottomBar.astro index 4c877ed..de5bf0a 100644 --- a/src/components/BottomBar.astro +++ b/src/components/BottomBar.astro @@ -24,11 +24,10 @@ const sections: Array = [ diff --git a/src/layouts/Layout.astro b/src/layouts/Layout.astro index ad57178..251cc07 100644 --- a/src/layouts/Layout.astro +++ b/src/layouts/Layout.astro @@ -1,12 +1,17 @@ --- import "mdui/mdui.css" import TopBar from "../components/TopBar.astro" -import BottomBar from "../components/BottomBar.astro" import "../styles/global.css" + +interface Props { + title: string +} + +const { title } = Astro.props --- - + @@ -16,12 +21,12 @@ import "../styles/global.css" rel="stylesheet" /> - Henry Hiles - Home + Henry Hiles - {title}
- + diff --git a/src/pages/404.astro b/src/pages/404.astro new file mode 100644 index 0000000..c41cc22 --- /dev/null +++ b/src/pages/404.astro @@ -0,0 +1,18 @@ +--- +import Layout from "../layouts/Layout.astro" +import "../styles/404.css" +--- + + + +
+

404 - Not Found

+ +

+ We couldn't find that page. Please return to our home page. +

+
+ + diff --git a/src/pages/index.astro b/src/pages/index.astro index a07fd6f..dccb22f 100644 --- a/src/pages/index.astro +++ b/src/pages/index.astro @@ -12,12 +12,13 @@ import helpdesk from "../images/projects/helpdesk.jpg" import googleCS from "../images/certificates/googleCS.png" import metaFrontEnd from "../images/certificates/metaFrontEnd.png" import ButtonLink from "../components/ButtonLink.astro" +import BottomBar from "../components/BottomBar.astro" --- - +
Henry Hiles - Multiplatform Flutter Developer and Front-End Web Developer + Multiplatform Flutter Developer & Front-End Web Developer
@@ -25,14 +26,23 @@ import ButtonLink from "../components/ButtonLink.astro"

- Hello, my name is Henry Hiles, a developer specializing in - Flutter, Astro, TypeScript, and Node.js. I build - high-performance, intuitive applications with clean, - efficient code and modern design principles. Always eager to - learn, I’ve earned certifications from Microsoft, Google, - and Meta in cloud computing, AI, and cybersecurity. Whether - I'm optimizing mobile apps or designing websites, I’m - passionate about delivering innovative digital solutions. + Hello, I'm Henry Hiles, a developer specialising in Flutter + and Web development. I'm proficient with Dart, Astro, + Node.JS, and TypeScript. +

+

+ I build high-performance, intuitive applications with clean, + efficient code and modern design principles. +

+

+ Always eager to learn, I’ve earned certifications from + Microsoft, Google, and Meta in cloud computing, AI, and + cybersecurity. +

+

+ Whether I'm optimising mobile apps or designing websites, + I’m passionate about delivering innovative digital + solutions.

@@ -69,7 +79,7 @@ import ButtonLink from "../components/ButtonLink.astro"

The new Quantarc website

I developed the new website for Quantarc, a - UK firm that specializes in providing + UK firm that specialises in providing management solutions to both private and public entities.

@@ -97,7 +107,7 @@ import ButtonLink from "../components/ButtonLink.astro" development.

-
+ diff --git a/src/styles/404.css b/src/styles/404.css new file mode 100644 index 0000000..d63aa23 --- /dev/null +++ b/src/styles/404.css @@ -0,0 +1,5 @@ +body { + display: flex; + justify-content: center; + align-items: center; +} diff --git a/src/styles/button.css b/src/styles/button.css index b1bc2cc..4f1fd1b 100644 --- a/src/styles/button.css +++ b/src/styles/button.css @@ -3,7 +3,7 @@ button, display: flex; justify-content: center; align-items: center; - gap: 0.3em; + gap: 0.6em; border: 2px solid rgb(var(--primary)); color: white; border-radius: 50px; diff --git a/src/styles/global.css b/src/styles/global.css index acf1edd..8d451cc 100644 --- a/src/styles/global.css +++ b/src/styles/global.css @@ -31,7 +31,7 @@ body { margin: 0; background: radial-gradient( - circle 75vw at -25vw -20vh, + circle 80vw at -25vw -20vh, var(--circle-color), transparent ), @@ -43,7 +43,7 @@ body { } mdui-navigation-bar { - background: transparent; + background: rgba(0, 0, 0, 60%); backdrop-filter: blur(5px); } @@ -54,6 +54,30 @@ main { gap: 2em; padding: 1em; + + & > * > section { + display: flex; + flex-direction: column; + scroll-margin-top: 1em; + + & div, + mdui-card { + display: flex; + justify-content: center; + gap: 1em; + } + + gap: 0.5em; + padding: 1em 2em; + + & h2 { + font-size: 2em; + } + + & p { + font-size: 1.3em; + } + } } mdui-divider { diff --git a/src/styles/index.css b/src/styles/index.css index a570a07..3390273 100644 --- a/src/styles/index.css +++ b/src/styles/index.css @@ -23,31 +23,14 @@ mdui-card { } main > * > section { - display: flex; - flex-direction: column; - - & div, - mdui-card { - display: flex; - justify-content: center; - gap: 1em; - } - - gap: 0.5em; - padding: 1em 2em; - - & h2 { - font-size: 2em; - } - - & p { - font-size: 1.3em; - } - &#certificates mdui-card { padding: 1em; flex-wrap: wrap; + @media (max-width: 500px) { + border: none; + } + & a { min-width: 150px; width: 15%; @@ -59,6 +42,14 @@ main > * > section { flex-direction: column; gap: 1em; & mdui-card { + @media (max-width: 500px) { + border: none; + + & section { + padding: 0; + } + } + & section { margin: 1em; padding: 1em; @@ -84,20 +75,16 @@ main > * > section { & img { border-radius: var(--mdui-shape-corner-medium); border: 2px solid rgb(var(--primary)); + + .double > & { + width: 45%; + } } } :nth-child(2) > & { flex-direction: row-reverse; } } - - @media (max-width: 500px) { - border: none; - - & section { - padding: 0; - } - } } } @@ -108,4 +95,8 @@ main > * > section { min-width: 300px; } } + + @media (max-width: 1500px) { + scroll-margin-top: 5em; + } } diff --git a/src/styles/topBar.css b/src/styles/topBar.css index 6b684eb..4b5184a 100644 --- a/src/styles/topBar.css +++ b/src/styles/topBar.css @@ -6,6 +6,7 @@ mdui-top-app-bar { box-shadow: none; @media (max-width: 1500px) { + background: rgba(0, 0, 0, 60%); backdrop-filter: blur(5px); }