Skip to content

Commit aeae890

Browse files
stormwarningstormwarning
committed
Update Resume layout and content
1 parent 91d9a6f commit aeae890

File tree

7 files changed

+87
-26
lines changed

7 files changed

+87
-26
lines changed

‎pnpm-lock.yaml‎

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

‎studio/package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@
1818
},
1919
"dependencies": {
2020
"@sanity/code-input": "4.1.4",
21-
"@sanity/icons": "3.2.0",
21+
"@sanity/icons": "3.7.0",
2222
"@sanity/vision": "3.45.0",
2323
"react": "18.3.1",
2424
"react-dom": "18.3.1",

‎studio/schemas/objects/work-experience.ts‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { ImageIcon } from '@sanity/icons'
1+
import { TimelineIcon } from '@sanity/icons'
22
import { defineArrayMember, defineField, defineType } from 'sanity'
33

44
import { decorators } from '../fields/inline'
@@ -7,7 +7,7 @@ export const workExperience = defineType({
77
name: 'work-experience',
88
title: 'Work experience',
99
type: 'object',
10-
icon: ImageIcon,
10+
icon: TimelineIcon,
1111
fields: [
1212
defineField({
1313
name: 'title',

‎studio/schemas/resume.ts‎

Lines changed: 33 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,30 @@
1-
import { DocumentIcon } from '@sanity/icons'
1+
import { DocumentIcon, UlistIcon } from '@sanity/icons'
22
import { defineArrayMember, defineField, defineType } from 'sanity'
33

44
import { decorators } from './fields/inline'
55
import { ledeField } from './fields/lede'
66
import { workExperience } from './objects/work-experience'
77

8+
const skillsGroup = defineType({
9+
name: 'skills-group',
10+
title: 'Skills group',
11+
type: 'object',
12+
icon: UlistIcon,
13+
fields: [
14+
defineField({
15+
name: 'title',
16+
title: 'Title',
17+
type: 'string',
18+
}),
19+
defineField({
20+
name: 'content',
21+
title: 'Content',
22+
type: 'array',
23+
of: [defineArrayMember({ type: 'block', marks: { decorators } })],
24+
}),
25+
],
26+
})
27+
828
export default defineType({
929
name: 'resume',
1030
title: 'Resume',
@@ -17,6 +37,12 @@ export default defineType({
1737
type: 'string',
1838
validation: (rule) => rule.required(),
1939
}),
40+
defineField({
41+
name: 'subtitle',
42+
title: 'Subtitle',
43+
type: 'string',
44+
validation: (rule) => rule.required(),
45+
}),
2046
defineField({
2147
name: 'slug',
2248
title: 'Slug',
@@ -35,5 +61,11 @@ export default defineType({
3561
type: 'array',
3662
of: [defineArrayMember(workExperience)],
3763
}),
64+
defineField({
65+
name: 'skills',
66+
title: 'Skills',
67+
type: 'array',
68+
of: [defineArrayMember(skillsGroup)],
69+
}),
3870
],
3971
})

‎www/src/routes/resume/+page.svelte‎

Lines changed: 36 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@ import ExperienceBlock from './experience-block.svelte'
1414
1515
/** @type {Props} */
1616
let { data } = $props()
17-
let { title, subtitle, lede, previousRoles } = $derived(data)
17+
let { title, subtitle, lede, previousRoles, skills } = $derived(data)
1818
</script>
1919

2020
<svelte:head>
@@ -32,13 +32,42 @@ let { title, subtitle, lede, previousRoles } = $derived(data)
3232
{/snippet}
3333
</PageIntro>
3434
<PageSection>
35-
<div class="prose flex flex-col gap-10">
36-
<Heading level={2}>Recent experience</Heading>
35+
<div class="flex flex-wrap items-start gap-16 lg:flex-nowrap lg:gap-[72px]">
36+
<div
37+
class="prose sticky flex flex-col gap-10 lg:top-[calc(11svb_+_1.5rem)]"
38+
>
39+
<Heading level={2}>Recent experience</Heading>
40+
</div>
41+
<div
42+
class="flex basis-[60ch] flex-col gap-16 text-base lg:mt-0 lg:gap-20 lg:text-lg"
43+
>
44+
{#each previousRoles as role}
45+
<ExperienceBlock {role} />
46+
{/each}
47+
</div>
3748
</div>
38-
<div class="mt-16 flex flex-col gap-4 lg:gap-20 xl:mt-[72px]">
39-
{#each previousRoles as role}
40-
<ExperienceBlock {role} />
41-
{/each}
49+
</PageSection>
50+
<PageSection>
51+
<div class="flex flex-wrap items-start gap-16 lg:flex-nowrap lg:gap-[72px]">
52+
<div
53+
class="prose sticky flex flex-col gap-10 lg:top-[calc(11svb_+_1.5rem)]"
54+
>
55+
<Heading level={2}>Relevant skills</Heading>
56+
</div>
57+
<div
58+
class="flex basis-[60ch] flex-col gap-12 text-base lg:mt-0 lg:gap-20 lg:text-lg"
59+
>
60+
{#each skills as group}
61+
<div class="prose">
62+
<h4
63+
class="leading-trim mb-6 text-lg font-medium text-white lg:text-xl"
64+
>
65+
{group.title}
66+
</h4>
67+
<PortableText value={group.content} />
68+
</div>
69+
{/each}
70+
</div>
4271
</div>
4372
</PageSection>
4473
</article>

‎www/src/routes/resume/experience-block.svelte‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -7,12 +7,12 @@ let { start, end, title, company, discipline, content } = $derived(role)
77
</script>
88

99
<article class="relative grid items-start gap-12">
10-
<header class="flex gap-2">
10+
<header class="flex items-start gap-2">
1111
<div class="flex basis-full flex-col gap-5">
12-
<h4 class="leading-trim text-lg font-medium">
13-
{title}, <em>{company}</em>
12+
<h4 class="leading-trim text-lg font-medium lg:text-xl">
13+
{title}, <em class="font-serif">{company}</em>
1414
</h4>
15-
<time class="text-grey-400 leading-trim font-medium"
15+
<time class="text-grey-400 leading-trim text-base font-medium lg:text-lg"
1616
><time>{start}</time> – <time>{end}</time></time
1717
>
1818
</div>
@@ -22,7 +22,7 @@ let { start, end, title, company, discipline, content } = $derived(role)
2222
{/each}
2323
</div>
2424
</header>
25-
<div class="prose lg:order-2">
25+
<div class="prose">
2626
<PortableText value={content} />
2727
</div>
2828
</article>

‎www/tailwind.config.cjs‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -70,7 +70,7 @@ const config = {
7070
'max-width': '65ch',
7171
},
7272

73-
p: {
73+
'p, li': {
7474
'text-wrap': 'pretty',
7575
},
7676

0 commit comments

Comments
 (0)