webstackdev
diff --git a/‎public/pdf/resume.pdf‎
370 KB b/‎public/pdf/resume.pdf‎
370 KB
diff --git a/‎src/components/Pages/Resume/index.astro‎
Lines changed: 13 additions & 8 deletions b/‎src/components/Pages/Resume/index.astro‎
Lines changed: 13 additions & 8 deletions
diff --git a/‎src/components/Pages/Resume/partials/Controls.astro‎
Lines changed: 1 addition & 1 deletion b/‎src/components/Pages/Resume/partials/Controls.astro‎
Lines changed: 1 addition & 1 deletion
diff --git a/‎src/components/Pages/Resume/partials/Experience.astro‎
Lines changed: 11 additions & 5 deletions b/‎src/components/Pages/Resume/partials/Experience.astro‎
Lines changed: 11 additions & 5 deletions
diff --git a/‎src/components/Pages/Resume/partials/Socials.astro‎
Lines changed: 2 additions & 2 deletions b/‎src/components/Pages/Resume/partials/Socials.astro‎
Lines changed: 2 additions & 2 deletions
@@ -41,13 +41,18 @@ const {
 >
   <head>
     <HeadContent pageTitle={pageTitle} pageDescription={pageDescription} path={path} />
+    <style>
+      @page {
+        margin: 2cm;
+      }
+    </style>
   </head>
   <body
     itemtype="http://schema.org/Person"
     class="h-auto min-h-full overflow-y-auto text-content font-sans leading-6 [font-smoothing:antialiased] md:flex md:justify-center print:bg-white"
   >
     {/** Use wrapper to keep resume centered on desktop */}
-    <div class="relative bg-primary-inverse mx-auto w-full max-w-4xl p-6 md:p-12 my-14 lg:p-16 md:shadow-xl print:shadow-none">
+    <div class="relative bg-primary-inverse mx-auto w-full max-w-4xl p-6 md:p-12 my-14 lg:p-16 md:shadow-xl print:shadow-none print:p-0 print:my-0">
       <header
         itemscope
         itemref="resumeSubject"
@@ -57,7 +62,7 @@ const {
           <Controls />
         </div>
 
-        <div class="">
+        <div>
           <Persona
             givenName={resume.firstName}
             familyName={resume.lastName}
@@ -68,29 +73,29 @@ const {
         <div class="mt-2!">
           <Contact
             contactData={contactData}
-            email={contactData.company.email}
+            email={`info@webstackbuilders.com`}
           />
         </div>
       </header>
 
       <main class="space-y-4!">
-        <div class="">
+        <div>
           <Summary summary={resume.summary} />
         </div>
 
-        <div class="">
+        <div>
           <Experience renderedClients={renderedClients} />
         </div>
 
-        <div class="">
+        <div>
           <Skills skills={resume.skills} />
         </div>
 
-        <div class="">
+        <div>
           <Languages languages={resume.languages} />
         </div>
 
-        <div class="">
+        <div>
           <Socials socials={contactData.company.social} />
         </div>
       </main>
 
@@ -8,7 +8,7 @@ import Tooltip from '@components/Tooltip/index.astro'
     <Tooltip text="Download PDF">
       <a
         class="inline-flex h-7 w-7 items-center justify-center text-gray-600 hover:text-gray-400 transition-colors duration-200"
-        href="pdf/resume.pdf"
+        href="/pdf/resume.pdf"
         aria-label="Download PDF"
       >
         <Icon icon="download" color="inherit" size={7} />
 
@@ -16,14 +16,17 @@ const { renderedClients } = Astro.props as Props
   <h2 class="text-sm font-mono font-bold tracking-widest text-content-offset print:text-content uppercase p-3 border-2 border-dashed border-gray-400 rounded-md">
     Past Clients
   </h2>
-  <div class="mt-4!">
+  <ul class="mt-4!">
     {
       renderedClients.map(({ client, Content }: RenderedClient, index: number) => {
         const location = splitLocation(client.data.location)
         return (
-          <div
+          <li
             id={`experienceItem-${index + 1}`}
-            class="flex flex-col gap-1.5 pb-4 mb-4 border-b-2 border-dashed border-gray-400 last:border-b-0 last:pb-0 last:mb-0"
+            class:list={[
+              'flex flex-col gap-1.5 print:block print:space-y-1.5 print:break-inside-auto mb-6 last:mb-0',
+              { 'print:break-before-page': index === renderedClients.length - 1 },
+            ]}
             itemprop="worksFor"
             itemscope
             itemref="resumeSubject"
@@ -88,9 +91,12 @@ const { renderedClients } = Astro.props as Props
             <div class="experienceDetailContent" itemprop="description">
               <Content components={{ List, ListItem }} />
             </div>
-          </div>
+            {index < renderedClients.length - 1 && (
+              <div aria-hidden="true" class="mt-4 border-b-2 border-dashed border-gray-400"></div>
+            )}
+          </li>
         )
       })
     }
-  </div>
+  </ul>
 </section>
@@ -11,7 +11,7 @@ const { socials } = Astro.props as Props
 
 <section
   id="socialSection"
-  class="mt-8 print:mt-6 print:hidden"
+  class="mt-8 print:mt-6"
   itemscope
   itemref="resumeSubject"
   itemtype="http://schema.org/ItemList"
@@ -37,7 +37,7 @@ const { socials } = Astro.props as Props
               href={entry.url}
             >
               <span class="mt-1">
-                <Icon icon={entry.iconName} color="content" size={8} />
+                <Icon icon={entry.iconName} color="trim" size={8} />
               </span>
               <span class="flex flex-col leading-5">
                 <div
Original file line number	Diff line number	Diff line change
`@@ -8,7 +8,7 @@ import Tooltip from '@components/Tooltip/index.astro'`
`8`	`8`	`<Tooltip text="Download PDF">`
`9`	`9`	`<a`
`10`	`10`	`class="inline-flex h-7 w-7 items-center justify-center text-gray-600 hover:text-gray-400 transition-colors duration-200"`
`11`		`- href="pdf/resume.pdf"`
	`11`	`+ href="/pdf/resume.pdf"`
`12`	`12`	`aria-label="Download PDF"`
`13`	`13`	`>`
`14`	`14`	`<Icon icon="download" color="inherit" size={7} />`