Skip to content

Commit 5b32ae7

Browse files
committed
More pages, and begin migrating to shadcn svelte 5
1 parent abfae75 commit 5b32ae7

File tree

29 files changed

+457
-236
lines changed

29 files changed

+457
-236
lines changed

components.json

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
{
2-
"$schema": "https://shadcn-svelte.com/schema.json",
2+
"$schema": "https://next.shadcn-svelte.com/schema.json",
33
"style": "default",
44
"tailwind": {
55
"config": "tailwind.config.ts",
@@ -14,4 +14,4 @@
1414
},
1515
"typescript": true,
1616
"registry": "https://next.shadcn-svelte.com/registry"
17-
}
17+
}

package.json

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -47,6 +47,7 @@
4747
"dependencies": {
4848
"@tabler/icons-svelte": "^3.21.0",
4949
"@tanstack/table-core": "^8.20.5",
50-
"path-browserify": "^1.0.1"
50+
"path-browserify": "^1.0.1",
51+
"tailwindcss-animate": "^1.0.7"
5152
}
5253
}

pnpm-lock.yaml

Lines changed: 12 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: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -123,3 +123,7 @@ ul {
123123
code {
124124
@apply bg-secondary p-0.5;
125125
}
126+
127+
pre {
128+
@apply text-wrap;
129+
}

src/lib/components/hobbies/BooksTable.svelte

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,7 @@
1616
});
1717
</script>
1818

19-
<div class="h-96 overflow-scroll">
19+
<div class="max-h-96 overflow-scroll">
2020
<Table.Root>
2121
<Table.Header>
2222
<Table.Row class="text-base *:font-displayBold">
Lines changed: 19 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -1,27 +1,23 @@
11
<script lang="ts">
2-
import { books } from '$lib/constants/books';
2+
import { pieces } from '$lib/constants/piano-pieces';
33
import * as Table from '$lib/components/ui/table';
44
</script>
55

6-
<!-- <div class="h-96 overflow-scroll"> -->
7-
<!-- <Table.Root> -->
8-
<!-- <Table.Header> -->
9-
<!-- <Table.Row class="text-base *:font-displayBold"> -->
10-
<!-- <Table.Head>Thumbnail</Table.Head> -->
11-
<!-- <Table.Head>Name</Table.Head> -->
12-
<!-- <Table.Head>Author</Table.Head> -->
13-
<!-- <Table.Head>Rating</Table.Head> -->
14-
<!-- </Table.Row> -->
15-
<!-- </Table.Header> -->
16-
<!-- <Table.Body> -->
17-
<!-- {#each books as book (book.name)} -->
18-
<!-- <Table.Row> -->
19-
<!-- <Table.Cell></Table.Cell> -->
20-
<!-- <Table.Cell>{book.name}</Table.Cell> -->
21-
<!-- <Table.Cell>{book.author}</Table.Cell> -->
22-
<!-- <Table.Cell>{book.rating}</Table.Cell> -->
23-
<!-- </Table.Row> -->
24-
<!-- {/each} -->
25-
<!-- </Table.Body> -->
26-
<!-- </Table.Root> -->
27-
<!-- </div> -->
6+
<div class="max-h-96 overflow-scroll">
7+
<Table.Root>
8+
<Table.Header>
9+
<Table.Row class="text-base *:font-displayBold">
10+
<Table.Head>Name</Table.Head>
11+
<Table.Head>Composer</Table.Head>
12+
</Table.Row>
13+
</Table.Header>
14+
<Table.Body>
15+
{#each pieces as piece (piece.name)}
16+
<Table.Row>
17+
<Table.Cell>{piece.name}</Table.Cell>
18+
<Table.Cell>{piece.composer}</Table.Cell>
19+
</Table.Row>
20+
{/each}
21+
</Table.Body>
22+
</Table.Root>
23+
</div>
Lines changed: 36 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,36 @@
1+
<script lang="ts">
2+
import type { Project } from '$lib/constants/projects';
3+
import { getGithubURLForProject } from '$lib/utils/index';
4+
import { IconBrandGithub } from '@tabler/icons-svelte';
5+
import type { Snippet } from 'svelte';
6+
import { twMerge } from 'tailwind-merge';
7+
import { Button } from '$lib/components/ui/button';
8+
9+
const {
10+
children,
11+
project,
12+
class: className,
13+
...restProps
14+
}: {
15+
children?: Snippet;
16+
project: Project;
17+
class?: string;
18+
} = $props();
19+
</script>
20+
21+
<div class={twMerge('flex flex-col space-y-4', className)} {...restProps}>
22+
<div class="flex items-center space-x-4">
23+
<p class=" text-2xl font-bold text-foreground">
24+
{project.label}
25+
</p>
26+
{#if project.hasGithub}
27+
<Button href={getGithubURLForProject(project)} variant="outline" size="icon">
28+
<IconBrandGithub />
29+
</Button>
30+
{/if}
31+
</div>
32+
33+
{#if children}
34+
{@render children()}
35+
{/if}
36+
</div>

src/lib/components/projects/ProjectsTable.svelte

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@
1717
});
1818
</script>
1919

20-
<div class="h-96 overflow-scroll">
20+
<div class="max-h-96 overflow-scroll">
2121
<Table.Root>
2222
<Table.Header>
2323
{#each table.getHeaderGroups() as headerGroup (headerGroup.id)}

src/lib/components/shared/Image.svelte

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -11,18 +11,18 @@
1111
...restProps
1212
}: {
1313
alt?: string;
14-
width: string;
15-
height: string;
14+
width?: string;
15+
height?: string;
1616
class?: string;
1717
} & HTMLImgAttributes = $props();
1818
1919
let loading: boolean = $state(true);
2020
</script>
2121

22-
<div class="h-full space-y-2 text-center">
22+
<div class="h-full w-full space-y-2 text-center">
2323
<div
2424
class="h-full w-full"
25-
style="{width ? 'width:' + width + 'px;' : ''}{height ? 'height:' + height + 'px;' : ''}"
25+
style="{width ? 'width:' + width + ';' : ''}{height ? 'height:' + height + ';' : ''}"
2626
>
2727
<Skeleton class="h-full w-full {!loading ? 'hidden' : ''}" />
2828
<img
@@ -33,7 +33,7 @@
3333
{...restProps}
3434
{alt}
3535
class={twMerge(
36-
'flex h-full w-full items-center justify-center rounded-sm border-2 border-foreground/30 bg-secondary/50 hover:border-foreground/40 hover:bg-secondary/60',
36+
'flex h-full w-full items-center justify-center rounded-sm hover:bg-secondary/20',
3737
className,
3838
loading ? 'hidden' : ''
3939
)}

src/lib/components/shared/Video.svelte

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@
2424
controls
2525
{src}
2626
class={twMerge(
27-
'flex h-full w-full items-center justify-center rounded-sm border-2 border-foreground/30 bg-secondary/50 hover:border-foreground/40 hover:bg-secondary/60',
27+
'flex h-full w-full items-center justify-center rounded-sm hover:bg-secondary/20',
2828
className
2929
)}
3030
>

0 commit comments

Comments
 (0)