diff --git a/package.json b/package.json index fcc05e5..49736bf 100644 --- a/package.json +++ b/package.json @@ -32,5 +32,9 @@ "typescript": "5.4.5", "vite": "5.2.11", "wrangler": "^3.57.2" + }, + "dependencies": { + "clsx": "^2.1.1", + "tailwind-merge": "^2.3.0" } } diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index b12ab8e..27d25d0 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -7,6 +7,13 @@ settings: importers: .: + dependencies: + clsx: + specifier: ^2.1.1 + version: 2.1.1 + tailwind-merge: + specifier: ^2.3.0 + version: 2.3.0 devDependencies: '@cloudflare/workers-types': specifier: ^4.20240524.0 @@ -79,6 +86,10 @@ packages: resolution: {integrity: sha512-30iZtAPgz+LTIYoeivqYo853f02jBYSd5uGnGpkFV0M3xOt9aN73erkgYAmZU43x4VfqcnLxW9Kpg3R5LC4YYw==} engines: {node: '>=6.0.0'} + '@babel/runtime@7.24.6': + resolution: {integrity: sha512-Ja18XcETdEl5mzzACGd+DKgaGJzPTCow7EglgwTmHdwokzDFYh/MHua6lU6DV/hjF2IaOJ4oX2nqnjG7RElKOw==} + engines: {node: '>=6.9.0'} + '@cloudflare/kv-asset-handler@0.3.2': resolution: {integrity: sha512-EeEjMobfuJrwoctj7FA1y1KEbM0+Q1xSjobIEyie9k4haVEBB7vkDvsasw1pM3rO39mL2akxIAzLMUAtrMHZhA==} engines: {node: '>=16.13'} @@ -784,6 +795,10 @@ packages: resolution: {integrity: sha512-7VT13fmjotKpGipCW9JEQAusEPE+Ei8nl6/g4FBAmIm0GOOLMua9NDDo/DWp0ZAxCr3cPq5ZpBqmPAQgDda2Pw==} engines: {node: '>= 8.10.0'} + clsx@2.1.1: + resolution: {integrity: sha512-eYm0QWBtUrBWZWG0d386OGAw16Z995PiOVo2B7bjWSbHedGl5e0ZWaq65kOGgUSNesEIDkB9ISbTg/JK9dhCZA==} + engines: {node: '>=6'} + color-convert@2.0.1: resolution: {integrity: sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==} engines: {node: '>=7.0.0'} @@ -1446,6 +1461,9 @@ packages: resolution: {integrity: sha512-hOS089on8RduqdbhvQ5Z37A0ESjsqz6qnRcffsMU3495FuTdqSm+7bhJ29JvIOsBDEEnan5DPu9t3To9VRlMzA==} engines: {node: '>=8.10.0'} + regenerator-runtime@0.14.1: + resolution: {integrity: sha512-dYnhHh0nJoMfnkZs6GmmhFknAGRrLznOu5nc9ML+EJxGvrx6H7teuevqVqCuPcPK//3eDrrjQhehXVx9cnkGdw==} + regexparam@3.0.0: resolution: {integrity: sha512-RSYAtP31mvYLkAHrOlh25pCNQ5hWnT106VukGaaFfuJrZFkGRX5GhUAdPqpSDXxOhA2c4akmRuplv1mRqnBn6Q==} engines: {node: '>=8'} @@ -1655,6 +1673,9 @@ packages: resolution: {integrity: sha512-zT74TUo0vOOrbxRfdlWXu+ac4O9lqPFG0YoZB3uOfrOewT1GKxKm0qwG/jo9bGvgZ++TSHjR7AtV091LY2FhBA==} engines: {node: '>=18'} + tailwind-merge@2.3.0: + resolution: {integrity: sha512-vkYrLpIP+lgR0tQCG6AP7zZXCTLc1Lnv/CCRT3BqJ9CZ3ui2++GPaGb1x/ILsINIMSYqqvrpqjUFsMNLlW99EA==} + tailwindcss@3.4.3: resolution: {integrity: sha512-U7sxQk/n397Bmx4JHbJx/iSOOv5G+II3f1kpLpY2QeUv5DcPdcTsYLlusZfq1NthHS1c1cZoyFmmkex1rzke0A==} engines: {node: '>=14.0.0'} @@ -1846,6 +1867,10 @@ snapshots: '@jridgewell/gen-mapping': 0.3.5 '@jridgewell/trace-mapping': 0.3.25 + '@babel/runtime@7.24.6': + dependencies: + regenerator-runtime: 0.14.1 + '@cloudflare/kv-asset-handler@0.3.2': dependencies: mime: 3.0.0 @@ -2417,6 +2442,8 @@ snapshots: optionalDependencies: fsevents: 2.3.3 + clsx@2.1.1: {} + color-convert@2.0.1: dependencies: color-name: 1.1.4 @@ -3061,6 +3088,8 @@ snapshots: dependencies: picomatch: 2.3.1 + regenerator-runtime@0.14.1: {} + regexparam@3.0.0: {} resolve-from@4.0.0: {} @@ -3286,6 +3315,10 @@ snapshots: magic-string: 0.30.10 zimmerframe: 1.1.2 + tailwind-merge@2.3.0: + dependencies: + '@babel/runtime': 7.24.6 + tailwindcss@3.4.3: dependencies: '@alloc/quick-lru': 5.2.0 diff --git a/src/fonts.css b/src/fonts.css index 1a0f85a..368fa90 100644 --- a/src/fonts.css +++ b/src/fonts.css @@ -1,6 +1,2 @@ -@font-face { - font-family: 'IBM Plex Mono'; - font-style: normal; - font-weight: 400; - src: url('/fonts/IBM_Plex_Mono/IBMPlexMono-Regular.ttf') format('truetype'); -} +@import url('https://fonts.googleapis.com/css2?family=Inter:wght@100..900&display=swap'); +@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;1,100;1,200;1,300;1,400;1,500;1,600;1,700&family=Inter:wght@100..900&display=swap'); diff --git a/src/lib/cn.ts b/src/lib/cn.ts new file mode 100644 index 0000000..3404f4e --- /dev/null +++ b/src/lib/cn.ts @@ -0,0 +1,4 @@ +import clsx, { type ClassValue } from 'clsx'; +import { twMerge } from 'tailwind-merge'; + +export const cn = (...classes: ClassValue[]): string => twMerge(clsx(classes)); diff --git a/src/routes/(app)/+page.svelte b/src/routes/(app)/+page.svelte new file mode 100644 index 0000000..417786c --- /dev/null +++ b/src/routes/(app)/+page.svelte @@ -0,0 +1,78 @@ + + +
+ +
+
+

omfj

+
+ +
+
+
+

+ My name is Ole Magnus. I am {yearsOld} year old software developer from Norway. Currently residing + in Bergen, and studying Computer Technology at the University of Bergen. +

+
+ +
Current interests include web development, SQLite and Hono.
+ +
+

Want to have a look at my resumè?

+ +

+ You can find it here. +

+
+ +
+ Socials + Ways to get in touch with me. + + + GitHub + (@omfj) + + + Instagram + (@lordolem) + + + LinkedIn + (in/omfj) + + + X + (@omfj_) + + +
+
+
+
+ + diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte index bb4b9a9..6e94c55 100644 --- a/src/routes/+layout.svelte +++ b/src/routes/+layout.svelte @@ -1,14 +1,10 @@ -
-
-

omfj.no

-
+ let { children } = $props(); + -
- -
+
+ {@render children()}
diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte deleted file mode 100644 index e7e6b27..0000000 --- a/src/routes/+page.svelte +++ /dev/null @@ -1,46 +0,0 @@ - - -
-
-

- My name is Ole Magnus. I am {yearsOld} year old - software developer - from - Norway. Currently residing in Bergen, and studying Computer Technology at the - University of Bergen. -

-
- -
- Socials - Ways to get in touch with me. - - - GitHub - (@omfj) - - - Instagram - (@lordolem) - - - LinkedIn - (in/omfj) - - - X - (@omfj_) - - -
-
diff --git a/src/routes/cv/[lang]/+page.svelte b/src/routes/cv/[lang]/+page.svelte new file mode 100644 index 0000000..ff39b8e --- /dev/null +++ b/src/routes/cv/[lang]/+page.svelte @@ -0,0 +1,271 @@ + + + +
+
+ + + +
+ +
+
+ Ole Magnus +
+ +
+

Ole Magnus Fon Johnsen

+
    + {#each metadata as { label, value, link }} +
  • +

    + {label}:{' '} + {#if link} + {value} + {:else} + {value} + {/if} +

    +
    • + {/each} +
+
+
+ +
+

About me

+ +

+ I am an outgoing and curious person who loves to learn. Ever since I was young, I have had a + great interest in everything related to computers and technology. When I am not studying, I + enjoy playing video games, or tennis with friends if the weather is nice. +

+
+ +
+

Education

+ +
    + {#each education as { year, title, institution }} +
  • +

    {year}

    +

    + {title} at {institution} +

    +
    • + {/each} +
+
+ +
+

Work experience

+ +
    + {#each workExperience as { year, title, company, description }} +
  • +

    {year}

    +
    +

    + {title} at {company} +

    +

    {description}

    +
    +
    • + {/each} +
+
+ +
+

Volunteer experience

+ +
    + {#each volunteerExperience as { year, title, company, description }} +
  • +

    {year}

    +
    +

    + {title} at {company} +

    +

    {description}

    +
    +
    • + {/each} +
+
+ +
+

Skills

+ +
    + {#each skills as { title, description }} +
  • +

    {title}

    +

    {description}

    +
    • + {/each} +
+
+ +
+

Other

+ +

+ See some of my other projects on my GitHub, @omfj. (https://www.github.com/omfj) +

+

+ I also have some certificates on Codecademy. (https://www.codecademy.com/profiles/omfj) +

+
+ +
+ + diff --git a/src/routes/cv/[lang]/+page.ts b/src/routes/cv/[lang]/+page.ts new file mode 100644 index 0000000..c38369c --- /dev/null +++ b/src/routes/cv/[lang]/+page.ts @@ -0,0 +1,10 @@ +import { error } from '@sveltejs/kit'; +import type { PageLoad } from './$types'; + +export const load: PageLoad = async ({ params }) => { + if (params.lang !== 'en') { + error(404, 'Not found'); + } + + return null; +}; diff --git a/src/routes/cv/[lang]/_components/Page.svelte b/src/routes/cv/[lang]/_components/Page.svelte new file mode 100644 index 0000000..e42f475 --- /dev/null +++ b/src/routes/cv/[lang]/_components/Page.svelte @@ -0,0 +1,15 @@ + + +
+ {@render children()} +
diff --git a/src/routes/cv/[lang]/avatar.png b/src/routes/cv/[lang]/avatar.png new file mode 100644 index 0000000..6a68373 Binary files /dev/null and b/src/routes/cv/[lang]/avatar.png differ diff --git a/tailwind.config.js b/tailwind.config.js index 1fb73ac..777a677 100644 --- a/tailwind.config.js +++ b/tailwind.config.js @@ -6,6 +6,7 @@ export default { theme: { extend: { fontFamily: { + sans: ['Inter', ...fontFamily.sans], mono: ['IBM Plex Mono', ...fontFamily.mono] }, colors: { @@ -13,6 +14,17 @@ export default { DEFAULT: '#000', soft: '#2a2a2b' } + }, + width: { + a4: '21cm' + }, + height: { + // Actually A4 is 29.7cm, but we need to be a bit smaller + // so it doesn't add a second page + a4: '29.7cm' + }, + screens: { + a4: '21cm' } } },