From df2de7fd6a64d5a2dc9618d19f7e68a7ceef091a Mon Sep 17 00:00:00 2001 From: Chris Swithinbank Date: Wed, 28 Dec 2022 23:01:56 +0100 Subject: [PATCH 001/107] Rename `/projects/` to `/work/` --- examples/portfolio/src/layouts/project.astro | 2 +- examples/portfolio/src/pages/index.astro | 4 ++-- examples/portfolio/src/pages/{projects.astro => work.astro} | 6 +++--- .../portfolio/src/pages/{project => work}/mars-rover.md | 0 .../src/pages/{project => work}/nested/lunar-eclipse.md | 0 5 files changed, 6 insertions(+), 6 deletions(-) rename examples/portfolio/src/pages/{projects.astro => work.astro} (85%) rename examples/portfolio/src/pages/{project => work}/mars-rover.md (100%) rename examples/portfolio/src/pages/{project => work}/nested/lunar-eclipse.md (100%) diff --git a/examples/portfolio/src/layouts/project.astro b/examples/portfolio/src/layouts/project.astro index c4025dc39624..2155d223733b 100644 --- a/examples/portfolio/src/layouts/project.astro +++ b/examples/portfolio/src/layouts/project.astro @@ -100,7 +100,7 @@ const { content } = Astro.props;
From a3a39232067e4a50a9b479b7867b3e403a5dc55b Mon Sep 17 00:00:00 2001 From: Chris Swithinbank Date: Mon, 2 Jan 2023 01:27:39 +0100 Subject: [PATCH 031/107] Create banner with contact CTA --- .../portfolio/src/components/ContactCTA.astro | 45 +++++++++++++++++++ 1 file changed, 45 insertions(+) create mode 100644 examples/portfolio/src/components/ContactCTA.astro diff --git a/examples/portfolio/src/components/ContactCTA.astro b/examples/portfolio/src/components/ContactCTA.astro new file mode 100644 index 000000000000..fcedad237013 --- /dev/null +++ b/examples/portfolio/src/components/ContactCTA.astro @@ -0,0 +1,45 @@ +--- +import CallToAction from './CallToAction.astro'; +import Icon from './Icon.astro'; +--- + +
+

Interested in working together?

+ + Send Me a Message + + +
+ + From ae981a1c3d33efaeb659d08badd388a48a884cc6 Mon Sep 17 00:00:00 2001 From: Chris Swithinbank Date: Mon, 2 Jan 2023 01:30:10 +0100 Subject: [PATCH 032/107] Create Skills highlight component for landing page --- .../portfolio/src/components/Skills.astro | 62 +++++++++++++++++++ 1 file changed, 62 insertions(+) create mode 100644 examples/portfolio/src/components/Skills.astro diff --git a/examples/portfolio/src/components/Skills.astro b/examples/portfolio/src/components/Skills.astro new file mode 100644 index 000000000000..83936c0fff30 --- /dev/null +++ b/examples/portfolio/src/components/Skills.astro @@ -0,0 +1,62 @@ +--- +import Icon from './Icon.astro'; +--- + +
+
+ +

Full Stack

+

Some sorta real clever text here but im too tired to think of it now.

+
+
+ +

Industry Leader

+

Some sorta real clever text here but im too tired to think of it now.

+
+
+ +

Strategy-Minded

+

Some sorta real clever text here but im too tired to think of it now.

+
+
+ + From 77a86616dd1cc162256102a5fee892e212455f54 Mon Sep 17 00:00:00 2001 From: Chris Swithinbank Date: Mon, 2 Jan 2023 01:32:31 +0100 Subject: [PATCH 033/107] Add stack layout CSS utilities --- examples/portfolio/src/styles/global.css | 45 ++++++++++++++++++++++++ 1 file changed, 45 insertions(+) diff --git a/examples/portfolio/src/styles/global.css b/examples/portfolio/src/styles/global.css index 3baafc158f8d..5b0ae7682f32 100644 --- a/examples/portfolio/src/styles/global.css +++ b/examples/portfolio/src/styles/global.css @@ -210,3 +210,48 @@ h5 { margin-inline: auto; padding-inline: 1.5rem; } + +.stack { + display: flex; + flex-direction: column; +} + +.gap-2 { + gap: 0.5rem; +} +.gap-4 { + gap: 1rem; +} +.gap-8 { + gap: 2rem; +} +.gap-20 { + gap: 5rem; +} +.gap-30 { + gap: 7.5rem; +} +.gap-48 { + gap: 12rem; +} + +@media (min-width: 50em) { + .lg\:gap-2 { + gap: 0.5rem; + } + .lg\:gap-4 { + gap: 1rem; + } + .lg\:gap-8 { + gap: 2rem; + } + .lg\:gap-20 { + gap: 5rem; + } + .lg\:gap-30 { + gap: 7.5rem; + } + .lg\:gap-48 { + gap: 12rem; + } +} From 86ca8f779c8f0d83fa3a342ce71f963daafb7ef9 Mon Sep 17 00:00:00 2001 From: Chris Swithinbank Date: Mon, 2 Jan 2023 01:33:22 +0100 Subject: [PATCH 034/107] Fix missing gradient stops used in `` --- examples/portfolio/src/styles/global.css | 11 +++++++---- 1 file changed, 7 insertions(+), 4 deletions(-) diff --git a/examples/portfolio/src/styles/global.css b/examples/portfolio/src/styles/global.css index 5b0ae7682f32..44f0174e3d32 100644 --- a/examples/portfolio/src/styles/global.css +++ b/examples/portfolio/src/styles/global.css @@ -21,12 +21,15 @@ --accent-text-over: var(--gray-999); /* Gradients */ + --gradient-stop-1: var(--accent-light); + --gradient-stop-2: var(--accent-regular); + --gradient-stop-3: var(--accent-dark); --gradient-subtle: linear-gradient(150deg, var(--gray-900) 19%, var(--gray-999) 150%); --gradient-accent: linear-gradient( 150deg, - var(--accent-light), - var(--accent-regular), - var(--accent-dark) + var(--gradient-stop-1), + var(--gradient-stop-2), + var(--gradient-stop-3) ); --gradient-accent-orange: linear-gradient( 150deg, @@ -94,8 +97,8 @@ --accent-dark: #c561f6; --accent-text-over: var(--gray-0); + --gradient-stop-1: #4c11c6; --gradient-subtle: linear-gradient(150deg, var(--gray-900) 19%, var(--gray-999) 81%); - --gradient-accent: linear-gradient(150deg, #4c11c6, var(--accent-regular), var(--accent-dark)); --gradient-accent-orange: linear-gradient( 150deg, #ca7879, From e357f6da94e99734b50a82a79fc36e5124d16d18 Mon Sep 17 00:00:00 2001 From: Chris Swithinbank Date: Mon, 2 Jan 2023 12:09:46 +0100 Subject: [PATCH 035/107] Add mobile menu toggle --- examples/portfolio/src/components/Nav.astro | 195 +++++++++++++++----- 1 file changed, 152 insertions(+), 43 deletions(-) diff --git a/examples/portfolio/src/components/Nav.astro b/examples/portfolio/src/components/Nav.astro index d6642fe1f0dc..5cc52add51d4 100644 --- a/examples/portfolio/src/components/Nav.astro +++ b/examples/portfolio/src/components/Nav.astro @@ -11,12 +11,19 @@ const menu = [ + + From e425fd4561aa3d35311453d80e5ccedd8d3da7dd Mon Sep 17 00:00:00 2001 From: Chris Swithinbank Date: Mon, 2 Jan 2023 12:27:08 +0100 Subject: [PATCH 036/107] Create base layout --- .../portfolio/src/components/MainHead.astro | 6 +++++ .../portfolio/src/layouts/BaseLayout.astro | 27 +++++++++++++++++++ 2 files changed, 33 insertions(+) create mode 100644 examples/portfolio/src/layouts/BaseLayout.astro diff --git a/examples/portfolio/src/components/MainHead.astro b/examples/portfolio/src/components/MainHead.astro index e11eeffd4a41..9461a3ba7df4 100644 --- a/examples/portfolio/src/components/MainHead.astro +++ b/examples/portfolio/src/components/MainHead.astro @@ -1,5 +1,11 @@ --- import '../styles/global.css'; + +interface Props { + title?: string; + description?: string; +} + const { title = 'Jeanine White: Personal Site', description = 'The personal site of Jeanine White', diff --git a/examples/portfolio/src/layouts/BaseLayout.astro b/examples/portfolio/src/layouts/BaseLayout.astro new file mode 100644 index 000000000000..37cbe5cb0722 --- /dev/null +++ b/examples/portfolio/src/layouts/BaseLayout.astro @@ -0,0 +1,27 @@ +--- +// Learn about using Astro layouts: +// https://docs.astro.build/en/core-concepts/layouts/ + +// Component Imports +import MainHead from '../components/MainHead.astro'; +import Nav from '../components/Nav.astro'; +import Footer from '../components/Footer.astro'; + +interface Props { + title?: string; + description?: string; +} + +const { title, description } = Astro.props; +--- + + + + + + +