diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte index 8df4937..9cc3a3b 100644 --- a/src/routes/+layout.svelte +++ b/src/routes/+layout.svelte @@ -2,19 +2,25 @@ import '$lib/styles/global.scss'; import Header from '$lib/components/Header.svelte'; import Loader from '$lib/components/Loader.svelte'; - import { navigating } from '$app/stores'; + import { navigating, page } from '$app/stores'; export let data; - + + + + + + + {$page.data.title ? $page.data.title : 'Simon Flöter, Designer and Creative Developer'} + +
- {#key data.pathname} -
+{#key data.pathname} +
{#if $navigating} {/if} - -
- {/key} \ No newline at end of file + +
+{/key} \ No newline at end of file diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte index a702706..aee2189 100644 --- a/src/routes/+page.svelte +++ b/src/routes/+page.svelte @@ -13,9 +13,10 @@ let canvasElems: Array; let imgElems: Array; let mounted = false; + let currentMonth: string; onMount( () => { - + currentMonth = new Date().toLocaleString('en-UK', { month: 'long', year: 'numeric' }); mounted = true; gsap.registerPlugin( ScrollTrigger, ScrollToPlugin, SplitText ); @@ -84,6 +85,7 @@ }) }) + return () => { gsap.killTweensOf(canvasElems); ScrollTrigger.getAll().forEach( instance => instance.kill() ); @@ -91,6 +93,7 @@ }); + {#if !mounted} {/if} @@ -98,9 +101,6 @@

I create digital experiences that stand out from the rest.

-
-

My name is Simon, I help my clients reach their audiences using my skills:

-
@@ -124,9 +124,12 @@
-

I work as a free agent. You can hire me for your noble enterprise.

+

I am currently available for freelance work.

+ {#if mounted} +
(as of { currentMonth })
+ {/if}
@@ -167,20 +170,15 @@ justify-content: start; min-height: 100svh; justify-content: center; - margin-bottom: -1em; max-width: 100%; padding: var(--spacing-outer); @media screen and (orientation: landscape) { - padding: var(--spacing-outer) calc(var(--spacing-outer) * 2); - } - } - .introduction { - h2 { - font-size: 1.53em; - letter-spacing: -0.033em; - margin-bottom: 0; - line-height: .9; + padding: 0 calc(var(--spacing-outer) * 2); + + & h1 { + margin: -.5em 0 0 0; + } } } .dev-image { @@ -224,11 +222,18 @@ font-size: 8vw; margin-bottom: 0.5em; margin-top: 0; + padding: 0 .25em; } } + .hireme-date { + font-size: .66em; + text-align: center; + letter-spacing: -0.02em; + } h2 { font-size: 12vw; line-height: .9; + letter-spacing: -0.033em; margin: 0 0 0.5em 0; -webkit-touch-callout: none; /* Safari */ -webkit-user-select: none; /* Chrome */ @@ -236,7 +241,7 @@ -ms-user-select: none; /* Internet Explorer/Edge */ user-select: none; @media screen and (orientation: landscape) { - font-size: 8vw; + font-size: 6.66vw; margin: 0; } & > em { @@ -249,7 +254,6 @@ line-height: .85; font-size: 14.75vw; letter-spacing: -0.05em; - margin-top: -.5em; color: var(--color-highlight); -webkit-touch-callout: none; /* Safari */ -webkit-user-select: none; /* Chrome */ @@ -258,7 +262,8 @@ user-select: none; @media screen and (orientation: landscape) { - font-size: 11vw; + font-size: 10vw; + padding: 0 1em; } & > em { font-style: normal; diff --git a/src/routes/+page.ts b/src/routes/+page.ts new file mode 100644 index 0000000..ea1222f --- /dev/null +++ b/src/routes/+page.ts @@ -0,0 +1,7 @@ +export const prerender = true +export function load() { + return { + title: 'Simon Flöter, creative developer and designer', + description: 'Simon Flöter is a creative developer and designer you can hire as a freelancer' + } +} \ No newline at end of file diff --git a/src/routes/about/+page.svelte b/src/routes/about/+page.svelte deleted file mode 100644 index 6b321f6..0000000 --- a/src/routes/about/+page.svelte +++ /dev/null @@ -1,53 +0,0 @@ - - -
-

Hello world

-

Is this the text you're looking for?

-
- - - - \ No newline at end of file diff --git a/src/routes/about/about.scss b/src/routes/about/about.scss deleted file mode 100644 index c44453d..0000000 --- a/src/routes/about/about.scss +++ /dev/null @@ -1,10 +0,0 @@ -article { - padding: var(--spacing-outer); -} -canvas { - position: fixed; - top: 0; - left: 0; - width: 100%; - height: 100%; -} \ No newline at end of file diff --git a/src/routes/blog/+page.server.ts b/src/routes/blog/+page.server.ts deleted file mode 100644 index 9c517ed..0000000 --- a/src/routes/blog/+page.server.ts +++ /dev/null @@ -1,12 +0,0 @@ -import { error } from '@sveltejs/kit'; - -export function load({ params }) { - - const posts = fetch('https://uncommonbio.co/wp-json/wp/v2/pages/').then((r) => r.json().catch((err) => {console.log(err, params)})); - - if (!posts) throw error(404); - - return { - posts - }; -} diff --git a/src/routes/blog/+page.svelte b/src/routes/blog/+page.svelte deleted file mode 100644 index 1b29001..0000000 --- a/src/routes/blog/+page.svelte +++ /dev/null @@ -1,10 +0,0 @@ - - -

Blog roll!

- -{#each posts as post} -

{post.title.rendered}

-{/each} \ No newline at end of file diff --git a/src/routes/blog/[slug]/+page.server.ts b/src/routes/blog/[slug]/+page.server.ts deleted file mode 100644 index 48f3d07..0000000 --- a/src/routes/blog/[slug]/+page.server.ts +++ /dev/null @@ -1,12 +0,0 @@ -import { error } from '@sveltejs/kit'; - -export function load({ params }) { - - const posts = fetch('https://uncommonbio.co/wp-json/wp/v2/posts/').then((r) => r.json().catch((err) => {console.log(err, params)})); - - if (!posts) throw error(404); - - return { - posts - }; -} diff --git a/src/routes/blog/[slug]/+page.svelte b/src/routes/blog/[slug]/+page.svelte deleted file mode 100644 index 057cfec..0000000 --- a/src/routes/blog/[slug]/+page.svelte +++ /dev/null @@ -1,8 +0,0 @@ - - -

Blog post

-

{@html dataone}

\ No newline at end of file diff --git a/src/routes/contact/+page.svelte b/src/routes/contact/+page.svelte index ad2e5ac..bf7d998 100644 --- a/src/routes/contact/+page.svelte +++ b/src/routes/contact/+page.svelte @@ -124,12 +124,6 @@ margin: 1em var(--spacing-outer) .75em var(--spacing-outer); font-size: 4.5em; } - - & em { - font-style: normal; - font-weight: 400; - color: var(--color-highlight); - } } .intro { width: 100%; diff --git a/src/routes/contact/+page.ts b/src/routes/contact/+page.ts index 05d87e2..ac85e0b 100644 --- a/src/routes/contact/+page.ts +++ b/src/routes/contact/+page.ts @@ -1 +1,7 @@ -export const prerender = true \ No newline at end of file +export const prerender = true +export function load() { + return { + title: 'Contact me!', + description: 'Reach out via a contact form, email or LinkedIn' + }; +} \ No newline at end of file diff --git a/src/routes/service/+page.svelte b/src/routes/service/+page.svelte index 68fee0c..adea36e 100644 --- a/src/routes/service/+page.svelte +++ b/src/routes/service/+page.svelte @@ -6,6 +6,8 @@ import Faq from '$lib/components/Faq.svelte'; import ServiceCanvas from './ServiceCanvas.svelte'; + export let data; + onMount( () => { gsap.registerPlugin( ScrollTrigger, SplitText ); diff --git a/src/routes/service/+page.ts b/src/routes/service/+page.ts new file mode 100644 index 0000000..fbff7b6 --- /dev/null +++ b/src/routes/service/+page.ts @@ -0,0 +1,6 @@ +export function load() { + return { + title: 'Services I provide', + description: 'A list of profesional webdevelopment and design services I provide' + }; +} \ No newline at end of file diff --git a/src/routes/work/+page.server.ts b/src/routes/work/+page.server.ts index ff45654..e1929c7 100644 --- a/src/routes/work/+page.server.ts +++ b/src/routes/work/+page.server.ts @@ -5,6 +5,8 @@ export async function load() { if (!posts) console.error('No posts found') return { - posts + posts, + title: 'Work References', + description: 'A few of the projects I have worked on' } } diff --git a/static/ogimage.png b/static/ogimage.png new file mode 100644 index 0000000..58cd9cd Binary files /dev/null and b/static/ogimage.png differ