design nosepass template, add tests, add template previews

This commit is contained in:
Amruth Pillai
2023-11-17 08:31:12 +01:00
parent 0b4cb71320
commit 34247f13b6
92 changed files with 24440 additions and 35518 deletions

View File

@ -82,7 +82,7 @@ const Summary = () => {
return (
<section id={section.id}>
<h4 className="mb-2 border-b pb-0.5 text-sm font-bold uppercase">{section.name}</h4>
<h4 className="mb-2 border-b pb-0.5 text-sm font-bold">{section.name}</h4>
<div
className="wysiwyg"
@ -154,10 +154,10 @@ const Section = <T,>({
return (
<section id={section.id} className="grid">
<h4 className="mb-2 border-b pb-0.5 text-sm font-bold uppercase">{section.name}</h4>
<h4 className="mb-2 border-b pb-0.5 text-sm font-bold">{section.name}</h4>
<div
className="grid gap-3"
className="grid gap-x-6 gap-y-3"
style={{ gridTemplateColumns: `repeat(${section.columns}, 1fr)` }}
>
{section.items
@ -170,18 +170,18 @@ const Section = <T,>({
return (
<div key={item.id} className={cn("space-y-2", className)}>
<div className="leading-snug">
<div>
{children?.(item as T)}
{url && <Link url={url} />}
{url !== undefined && <Link url={url} />}
</div>
{summary && !isEmptyString(summary) && (
{summary !== undefined && !isEmptyString(summary) && (
<div className="wysiwyg" dangerouslySetInnerHTML={{ __html: summary }} />
)}
{level && level > 0 && <Rating level={level} />}
{level !== undefined && level > 0 && <Rating level={level} />}
{keywords && keywords.length > 0 && (
{keywords !== undefined && keywords.length > 0 && (
<p className="text-sm">{keywords.join(", ")}</p>
)}
</div>
@ -199,7 +199,7 @@ const Profiles = () => {
return (
<Section<Profile> section={section}>
{(item) => (
<div className="leading-snug">
<div>
{isUrl(item.url.href) ? (
<Link
url={item.url}
@ -317,7 +317,7 @@ const Skills = () => {
return (
<Section<Skill> section={section} levelKey="level" keywordsKey="keywords">
{(item) => (
<div className="leading-tight">
<div>
<div className="font-bold">{item.name}</div>
<div>{item.description}</div>
</div>
@ -383,11 +383,11 @@ const Languages = () => {
const section = useArtboardStore((state) => state.resume.sections.languages);
return (
<Section<Language> section={section} levelKey="fluencyLevel">
<Section<Language> section={section} levelKey="level">
{(item) => (
<div className="space-y-0.5">
<div className="font-bold">{item.name}</div>
<div>{item.fluency}</div>
<div>{item.description}</div>
</div>
)}
</Section>