Compare commits
1 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| 9a3a6f40d3 |
10550
package-lock.json
generated
10550
package-lock.json
generated
File diff suppressed because it is too large
Load Diff
79
package.json
79
package.json
@ -1,45 +1,38 @@
|
||||
{
|
||||
"name": "my-portfolio",
|
||||
"version": "0.0.1",
|
||||
"private": true,
|
||||
"scripts": {
|
||||
"dev": "vite dev",
|
||||
"build": "vite build",
|
||||
"check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
|
||||
"check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch",
|
||||
"preview": "vite preview",
|
||||
"lint": "prettier --check . && eslint .",
|
||||
"format": "prettier --write ."
|
||||
},
|
||||
"devDependencies": {
|
||||
"@sveltejs/adapter-auto": "^3.3.1",
|
||||
"@sveltejs/kit": "^2.9.0",
|
||||
"@sveltejs/vite-plugin-svelte": "^5.0.1",
|
||||
"@tsconfig/svelte": "^5.0.4",
|
||||
"@types/eslint": "^9.6.1",
|
||||
"@types/node": "^22.10.1",
|
||||
"autoprefixer": "^10.4.20",
|
||||
"eslint": "^9.16.0",
|
||||
"eslint-config-prettier": "^9.1.0",
|
||||
"eslint-plugin-svelte": "^2.46.1",
|
||||
"flowbite": "^2.5.2",
|
||||
"flowbite-svelte": "^0.47.4",
|
||||
"flowbite-svelte-icons": "^2.0.2",
|
||||
"postcss": "^8.4.49",
|
||||
"prettier": "^3.4.2",
|
||||
"prettier-plugin-svelte": "^3.3.2",
|
||||
"svelte": "^5.7.1",
|
||||
"svelte-check": "^4.0.0",
|
||||
"tailwindcss": "^3.4.16",
|
||||
"typescript": "^5.7.2",
|
||||
"vite": "^6.0.3"
|
||||
},
|
||||
"type": "module",
|
||||
"dependencies": {
|
||||
"@sveltejs/adapter-vercel": "^5.5.0",
|
||||
"@vercel/analytics": "^1.4.1",
|
||||
"geist": "^1.3.1",
|
||||
"moment": "^2.30.1",
|
||||
"pnpm": "^9.14.4"
|
||||
}
|
||||
"name": "my-portfolio",
|
||||
"version": "0.0.1",
|
||||
"private": true,
|
||||
"scripts": {
|
||||
"dev": "vite dev",
|
||||
"build": "vite build",
|
||||
"preview": "vite preview",
|
||||
"lint": "prettier --check . && eslint .",
|
||||
"format": "prettier --write ."
|
||||
},
|
||||
"devDependencies": {
|
||||
"@sveltejs/adapter-auto": "^3.0.0",
|
||||
"@sveltejs/kit": "^2.0.0",
|
||||
"@sveltejs/vite-plugin-svelte": "^3.0.0",
|
||||
"@types/eslint": "^8.56.0",
|
||||
"autoprefixer": "^10.4.19",
|
||||
"eslint": "^8.56.0",
|
||||
"eslint-config-prettier": "^9.1.0",
|
||||
"eslint-plugin-svelte": "^2.35.1",
|
||||
"flowbite": "^2.3.0",
|
||||
"flowbite-svelte": "^0.46.1",
|
||||
"flowbite-svelte-icons": "^1.6.1",
|
||||
"postcss": "^8.4.38",
|
||||
"prettier": "^3.1.1",
|
||||
"prettier-plugin-svelte": "^3.1.2",
|
||||
"svelte": "^4.2.7",
|
||||
"tailwindcss": "^3.4.3",
|
||||
"vite": "^5.0.3"
|
||||
},
|
||||
"type": "module",
|
||||
"dependencies": {
|
||||
"@sveltejs/adapter-vercel": "^5.3.0",
|
||||
"geist": "^1.3.0",
|
||||
"moment": "^2.30.1",
|
||||
"pnpm": "^9.1.1"
|
||||
}
|
||||
}
|
||||
|
||||
@ -10,11 +10,6 @@
|
||||
rel="stylesheet"
|
||||
/>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
<title>Christian Rannes Dev Portfolio</title>
|
||||
<meta
|
||||
name="description"
|
||||
content="Welcome to my personal website where I share my projects and repos."
|
||||
/>
|
||||
%sveltekit.head%
|
||||
</head>
|
||||
<body
|
||||
|
||||
@ -17,7 +17,8 @@
|
||||
|
||||
{#if $activeBtn === 'projects'}
|
||||
<ButtonGroup class="fixed md:hidden bottom-20 flex justify-center w-full">
|
||||
<Button href="/projects/web-dev" outline class="flex-col backdrop-blur ">Web-dev</Button>
|
||||
<Button href="/projects/svelte" outline class="flex-col backdrop-blur ">Svelte</Button>
|
||||
<Button href="/projects/nextjs" outline class="flex-col backdrop-blur">Next.js</Button>
|
||||
<Button href="/projects/homelab" outline class="flex-col backdrop-blur">Homelab</Button>
|
||||
</ButtonGroup>
|
||||
{/if}
|
||||
|
||||
@ -1,69 +0,0 @@
|
||||
<script lang="ts">
|
||||
import { DeviceMockup } from 'flowbite-svelte';
|
||||
import { DesktopPcOutline, MobilePhoneOutline } from 'flowbite-svelte-icons';
|
||||
import Spinner from './Spinner.svelte';
|
||||
let desktop = $state(true);
|
||||
let isLoading = $state(true);
|
||||
|
||||
const deviceSwap = () => {
|
||||
desktop = !desktop;
|
||||
isLoading = true;
|
||||
};
|
||||
|
||||
const handleIFrameLoad = () => {
|
||||
// Wait a small time to ensure the iframe is rendered
|
||||
setTimeout(() => (isLoading = false), 100);
|
||||
};
|
||||
</script>
|
||||
|
||||
<h2 class="mt-6 mb-2 text-3xl">Featured projects</h2>
|
||||
|
||||
<div class="">
|
||||
{#if !desktop}
|
||||
<div class="h-12">
|
||||
<DeviceMockup device="default">
|
||||
{#if isLoading}
|
||||
<div class="w-full h-full flex justify-center items-center">
|
||||
<Spinner />
|
||||
</div>
|
||||
{/if}
|
||||
<iframe
|
||||
src="https://sauer-wine.vercel.app"
|
||||
class="h-[900px] w-[400px] origin-top-left scale-[0.68] {isLoading
|
||||
? 'opacity-0'
|
||||
: 'opacity-100'} transition-opacity duration-500"
|
||||
frameBorder="0"
|
||||
title="Project preview"
|
||||
onload={handleIFrameLoad}
|
||||
>
|
||||
</iframe>
|
||||
</DeviceMockup>
|
||||
</div>
|
||||
<button onclick={deviceSwap}>
|
||||
<DesktopPcOutline class="text-primary-400" />
|
||||
</button>
|
||||
{:else}
|
||||
<div>
|
||||
<DeviceMockup device="laptop" >
|
||||
{#if isLoading}
|
||||
<div class="w-full h-full flex justify-center items-center">
|
||||
<Spinner />
|
||||
</div>
|
||||
{/if}
|
||||
<iframe
|
||||
src="https://sauer-wine.vercel.app"
|
||||
class="h-[768px] w-[1366px] origin-top-left scale-[0.37] {isLoading
|
||||
? 'opacity-0'
|
||||
: 'opacity-100'} transition-opacity duration-500"
|
||||
frameBorder="0"
|
||||
title="Project preview"
|
||||
onload={handleIFrameLoad}
|
||||
>
|
||||
</iframe>
|
||||
</DeviceMockup>
|
||||
</div>
|
||||
<button onclick={deviceSwap}>
|
||||
<MobilePhoneOutline class="text-primary-400" />
|
||||
</button>
|
||||
{/if}
|
||||
</div>
|
||||
@ -4,9 +4,9 @@
|
||||
export let vendors;
|
||||
</script>
|
||||
|
||||
<div class="my-4 dark:bg-slate-800 mx-auto md:w-fit rounded-2xl p-2">
|
||||
<div class="my-4 dark:bg-slate-800 w-fit mx-auto rounded-2xl p-2">
|
||||
<h3 class="text-xl mb-2 text-center">built with</h3>
|
||||
<div class="flex justify-center flex-wrap gap-2">
|
||||
<div class="flex justify-center gap-6 flex-wrap">
|
||||
{#each vendors as vendor}
|
||||
<VendorIcon {...vendor} />
|
||||
{/each}
|
||||
|
||||
@ -3,9 +3,8 @@
|
||||
export let img;
|
||||
</script>
|
||||
|
||||
<div class="flex flex-col justify-center h-16 hover:scale-110 text-center items-center">
|
||||
<div class="flex justify-center h-12 w-12">
|
||||
<img src={img} alt={name} class="min-h-12 min-w-12 self-center" />
|
||||
|
||||
<div class="flex flex-col justify-center h-16 hover:scale-110">
|
||||
<img src={img} alt={name} class="min-h-12 max-w-12 self-center" />
|
||||
<p class="text-slate-900 dark:text-stone-200 font-normal">{name}</p>
|
||||
</div>
|
||||
<p class="text-slate-900 dark:text-stone-200">{name}</p>
|
||||
</div>
|
||||
|
||||
@ -1,8 +1,11 @@
|
||||
<script>
|
||||
import { projects } from '$lib/projects.js';
|
||||
import ProjectCard from './ProjectCard/ProjectCard.svelte';
|
||||
export let category;
|
||||
</script>
|
||||
|
||||
{#each projects as project}
|
||||
{#if project.category === category}
|
||||
<ProjectCard {...project} />
|
||||
{/if}
|
||||
{/each}
|
||||
|
||||
@ -10,9 +10,12 @@
|
||||
} from 'flowbite-svelte';
|
||||
import { ChevronDownOutline } from 'flowbite-svelte-icons';
|
||||
import logo from '$lib/logo.png';
|
||||
import { page } from '$app/stores';
|
||||
|
||||
$: activeUrl = $page.url.pathname;
|
||||
</script>
|
||||
|
||||
<Navbar class="bg-transparent dark:bg-transparent">
|
||||
<Navbar class="bg-transparent">
|
||||
<NavBrand href="/">
|
||||
<img src={logo} class="me-3 h-6 sm:h-9" alt="Flowbite Logo" />
|
||||
<span class="self-center whitespace-nowrap text-xl font-semibold dark:text-stone-200"
|
||||
@ -22,13 +25,18 @@
|
||||
<div class="flex">
|
||||
<DarkMode btnClass="block sm:hidden" />
|
||||
</div>
|
||||
<NavUl class="md:flex-row">
|
||||
<NavUl class="md:flex-row" {activeUrl}>
|
||||
<NavLi href="/">home</NavLi>
|
||||
<NavLi class="cursor-pointer">
|
||||
projects<ChevronDownOutline class="w-6 h-6 text-primary-800 dark:text-stone-200 inline" />
|
||||
</NavLi>
|
||||
<Dropdown activeClass="font-bold text-primary-800 dark:text-stone-200" class="w-44 z-20">
|
||||
<DropdownItem href="/projects/web-dev">web-dev</DropdownItem>
|
||||
<Dropdown
|
||||
{activeUrl}
|
||||
activeClass="font-bold text-primary-800 dark:text-stone-200"
|
||||
class="w-44 z-20"
|
||||
>
|
||||
<DropdownItem href="/projects/svelte">svelte</DropdownItem>
|
||||
<DropdownItem href="/projects/nextjs">nextjs</DropdownItem>
|
||||
<DropdownItem href="/projects/homelab">homelab</DropdownItem>
|
||||
</Dropdown>
|
||||
<NavLi class="hidden sm:block">
|
||||
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 100 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 45 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 264 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 45 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 35 KiB |
@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 333334 199332" shape-rendering="geometricPrecision" text-rendering="geometricPrecision" image-rendering="optimizeQuality" fill-rule="evenodd" clip-rule="evenodd"><defs><style>.fil1{fill:#f90}</style></defs><g id="Layer_x0020_1"><g id="amazon-web-services-2.svg"><path d="M93937 72393c0 4102 443 7428 1219 9867 887 2439 1996 5100 3548 7982 554 887 776 1774 776 2550 0 1109-665 2217-2106 3326l-6985 4656c-998 665-1995 998-2882 998-1109 0-2217-554-3326-1552-1552-1663-2882-3437-3991-5211-1109-1885-2217-3991-3437-6541-8648 10200-19512 15299-32594 15299-9312 0-16740-2661-22172-7982-5432-5322-8204-12417-8204-21286 0-9424 3326-17073 10089-22838s15743-8647 27161-8647c3769 0 7650 332 11752 887 4102 554 8315 1441 12749 2439v-8093c0-8426-1774-14301-5211-17738-3548-3437-9534-5100-18071-5100-3880 0-7871 443-11973 1441s-8093 2217-11973 3769c-1774 776-3104 1219-3880 1441s-1330 332-1774 332c-1552 0-2328-1109-2328-3437v-5432c0-1774 222-3104 776-3880s1552-1552 3104-2328c3880-1996 8537-3659 13969-4989C43606 885 49370 220 55468 220c13193 0 22838 2993 29046 8980 6098 5987 9202 15077 9202 27272v35920h222zM48926 89244c3659 0 7428-665 11419-1995s7539-3769 10532-7095c1774-2106 3104-4435 3770-7095 665-2661 1108-5876 1108-9645v-4656c-3215-776-6652-1441-10199-1885-3548-443-6984-665-10421-665-7428 0-12860 1441-16519 4435-3659 2993-5432 7206-5432 12749 0 5211 1330 9091 4102 11751 2661 2772 6541 4102 11641 4102zm89023 11973c-1996 0-3326-332-4213-1109-887-665-1663-2217-2328-4324l-26053-85697c-665-2217-998-3658-998-4434 0-1774 887-2772 2661-2772h10865c2106 0 3548 333 4324 1109 887 665 1552 2217 2217 4324l18625 73391 17295-73391c554-2217 1219-3659 2106-4324s2439-1109 4435-1109h8869c2106 0 3548 333 4435 1109 887 665 1663 2217 2106 4324l17516 74278 19180-74278c665-2217 1441-3659 2217-4324 887-665 2328-1109 4324-1109h10310c1774 0 2772 887 2772 2772 0 554-111 1109-222 1774s-333 1552-776 2772l-26718 85697c-665 2217-1441 3658-2328 4324-887 665-2328 1109-4213 1109h-9534c-2107 0-3548-333-4435-1109s-1663-2217-2106-4435l-17184-71507-17073 71396c-554 2217-1220 3658-2107 4434s-2439 1109-4434 1109h-9534zm142459 2993c-5765 0-11530-665-17073-1995s-9867-2772-12749-4435c-1774-998-2993-2106-3437-3104-443-998-665-2106-665-3104v-5654c0-2328 887-3437 2550-3437 665 0 1330 111 1995 333s1663 665 2772 1109c3769 1663 7871 2993 12195 3880 4435 887 8758 1330 13193 1330 6984 0 12417-1220 16186-3659s5765-5987 5765-10532c0-3104-998-5654-2993-7760-1996-2107-5765-3991-11197-5765l-16075-4989c-8093-2550-14080-6319-17738-11308-3658-4878-5543-10310-5543-16075 0-4656 998-8758 2993-12306s4656-6652 7982-9091c3326-2550 7095-4434 11530-5765S279190-2 284068-2c2439 0 4989 111 7428 443 2550 333 4878 776 7206 1219 2217 554 4324 1109 6319 1774s3548 1330 4656 1996c1552 887 2661 1774 3326 2771 665 887 998 2107 998 3659v5211c0 2328-887 3548-2550 3548-887 0-2328-444-4213-1331-6319-2882-13415-4324-21286-4324-6319 0-11308 998-14745 3104s-5211 5321-5211 9867c0 3104 1109 5765 3326 7871s6319 4213 12195 6097l15743 4989c7982 2550 13747 6098 17184 10643s5100 9756 5100 15521c0 4767-998 9091-2882 12860-1996 3770-4656 7095-8093 9756-3437 2771-7539 4767-12306 6208-4989 1552-10199 2328-15854 2328z" fill="#252f3e"/><path class="fil1" d="M301362 158091c-36474 26940-89467 41241-135031 41241-63858 0-121395-23614-164854-62859-3437-3104-332-7317 3770-4878 47006 27272 104988 43791 164964 43791 40465 0 84921-8426 125830-25721 6097-2772 11308 3991 5321 8426z"/><path class="fil1" d="M316550 140796c-4656-5987-30820-2883-42682-1441-3548 443-4102-2661-887-4989 20842-14634 55099-10421 59090-5543 3991 4989-1109 39246-20620 55653-2993 2550-5876 1220-4545-2106 4435-10976 14301-35698 9645-41574z"/></g></g></svg>
|
||||
|
Before Width: | Height: | Size: 3.6 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 25 KiB |
@ -1 +0,0 @@
|
||||
<?xml version="1.0" encoding="utf-8"?><svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 122.88 45.91" style="enable-background:new 0 0 122.88 45.91" xml:space="preserve"><style type="text/css">.st0{fill-rule:evenodd;clip-rule:evenodd;fill:#00ACD7;} .st1{fill:#00ACD7;}</style><g><path class="st0" d="M9.27,13.9c-0.24,0-0.3-0.12-0.18-0.3l1.26-1.62c0.12-0.18,0.42-0.3,0.66-0.3l21.36,0 c0.24,0,0.3,0.18,0.18,0.36l-1.02,1.56c-0.12,0.18-0.42,0.36-0.6,0.36L9.27,13.9L9.27,13.9z"/><path class="st0" d="M0.24,19.41c-0.24,0-0.3-0.12-0.18-0.3l1.26-1.62c0.12-0.18,0.42-0.3,0.66-0.3h27.28 c0.24,0,0.36,0.18,0.3,0.36l-0.48,1.44c-0.06,0.24-0.3,0.36-0.54,0.36L0.24,19.41L0.24,19.41z"/><path class="st0" d="M14.72,24.91c-0.24,0-0.3-0.18-0.18-0.36l0.84-1.5c0.12-0.18,0.36-0.36,0.6-0.36l11.97,0 c0.24,0,0.36,0.18,0.36,0.42l-0.12,1.44c0,0.24-0.24,0.42-0.42,0.42L14.72,24.91L14.72,24.91z"/><path class="st0" d="M76.82,12.82c-3.77,0.96-6.34,1.68-10.05,2.63c-0.9,0.24-0.96,0.3-1.74-0.6c-0.9-1.02-1.56-1.67-2.81-2.27 c-3.77-1.85-7.42-1.32-10.83,0.9c-4.07,2.63-6.16,6.52-6.1,11.37c0.06,4.79,3.35,8.73,8.08,9.39c4.07,0.54,7.48-0.9,10.17-3.95 c0.54-0.66,1.02-1.38,1.62-2.21c-2.15,0-4.85,0-11.55,0c-1.26,0-1.56-0.78-1.14-1.79c0.78-1.85,2.21-4.97,3.05-6.52 c0.18-0.36,0.6-0.96,1.5-0.96h21.78c-0.12,1.62-0.12,3.23-0.36,4.85c-0.66,4.31-2.27,8.26-4.91,11.73 c-4.31,5.68-9.93,9.21-17.05,10.17c-5.86,0.78-11.31-0.36-16.09-3.95c-4.43-3.35-6.94-7.78-7.6-13.28 c-0.78-6.52,1.14-12.38,5.09-17.53c4.25-5.56,9.87-9.09,16.75-10.35c5.62-1.02,11.01-0.36,15.85,2.93 c3.17,2.09,5.44,4.97,6.94,8.44C77.78,12.35,77.54,12.64,76.82,12.82L76.82,12.82L76.82,12.82z"/><path class="st1" d="M96.62,45.91c-5.44-0.12-10.41-1.68-14.6-5.26c-3.53-3.05-5.74-6.94-6.46-11.55 c-1.08-6.76,0.78-12.74,4.85-18.07c4.37-5.74,9.63-8.73,16.75-9.99c6.1-1.08,11.85-0.48,17.05,3.05c4.73,3.23,7.66,7.6,8.44,13.34 c1.02,8.08-1.32,14.66-6.88,20.28c-3.95,4.01-8.79,6.52-14.36,7.66C99.79,45.67,98.18,45.73,96.62,45.91L96.62,45.91L96.62,45.91z M110.86,21.74c-0.06-0.78-0.06-1.38-0.18-1.97c-1.08-5.92-6.52-9.27-12.21-7.96c-5.56,1.26-9.15,4.79-10.47,10.41 c-1.08,4.67,1.2,9.39,5.5,11.31c3.29,1.44,6.58,1.26,9.75-0.36C107.99,30.71,110.56,26.88,110.86,21.74L110.86,21.74z"/></g></svg>
|
||||
|
Before Width: | Height: | Size: 2.2 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 58 KiB |
File diff suppressed because one or more lines are too long
|
Before Width: | Height: | Size: 11 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 2.8 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 39 KiB |
@ -4,106 +4,109 @@ import vercelIcon from '$lib/images/vendorIcons/vercelIcon.svg';
|
||||
import flowbiteSvelteIcon from '$lib/images/vendorIcons/flowbiteSvelteIcon.svg';
|
||||
import reactIcon from '$lib/images/vendorIcons/reactIcon.svg';
|
||||
import nextjsIcon from '$lib/images/vendorIcons/nextjsIcon.svg';
|
||||
import goIcon from '$lib/images/vendorIcons/goIcon.svg';
|
||||
import k8sIcon from '$lib/images/vendorIcons/kubernetes.svg'
|
||||
import nextuiIcon from '$lib/images/vendorIcons/nextuiIcon.png';
|
||||
import authjsIcon from '$lib/images/vendorIcons/authjsIcon.webp';
|
||||
import drizzleIcon from '$lib/images/vendorIcons/drizzleIcon.webp';
|
||||
|
||||
export const projects = [
|
||||
{
|
||||
title: 'Software Jobs',
|
||||
url: 'https://jobs.rannes.dev',
|
||||
description:
|
||||
'I wanted an excuse to try out Go, and I also want to find a job. The scraper is built with Go and the Colly package. The scraper runs as a cron job in kubernetes, and is served as an API deployd to the same cluster. The frontend is built with Next.js which is deployed to Vercel.',
|
||||
repo: 'https://gitea.rannes.dev/rannes.dev/sw-jobs-frontend',
|
||||
rss: 'https://gitea.rannes.dev/rannes.dev/sw-jobs-frontend.rss',
|
||||
image: '',
|
||||
vendors: [
|
||||
{
|
||||
name: 'Go',
|
||||
img: goIcon,
|
||||
url: 'https://go.dev/'
|
||||
},
|
||||
{
|
||||
name: 'Next.js',
|
||||
img: nextjsIcon,
|
||||
url: 'https://nextjs.org/'
|
||||
},
|
||||
{
|
||||
name: 'Tailwind',
|
||||
img: tailwindIcon,
|
||||
url: 'https://tailwindcss.com/'
|
||||
},
|
||||
{
|
||||
name: 'Vercel',
|
||||
img: vercelIcon,
|
||||
url: 'https://vercel.com/'
|
||||
},
|
||||
{
|
||||
name: 'k8s',
|
||||
img: k8sIcon,
|
||||
url: 'https://aws.amazon.com/'
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
title: 'Portfolio',
|
||||
url: 'https://rannes.dev',
|
||||
description:
|
||||
'This project was initially to get familiar with Svelte and showcase my future projects. I find myself that I keep coming back to expand on it whenever I need a break from React.',
|
||||
repo: 'https://gitea.rannes.dev/rannes.dev/my-portfolio',
|
||||
rss: 'https://gitea.rannes.dev/rannes.dev/my-portfolio.rss',
|
||||
image: '',
|
||||
vendors: [
|
||||
{
|
||||
name: 'Svelte',
|
||||
img: svelteIcon,
|
||||
url: 'https://svelte.dev/'
|
||||
},
|
||||
{
|
||||
name: 'Tailwind',
|
||||
img: tailwindIcon,
|
||||
url: 'https://tailwindcss.com/'
|
||||
},
|
||||
{
|
||||
name: 'Flowbite',
|
||||
img: flowbiteSvelteIcon,
|
||||
url: 'https://flowbite-svelte.com//'
|
||||
},
|
||||
{
|
||||
name: 'Vercel',
|
||||
img: vercelIcon,
|
||||
url: 'https://vercel.com/'
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
category: 'nextjs',
|
||||
title: 'Local weather',
|
||||
url: 'https://weather.rannes.dev',
|
||||
description: 'A simple application to fetch a weekly weather forecast.',
|
||||
repo: 'https://gitea.rannes.dev/rannes.dev/local-weather',
|
||||
rss: 'https://gitea.rannes.dev/rannes.dev/local-weather.rss',
|
||||
image: '',
|
||||
vendors: [
|
||||
{
|
||||
name: 'React',
|
||||
img: reactIcon,
|
||||
url: 'https://react.dev/'
|
||||
},
|
||||
{
|
||||
name: 'Next.js',
|
||||
img: nextjsIcon,
|
||||
url: 'https://nextjs.org/'
|
||||
},
|
||||
{
|
||||
name: 'Tailwind',
|
||||
img: tailwindIcon,
|
||||
url: 'https://tailwindcss.com/'
|
||||
},
|
||||
{
|
||||
name: 'Vercel',
|
||||
img: vercelIcon,
|
||||
url: 'https://vercel.com/'
|
||||
}
|
||||
]
|
||||
}
|
||||
{
|
||||
category: 'svelte',
|
||||
title: 'Portfolio',
|
||||
url: 'https://rannes.dev',
|
||||
description:
|
||||
'This project was initially to get familiar with Svelte and showcase my future projects. I find myself that I keep coming back to expand on it whenever I need a break from React.',
|
||||
repo: 'https://gitea.rannes.dev/rannes.dev/my-portfolio',
|
||||
rss: 'https://gitea.rannes.dev/rannes.dev/my-portfolio.rss',
|
||||
image: '',
|
||||
vendors: [
|
||||
{
|
||||
name: 'Svelte',
|
||||
img: svelteIcon,
|
||||
url: 'https://svelte.dev/'
|
||||
},
|
||||
{
|
||||
name: 'Tailwind',
|
||||
img: tailwindIcon,
|
||||
url: 'https://tailwindcss.com/'
|
||||
},
|
||||
{
|
||||
name: 'Flowbite',
|
||||
img: flowbiteSvelteIcon,
|
||||
url: 'https://flowbite-svelte.com//'
|
||||
},
|
||||
{
|
||||
name: 'Vercel',
|
||||
img: vercelIcon,
|
||||
url: 'https://vercel.com/'
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
category: 'nextjs',
|
||||
title: 'Online Wine Shop.',
|
||||
url: 'https://wine-shop-eta.vercel.app/',
|
||||
description:
|
||||
`To get more familiar with forms, sql and postgres I am building a online wineshop for my friend Ketil (that he didn't ask for). Besides the current technologies, I plan to implement Clerk or Auth.js for auth, and Zustand for state management if neccesary (Something tells me it's needed at least for cart)`,
|
||||
repo: 'https://gitea.rannes.dev/rannes.dev/wine-shop',
|
||||
rss: 'https://gitea.rannes.dev/rannes.dev/wine-shop.rss',
|
||||
image: '',
|
||||
vendors: [
|
||||
{
|
||||
name: 'React',
|
||||
img: reactIcon,
|
||||
url: 'https://react.dev/'
|
||||
},
|
||||
{
|
||||
name: 'Next.js',
|
||||
img: nextjsIcon,
|
||||
url: 'https://nextjs.org/'
|
||||
},
|
||||
{
|
||||
name: 'Tailwind',
|
||||
img: tailwindIcon,
|
||||
url: 'https://tailwindcss.com/'
|
||||
},
|
||||
{
|
||||
name: 'Drizzle',
|
||||
img: drizzleIcon,
|
||||
url: 'https://orm.drizzle.team/'
|
||||
},
|
||||
{
|
||||
name: 'Vercel',
|
||||
img: vercelIcon,
|
||||
url: 'https://vercel.com/'
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
category: 'nextjs',
|
||||
title: 'Local weather',
|
||||
url: 'https://weather.rannes.dev',
|
||||
description: 'A simple application to fetch a weekly weather forecast.',
|
||||
repo: 'https://gitea.rannes.dev/rannes.dev/local-weather',
|
||||
rss: 'https://gitea.rannes.dev/rannes.dev/local-weather.rss',
|
||||
image: '',
|
||||
vendors: [
|
||||
{
|
||||
name: 'React',
|
||||
img: reactIcon,
|
||||
url: 'https://react.dev/'
|
||||
},
|
||||
{
|
||||
name: 'Next.js',
|
||||
img: nextjsIcon,
|
||||
url: 'https://nextjs.org/'
|
||||
},
|
||||
{
|
||||
name: 'Tailwind',
|
||||
img: tailwindIcon,
|
||||
url: 'https://tailwindcss.com/'
|
||||
},
|
||||
{
|
||||
name: 'Vercel',
|
||||
img: vercelIcon,
|
||||
url: 'https://vercel.com/'
|
||||
}
|
||||
]
|
||||
}
|
||||
];
|
||||
|
||||
@ -1,10 +1,17 @@
|
||||
<script lang="ts">
|
||||
<script>
|
||||
import '../app.css';
|
||||
import CloudflareAnalytics from '$lib/CloudflareAnalytics.svelte';
|
||||
import BottomNavigation from '../lib/BottomNavigation.svelte';
|
||||
import TopNav from '../lib/TopNav.svelte';
|
||||
|
||||
let activeBtn = 'home';
|
||||
function handleNavItemClick(btnName) {
|
||||
activeBtn = btnName;
|
||||
}
|
||||
$: activeBtn = activeBtn === 'projects';
|
||||
</script>
|
||||
|
||||
<CloudflareAnalytics />
|
||||
<TopNav />
|
||||
<div class="px-2 sm:px-0 mx-auto max-w-xs sm:max-w-md md:max-w-3xl mb-20 md:mb-0">
|
||||
<slot />
|
||||
|
||||
@ -4,7 +4,6 @@
|
||||
import { Heading, Mark } from 'flowbite-svelte';
|
||||
import portfolio from '$lib/images/portfolio.png';
|
||||
import hero from '$lib/images/hero.webp';
|
||||
import FeaturedProjects from '$lib/FeaturedProjects.svelte';
|
||||
</script>
|
||||
|
||||
<div class="text-xl">
|
||||
|
||||
13
src/routes/contact/+page.svelte
Normal file
13
src/routes/contact/+page.svelte
Normal file
@ -0,0 +1,13 @@
|
||||
<script>
|
||||
import PageHeader from '$lib/PageHeader.svelte';
|
||||
const title = 'Coming soon!';
|
||||
</script>
|
||||
|
||||
<PageHeader {title} />
|
||||
<p class="py-6">
|
||||
For now you can hit me up on <a
|
||||
class="font-normal underline"
|
||||
href="https://www.linkedin.com/in/christian-rannes/"
|
||||
target="_blank">linkedin</a
|
||||
>
|
||||
</p>
|
||||
@ -2,6 +2,7 @@
|
||||
import { fade } from 'svelte/transition';
|
||||
import Projects from '$lib/Projects.svelte';
|
||||
import PageHeader from '$lib/PageHeader.svelte';
|
||||
const projectRssUrl = 'https://gitea.rannes.dev/rannes.dev/my-portfolio.rss';
|
||||
const category = 'svelte';
|
||||
const title = 'Svelte Projects';
|
||||
</script>
|
||||
|
||||
@ -1,11 +0,0 @@
|
||||
<script>
|
||||
import { fade } from 'svelte/transition';
|
||||
import Projects from '$lib/Projects.svelte';
|
||||
import PageHeader from '$lib/PageHeader.svelte';
|
||||
const title = 'Web dev projects';
|
||||
</script>
|
||||
|
||||
<div in:fade>
|
||||
<PageHeader {title} />
|
||||
<Projects />
|
||||
</div>
|
||||
@ -1,3 +0,0 @@
|
||||
<div>
|
||||
<img src="$lib/images/portfolio-card.webp" alt="Socials Card" />
|
||||
</div>
|
||||
@ -1,31 +1,31 @@
|
||||
/** @type {import('tailwindcss').Config} */
|
||||
export default {
|
||||
content: [
|
||||
'./src/**/*.{html,js,svelte,ts}',
|
||||
'./node_modules/flowbite-svelte/**/*.{html,js,svelte,ts}'
|
||||
],
|
||||
plugins: ['flowbite/plugin'],
|
||||
darkMode: 'class',
|
||||
theme: {
|
||||
extend: {
|
||||
colors: {
|
||||
// slate
|
||||
primary: {
|
||||
50: '#f8fafc',
|
||||
100: '#f1f5f9',
|
||||
200: '#e2e8f0',
|
||||
300: '#cbd5e1',
|
||||
400: '#94a3b8',
|
||||
500: '#64748b',
|
||||
600: '#475569',
|
||||
700: '#334155',
|
||||
800: '#1e293b',
|
||||
900: '#0f172a'
|
||||
}
|
||||
},
|
||||
fontFamily: {
|
||||
jose: ['Josefin Sans', 'sans-serif']
|
||||
}
|
||||
}
|
||||
}
|
||||
content: [
|
||||
'./src/**/*.{html,js,svelte,ts}',
|
||||
'./node_modules/flowbite-svelte/**/*.{html,js,svelte,ts}'
|
||||
],
|
||||
plugins: [require('flowbite/plugin')],
|
||||
darkMode: 'class',
|
||||
theme: {
|
||||
extend: {
|
||||
colors: {
|
||||
// slate
|
||||
primary: {
|
||||
50: '#f8fafc',
|
||||
100: '#f1f5f9',
|
||||
200: '#e2e8f0',
|
||||
300: '#cbd5e1',
|
||||
400: '#94a3b8',
|
||||
500: '#64748b',
|
||||
600: '#475569',
|
||||
700: '#334155',
|
||||
800: '#1e293b',
|
||||
900: '#0f172a'
|
||||
}
|
||||
},
|
||||
fontFamily: {
|
||||
jose: ['Josefin Sans', 'sans-serif']
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
@ -1,14 +0,0 @@
|
||||
{
|
||||
"extends": "./.svelte-kit/tsconfig.json",
|
||||
"compilerOptions": {
|
||||
"allowJs": true,
|
||||
"checkJs": true,
|
||||
"esModuleInterop": true,
|
||||
"forceConsistentCasingInFileNames": true,
|
||||
"resolveJsonModule": true,
|
||||
"skipLibCheck": true,
|
||||
"sourceMap": true,
|
||||
"strict": true,
|
||||
"moduleResolution": "bundler"
|
||||
}
|
||||
}
|
||||
Loading…
Reference in New Issue
Block a user