Ryan/Reactive-Resume
1
0
Fork 0
mirror of https://github.com/AmruthPillai/Reactive-Resume.git synced 2026-07-11 05:24:59 +10:00
Code Issues Packages Projects Releases Wiki Activity

refactor: update layout of resume items for better alignment and spacing

Browse Source
This commit is contained in:
Amruth Pillai
2026-04-04 12:21:05 +02:00
parent 923f5f6173
commit 10d58175f1
7 changed files with 18 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/resume/shared/items/awards-item.tsx
+2 -2
View File
@@ -45,9 +45,9 @@ export function AwardsItem({ className, ...item }: AwardsItemProps) {
<div className={cn("awards-item", className)}>
{/* Header */}
<div className="section-item-header awards-item-header">
<div className="grid grid-cols-2 items-start gap-x-2">
<div className="grid grid-cols-2 items-start justify-between gap-x-2">
{headerFields.map((field, index) => (
<div key={field.key} className={cn(index % 2 === 1 && "shrink-0 justify-self-end text-end")}>
<div key={field.key} className={cn(index % 2 === 1 && "text-end whitespace-nowrap")}>
{field.content}
</div>
))}
src/components/resume/shared/items/certifications-item.tsx
+2 -2
View File
@@ -45,9 +45,9 @@ export function CertificationsItem({ className, ...item }: CertificationsItemPro
<div className={cn("certifications-item", className)}>
{/* Header */}
<div className="section-item-header certifications-item-header">
<div className="grid grid-cols-2 items-start gap-x-2">
<div className="grid grid-cols-2 items-start justify-between gap-x-2">
{headerFields.map((field, index) => (
<div key={field.key} className={cn(index % 2 === 1 && "shrink-0 justify-self-end text-end")}>
<div key={field.key} className={cn(index % 2 === 1 && "text-end whitespace-nowrap")}>
{field.content}
</div>
))}
src/components/resume/shared/items/education-item.tsx
+2 -2
View File
@@ -52,9 +52,9 @@ export function EducationItem({ className, ...item }: EducationItemProps) {
<div className={cn("education-item", className)}>
{/* Header */}
<div className="section-item-header education-item-header mb-2">
<div className="grid grid-cols-2 items-start gap-x-2">
<div className="grid grid-cols-2 items-start justify-between gap-x-2">
{headerFields.map((field, index) => (
<div key={field.key} className={cn(index % 2 === 1 && "shrink-0 justify-self-end text-end")}>
<div key={field.key} className={cn(index % 2 === 1 && "text-end whitespace-nowrap")}>
{field.content}
</div>
))}
src/components/resume/shared/items/experience-item.tsx
+6 -6
View File
@@ -51,9 +51,9 @@ export function ExperienceItem({ className, ...item }: ExperienceItemProps) {
<div className={cn("experience-item", className)}>
{/* Header */}
<div className="section-item-header experience-item-header">
<div className="grid grid-cols-2 items-start gap-x-2">
<div className="grid grid-cols-2 items-start justify-between gap-x-2">
{headerFields.map((field, index) => (
<div key={field.key} className={cn(index % 2 === 1 && "shrink-0 justify-self-end text-end")}>
<div key={field.key} className={cn(index % 2 === 1 && "text-end whitespace-nowrap")}>
{field.content}
</div>
))}
@@ -65,11 +65,11 @@ export function ExperienceItem({ className, ...item }: ExperienceItemProps) {
<div className="experience-item-roles mt-0 flex flex-col gap-y-1">
{item.roles.map((role) => (
<div key={role.id} className="experience-item-role">
<div className="flex items-start justify-between gap-x-2">
<span className="section-item-metadata experience-item-role-position">{role.position}</span>
<span className="section-item-metadata experience-item-role-period shrink-0 justify-self-end text-end">
<div className="grid grid-cols-2 items-start justify-between gap-x-2">
<div className="section-item-metadata experience-item-role-position">{role.position}</div>
<div className="section-item-metadata experience-item-role-period text-end whitespace-nowrap">
{role.period}
</span>
</div>
</div>
{stripHtml(role.description) && (
src/components/resume/shared/items/publications-item.tsx
+2 -2
View File
@@ -45,9 +45,9 @@ export function PublicationsItem({ className, ...item }: PublicationsItemProps)
<div className={cn("publications-item", className)}>
{/* Header */}
<div className="section-item-header publications-item-header">
<div className="grid grid-cols-2 items-start gap-x-2">
<div className="grid grid-cols-2 items-start justify-between gap-x-2">
{headerFields.map((field, index) => (
<div key={field.key} className={cn(index % 2 === 1 && "shrink-0 justify-self-end text-end")}>
<div key={field.key} className={cn(index % 2 === 1 && "text-end whitespace-nowrap")}>
{field.content}
</div>
))}
src/components/resume/shared/items/references-item.tsx
+2 -2
View File
@@ -40,9 +40,9 @@ export function ReferencesItem({ className, ...item }: ReferencesItemProps) {
<div className={cn("references-item", className)}>
{/* Header */}
<div className="section-item-header references-item-header">
<div className="grid grid-cols-2 items-start gap-x-2">
<div className="grid grid-cols-2 items-start justify-between gap-x-2">
{headerFields.map((field, index) => (
<div key={field.key} className={cn(index % 2 === 1 && "shrink-0 justify-self-end text-end")}>
<div key={field.key} className={cn(index % 2 === 1 && "text-end whitespace-nowrap")}>
{field.content}
</div>
))}
src/components/resume/shared/items/volunteer-item.tsx
+2 -2
View File
@@ -45,9 +45,9 @@ export function VolunteerItem({ className, ...item }: VolunteerItemProps) {
<div className={cn("volunteer-item", className)}>
{/* Header */}
<div className="section-item-header volunteer-item-header">
<div className="grid grid-cols-2 items-start gap-x-2">
<div className="grid grid-cols-2 items-start justify-between gap-x-2">
{headerFields.map((field, index) => (
<div key={field.key} className={cn(index % 2 === 1 && "shrink-0 justify-self-end text-end")}>
<div key={field.key} className={cn(index % 2 === 1 && "text-end whitespace-nowrap")}>
{field.content}
</div>
))}