@ansiversa/components 0.0.124 → 0.0.125

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ansiversa/components",
3
- "version": "0.0.124",
3
+ "version": "0.0.125",
4
4
  "description": "Shared UI components and layouts for the Ansiversa ecosystem",
5
5
  "type": "module",
6
6
  "exports": {
@@ -93,7 +93,7 @@ const hasDeclaration = Boolean(declaration.text || declaration.place || declarat
93
93
  )}
94
94
 
95
95
  {projects.length > 0 && (
96
- <div class="mt-10">
96
+ <div class="mt-8">
97
97
  <h2 class="text-sm font-bold tracking-widest text-slate-900">PROJECTS</h2>
98
98
  <div class="mt-5 space-y-4">
99
99
  {projects.map((project) => (
@@ -14,6 +14,8 @@ const locationLabel =
14
14
  [basics.location?.city, basics.location?.country].filter(Boolean).join(", ");
15
15
 
16
16
  const contactLinks = buildContactEntries(basics, locationLabel);
17
+ const primaryContacts = contactLinks.filter((item) => item.kind === "email" || item.kind === "phone");
18
+ const secondaryContacts = contactLinks.filter((item) => item.kind !== "email" && item.kind !== "phone");
17
19
 
18
20
  const headlineLine = [basics.headline, locationLabel].filter(Boolean).join(" · ");
19
21
  const experienceItems = data.experience ?? [];
@@ -28,24 +30,37 @@ const hasDeclaration = Boolean(declaration.text || declaration.place || declarat
28
30
  <div class="resume-template av-print-white bg-slate-100 text-slate-900 print:bg-white">
29
31
  <main class="mx-auto max-w-4xl p-4 sm:p-6">
30
32
  <section class="rounded-2xl bg-white p-8 shadow-sm ring-1 ring-slate-200 sm:p-12 print:shadow-none print:ring-0">
31
- <header class="space-y-4">
32
- <div class="flex flex-col gap-4 sm:flex-row sm:items-start sm:justify-between">
33
+ <header class="space-y-3">
34
+ <div class="flex flex-col gap-3 sm:flex-row sm:items-start sm:justify-between">
33
35
  <div>
34
- <h1 class="text-4xl font-semibold tracking-tight">{basics.fullName}</h1>
36
+ <h1 class="text-4xl font-bold tracking-tight text-slate-950">{basics.fullName}</h1>
35
37
  {headlineLine && <p class="mt-2 text-sm text-slate-600">{headlineLine}</p>}
36
38
  </div>
37
39
  {contactLinks.length > 0 && (
38
40
  <div class="text-sm text-slate-700 sm:max-w-[18rem] sm:border-l sm:border-slate-200 sm:pl-4 sm:text-right">
39
- <div class="flex flex-col gap-1">
40
- {contactLinks.map((item) => (
41
+ <div class="flex flex-col gap-1.5">
42
+ {primaryContacts.map((item) => (
41
43
  item.href ? (
42
- <a class="underline underline-offset-4 hover:text-slate-900 print:no-underline" href={item.href}>
44
+ <a class="font-semibold text-slate-900 underline underline-offset-4 hover:text-slate-900 print:no-underline" href={item.href}>
43
45
  {item.label}
44
46
  </a>
45
47
  ) : (
46
- <div>{item.label}</div>
48
+ <div class="font-semibold text-slate-900">{item.label}</div>
47
49
  )
48
50
  ))}
51
+ {secondaryContacts.length > 0 && (
52
+ <div class="pt-1 text-xs text-slate-600">
53
+ {secondaryContacts.map((item) => (
54
+ item.href ? (
55
+ <a class="underline underline-offset-4 hover:text-slate-800 print:no-underline" href={item.href}>
56
+ {item.label}
57
+ </a>
58
+ ) : (
59
+ <div>{item.label}</div>
60
+ )
61
+ ))}
62
+ </div>
63
+ )}
49
64
  </div>
50
65
  </div>
51
66
  )}
@@ -56,10 +71,10 @@ const hasDeclaration = Boolean(declaration.text || declaration.place || declarat
56
71
  )}
57
72
  </header>
58
73
 
59
- <div class="my-10 h-px bg-slate-200"></div>
74
+ <div class="my-8 h-px bg-slate-200"></div>
60
75
 
61
- <div class="grid gap-10 lg:grid-cols-12">
62
- <div class="space-y-10 lg:col-span-8">
76
+ <div class="grid gap-8 lg:grid-cols-12">
77
+ <div class="space-y-8 lg:col-span-8">
63
78
  {experienceItems.length > 0 && (
64
79
  <section>
65
80
  <h2 class="text-xs font-semibold tracking-[0.25em] text-slate-500">EXPERIENCE</h2>
@@ -94,9 +109,9 @@ const hasDeclaration = Boolean(declaration.text || declaration.place || declarat
94
109
  {projects.length > 0 && (
95
110
  <section>
96
111
  <h2 class="text-xs font-semibold tracking-[0.25em] text-slate-500">PROJECTS</h2>
97
- <div class="mt-6 space-y-5">
112
+ <div class="mt-5 space-y-4">
98
113
  {projects.map((project) => (
99
- <article class="rounded-xl border border-slate-200 p-5">
114
+ <article class="rounded-xl border border-slate-200 p-4">
100
115
  <div class="flex items-baseline justify-between gap-3">
101
116
  {project.link ? (
102
117
  <a class="text-base font-semibold underline underline-offset-4" href={project.link}>
@@ -132,18 +147,20 @@ const hasDeclaration = Boolean(declaration.text || declaration.place || declarat
132
147
  )}
133
148
  </div>
134
149
 
135
- <aside class="space-y-10 lg:col-span-4">
150
+ <aside class="space-y-8 lg:col-span-4">
136
151
  {skills.length > 0 && (
137
152
  <section>
138
153
  <h2 class="text-xs font-semibold tracking-[0.25em] text-slate-500">SKILLS</h2>
139
154
  {showSkillsAs === "chips" ? (
140
- <div class="mt-5 flex flex-wrap gap-2 text-sm text-slate-700">
141
- {skills.map((skill) => (
142
- <span class="rounded-full bg-slate-100 px-3 py-1 text-xs">{skill.name}</span>
155
+ <div class="mt-4 text-sm text-slate-700 leading-6">
156
+ {skills.map((skill, index) => (
157
+ <span>
158
+ {skill.name}{index < skills.length - 1 ? " · " : ""}
159
+ </span>
143
160
  ))}
144
161
  </div>
145
162
  ) : (
146
- <div class="mt-5 space-y-3 text-sm text-slate-700">
163
+ <div class="mt-4 space-y-2 text-sm text-slate-700">
147
164
  {skills.map((skill) => (
148
165
  <div class="flex items-center justify-between">
149
166
  <span>{skill.name}</span>
@@ -194,8 +211,8 @@ const hasDeclaration = Boolean(declaration.text || declaration.place || declarat
194
211
 
195
212
  {hasDeclaration && (
196
213
  <>
197
- <div class="my-6 h-px bg-slate-200"></div>
198
- <section class="av-print-avoid-break rounded-xl border border-slate-200 p-4 space-y-3">
214
+ <div class="my-8 h-px bg-slate-200"></div>
215
+ <section class="av-print-avoid-break space-y-3">
199
216
  <h2 class="text-xs font-semibold tracking-[0.25em] text-slate-500">DECLARATION</h2>
200
217
  {declaration.text && (
201
218
  <p class="text-sm leading-7 text-slate-700">{declaration.text}</p>