Skip to content

Commit 4034433

Browse files
DiscusserDiscusser
committed
Add home page
1 parent 9d5325b commit 4034433

18 files changed

+339
-77
lines changed

‎package.json‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -23,16 +23,21 @@
2323
"eslint-config-prettier": "^9.1.0",
2424
"eslint-plugin-svelte": "^2.36.0",
2525
"globals": "^15.0.0",
26+
"mode-watcher": "^0.4.1",
2627
"prettier": "^3.3.2",
2728
"prettier-plugin-svelte": "^3.2.6",
2829
"prettier-plugin-tailwindcss": "^0.6.5",
2930
"svelte": "^5.0.0",
3031
"svelte-check": "^4.0.0",
32+
"svelte-sonner": "^0.3.28",
3133
"tailwind-merge": "^2.5.4",
3234
"tailwind-variants": "^0.2.1",
3335
"tailwindcss": "^3.4.9",
3436
"typescript": "^5.0.0",
3537
"typescript-eslint": "^8.0.0",
3638
"vite": "^5.0.3"
39+
},
40+
"dependencies": {
41+
"@tabler/icons-svelte": "^3.21.0"
3742
}
3843
}

‎pnpm-lock.yaml‎

Lines changed: 43 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎src/app.css‎

Lines changed: 80 additions & 72 deletions
Original file line numberDiff line numberDiff line change
@@ -1,78 +1,86 @@
11
@tailwind base;
22
@tailwind components;
33
@tailwind utilities;
4-
4+
55
@layer base {
6-
:root {
7-
--background: 0 0% 100%;
8-
--foreground: 222.2 84% 4.9%;
9-
10-
--muted: 210 40% 96.1%;
11-
--muted-foreground: 215.4 16.3% 46.9%;
12-
13-
--popover: 0 0% 100%;
14-
--popover-foreground: 222.2 84% 4.9%;
15-
16-
--card: 0 0% 100%;
17-
--card-foreground: 222.2 84% 4.9%;
18-
19-
--border: 214.3 31.8% 91.4%;
20-
--input: 214.3 31.8% 91.4%;
21-
22-
--primary: 222.2 47.4% 11.2%;
23-
--primary-foreground: 210 40% 98%;
24-
25-
--secondary: 210 40% 96.1%;
26-
--secondary-foreground: 222.2 47.4% 11.2%;
27-
28-
--accent: 210 40% 96.1%;
29-
--accent-foreground: 222.2 47.4% 11.2%;
30-
31-
--destructive: 0 72.2% 50.6%;
32-
--destructive-foreground: 210 40% 98%;
33-
34-
--ring: 222.2 84% 4.9%;
35-
36-
--radius: 0.5rem;
37-
}
38-
39-
.dark {
40-
--background: 222.2 84% 4.9%;
41-
--foreground: 210 40% 98%;
42-
43-
--muted: 217.2 32.6% 17.5%;
44-
--muted-foreground: 215 20.2% 65.1%;
45-
46-
--popover: 222.2 84% 4.9%;
47-
--popover-foreground: 210 40% 98%;
48-
49-
--card: 222.2 84% 4.9%;
50-
--card-foreground: 210 40% 98%;
51-
52-
--border: 217.2 32.6% 17.5%;
53-
--input: 217.2 32.6% 17.5%;
54-
55-
--primary: 210 40% 98%;
56-
--primary-foreground: 222.2 47.4% 11.2%;
57-
58-
--secondary: 217.2 32.6% 17.5%;
59-
--secondary-foreground: 210 40% 98%;
60-
61-
--accent: 217.2 32.6% 17.5%;
62-
--accent-foreground: 210 40% 98%;
63-
64-
--destructive: 0 62.8% 30.6%;
65-
--destructive-foreground: 210 40% 98%;
66-
67-
--ring: 212.7 26.8% 83.9%;
68-
}
6+
:root {
7+
--background: 0 0% 100%;
8+
--foreground: 222.2 84% 4.9%;
9+
10+
--muted: 210 40% 96.1%;
11+
--muted-foreground: 215.4 16.3% 46.9%;
12+
13+
--popover: 0 0% 100%;
14+
--popover-foreground: 222.2 84% 4.9%;
15+
16+
--card: 0 0% 100%;
17+
--card-foreground: 222.2 84% 4.9%;
18+
19+
--border: 214.3 31.8% 91.4%;
20+
--input: 214.3 31.8% 91.4%;
21+
22+
--primary: 222.2 47.4% 11.2%;
23+
--primary-foreground: 210 40% 98%;
24+
25+
--secondary: 210 40% 96.1%;
26+
--secondary-foreground: 222.2 47.4% 11.2%;
27+
28+
--accent: 210 40% 96.1%;
29+
--accent-foreground: 222.2 47.4% 11.2%;
30+
31+
--destructive: 0 72.2% 50.6%;
32+
--destructive-foreground: 210 40% 98%;
33+
34+
--ring: 222.2 84% 4.9%;
35+
36+
--radius: 0.5rem;
37+
}
38+
39+
.dark {
40+
--background: 222.2 84% 4.9%;
41+
--foreground: 210 40% 98%;
42+
43+
--muted: 217.2 32.6% 17.5%;
44+
--muted-foreground: 215 20.2% 65.1%;
45+
46+
--popover: 222.2 84% 4.9%;
47+
--popover-foreground: 210 40% 98%;
48+
49+
--card: 222.2 84% 4.9%;
50+
--card-foreground: 210 40% 98%;
51+
52+
--border: 217.2 32.6% 17.5%;
53+
--input: 217.2 32.6% 17.5%;
54+
55+
--primary: 210 40% 98%;
56+
--primary-foreground: 222.2 47.4% 11.2%;
57+
58+
--secondary: 217.2 32.6% 17.5%;
59+
--secondary-foreground: 210 40% 98%;
60+
61+
--accent: 217.2 32.6% 17.5%;
62+
--accent-foreground: 210 40% 98%;
63+
64+
--destructive: 0 62.8% 30.6%;
65+
--destructive-foreground: 210 40% 98%;
66+
67+
--ring: 212.7 26.8% 83.9%;
68+
}
6969
}
70-
70+
7171
@layer base {
72-
* {
73-
@apply border-border;
74-
}
75-
body {
76-
@apply bg-background text-foreground;
77-
}
78-
}
72+
* {
73+
@apply border-border;
74+
}
75+
body {
76+
@apply bg-background text-foreground;
77+
}
78+
}
79+
80+
a {
81+
@apply text-blue-500 hover:underline;
82+
}
83+
84+
p {
85+
@apply text-muted-foreground;
86+
}

‎src/lib/components/home/AboutMe.svelte‎

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
<script lang="ts">
2+
</script>
3+
4+
<div class="space-y-2 p-6">
5+
<p class="text-2xl font-bold text-foreground">About me</p>
6+
<p>
7+
I'm a person who enjoys programming, maths, and physics. I also like playing the piano, working
8+
out, and reading (mainly philosophy books). What I enjoy the most with programming is the fact
9+
that I can build whatever I want given enough time. At the moment, I'm still in high school, and
10+
I plan on studying something related to computer science later on. Some of my projects are
11+
available on the <a href="/projects" class="text-blue-500 hover:underline">Projects</a>
12+
page, and most of them are on my
13+
<a href="https://github.com/Discusser" target="_blank" class="text-blue-500 hover:underline"
14+
>GitHub</a
15+
>
16+
page
17+
</p>
18+
</div>

‎src/lib/components/shared/Footer.svelte‎

Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
<script lang="ts">
2+
import { IconBrandGithub, IconMail } from '@tabler/icons-svelte';
3+
</script>
4+
5+
<hr />
6+
<div class="flex justify-around p-8">
7+
<p class="text-muted-foreground/50">Web page made by Discusser with Svelte</p>
8+
<div class="flex space-x-4">
9+
<a
10+
class="text-muted-foreground hover:text-muted-foreground/80"
11+
href="mailto:discussercodes@gmail.com"
12+
>
13+
<IconMail />
14+
</a>
15+
<a
16+
class="text-muted-foreground hover:text-muted-foreground/80"
17+
href="https://github.com/Discusser"
18+
>
19+
<IconBrandGithub />
20+
</a>
21+
</div>
22+
</div>

‎src/lib/components/shared/NavBar.svelte‎

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
<script lang="ts">
2+
</script>
3+
4+
<div class="flex justify-center space-x-8 p-4 *:text-foreground">
5+
<a href="/">Home</a>
6+
<a href="/projects">Projects</a>
7+
<a href="/blog">Blog</a>
8+
<a href="/contact">Contact</a>
9+
</div>
10+
<hr />

‎src/lib/components/ui/card/card-content.svelte‎

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
<script lang="ts">
2+
import type { HTMLAttributes } from "svelte/elements";
3+
import { cn } from "$lib/utils.js";
4+
5+
type $$Props = HTMLAttributes<HTMLDivElement>;
6+
7+
let className: $$Props["class"] = undefined;
8+
export { className as class };
9+
</script>
10+
11+
<div class={cn("p-6", className)} {...$$restProps}>
12+
<slot />
13+
</div>

‎src/lib/components/ui/card/card-description.svelte‎

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
<script lang="ts">
2+
import type { HTMLAttributes } from "svelte/elements";
3+
import { cn } from "$lib/utils.js";
4+
5+
type $$Props = HTMLAttributes<HTMLParagraphElement>;
6+
7+
let className: $$Props["class"] = undefined;
8+
export { className as class };
9+
</script>
10+
11+
<p class={cn("text-muted-foreground text-sm", className)} {...$$restProps}>
12+
<slot />
13+
</p>

‎src/lib/components/ui/card/card-footer.svelte‎

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
<script lang="ts">
2+
import type { HTMLAttributes } from "svelte/elements";
3+
import { cn } from "$lib/utils.js";
4+
5+
type $$Props = HTMLAttributes<HTMLDivElement>;
6+
7+
let className: $$Props["class"] = undefined;
8+
export { className as class };
9+
</script>
10+
11+
<div class={cn("flex items-center p-6 pt-0", className)} {...$$restProps}>
12+
<slot />
13+
</div>

‎src/lib/components/ui/card/card-header.svelte‎

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
<script lang="ts">
2+
import type { HTMLAttributes } from "svelte/elements";
3+
import { cn } from "$lib/utils.js";
4+
5+
type $$Props = HTMLAttributes<HTMLDivElement>;
6+
7+
let className: $$Props["class"] = undefined;
8+
export { className as class };
9+
</script>
10+
11+
<div class={cn("flex flex-col space-y-1.5 p-6 pb-0", className)} {...$$restProps}>
12+
<slot />
13+
</div>

0 commit comments

Comments
 (0)