refactor!: nuke unnecessary features (#42)

I'm not even going to try to document what changed here. So much of this was built as a learning exercise, but now I just want a simple, responsive, print/ATS friendly resume. No more grids, no more plain-text output; just simple HTML and CSS. Software is an asset. Code is a liability.
cjshearer · Feb 13, 2024 · b188cfb · b188cfb
1 parent cd1d6f6
commit b188cfb
Show file tree

Hide file tree

Showing 24 changed files with 106 additions and 366 deletions.
diff --git a/assets/css/main.css b/assets/css/main.css
@@ -4,11 +4,7 @@
 
 @layer base {
   body {
-    /* TODO(cjshearer): remove when we update to tailwind >= v3.4.0
-    https://github.com/tailwindlabs/tailwindcss/pull/12299 */
-    -webkit-tap-highlight-color: transparent;
-
-    @apply prose prose-sm prose-resume font-[Roboto,_sans-serif] dark:prose-invert;
+    @apply prose prose-sm prose-neutral prose-resume font-[Roboto_Flex,_sans-serif] dark:prose-invert;
     @apply dark:bg-neutral-800;
   }
 
@@ -29,19 +25,12 @@
     @apply after:absolute after:top-0 after:block after:h-full after:w-full after:rounded-full after:[box-shadow:inset_0_0_20px_0_theme(colors.neutral.800)] dark:after:[box-shadow:inset_0_0_20px_0_theme(colors.neutral.500)];
   }
 
-  .button {
-    @apply relative flex h-12 w-12 items-center justify-center rounded-full;
-
-    /* before */
-    @apply before:absolute before:left-0 before:top-0 before:-z-10 before:h-full before:w-full before:scale-90 before:rounded-full before:duration-[250ms] before:[box-shadow:inset_0_0_0_0.125rem_currentColor] dark:before:[box-shadow:inset_0_0_0_3rem_currentColor];
-
-    /* hover:before */
-    @apply hover:before:scale-100 hover:before:[box-shadow:inset_0_0_0_3rem_currentColor] dark:hover:before:[box-shadow:inset_0_0_0_0.125rem_currentColor];
-
-    /* svg */
-    @apply [&_svg]:inline [&_svg]:h-[58%] [&_svg]:w-[58%] [&_svg]:fill-current [&_svg]:text-inherit [&_svg]:transition-colors dark:[&_svg]:text-neutral-800;
-
-    /* hover:svg */
-    @apply [&_svg]:hover:text-white dark:[&_svg]:hover:text-inherit;
+  .inline-svg {
+    @apply inline-block [&_svg]:inline-block [&_svg]:h-[1em] [&_svg]:w-[1em] [&_svg]:fill-current [&_svg]:align-[calc(0.5cap-0.5em)];
   }
 }
+
+@page {
+  margin: 3rem;
+  margin-bottom: 1.5rem;
+}
diff --git a/content/_index.md b/content/_index.md
@@ -1,91 +1,83 @@
 ---
-outputs: [html, txt]
-dateformat:
-  short: Jan. 2006
-  long: January 2006
-title: Resume
+title: Software Developer
+description: Full Stack Software Developer Resume
 faviconText: 💼
-skills:
-  - languages:
-      - TypeScript
-      - JavaScript
-      - HTML
-      - CSS
-      - Golang
-      - Node.js
-      - SQL
-      - Rust
-      - Python
-      - Java
-      - C++
-  - frameworks:
-      - React
-      - React-Native
-      - Vue
-      - Nuxt
-      - Hugo
-      - TailwindCSS
-      - Storybook
-  - concepts:
-      - Agile (Scrum)
-      - RESTful APIs
-      - Material Design
-      - Cloud Native
-      - GitOps
-      - CI/CD
-  - tools:
-      - Git
-      - Linux
-      - Docker
-      - Tailscale
-      - Postman
-  - databases:
-      - MySQL
-      - PostgreSQL
-      - MongoDB
-  - services:
-      - Auth0
-      - LogRocket
-      - Sentry
-      - Stripe
-      - SendGrid
 ---
 
-{{<header class="text-center md:text-left">}}
-
-# Cody Shearer
-
-Software Developer with 3 Years of Experience in Full Stack Web and Mobile Development
-{class="font-light mb-2"}
-
-[![GitHub: github.com/cjshearer](svgs/brands/github.svg)](https://github.com/cjshearer "GitHub")
-[![LinkedIn: cjshearer.dev](svgs/brands/linkedin.svg)](https://linkedin.com/in/cjshearer "LinkedIn")
-[![Email: cjshearer@live.com](svgs/solid/envelope.svg)](mailto:cjshearer@live.com "Email")
-{class="[&>*]:button [&>*]:inline-flex [&>*]:mr-1 md:hidden"}
-
-{{</header>}}
-
-{{<aside class="not-prose gap-4">}}
+<header class="mb-4 text-center md:text-left print:text-left">
 
 ![](avatar.jpg "A close-up photo of me wearing a suit and tie")
-{class="avatar w-24" sizes="256"}
+{ class="avatar not-prose float-right hidden h-24 print:hidden md:block" sizes="256"}
 
-[![](svgs/brands/github.svg) GitHub](https://github.com/cjshearer)
-[![](svgs/brands/linkedin.svg) LinkedIn](https://linkedin.com/in/cjshearer)
-[![](svgs/solid/envelope.svg) Email](mailto:cjshearer@live.com)
-{class="[&_a]:mb-2 [&_a]:inline-flex [&_a]:items-center last-of-type:[&_a]:mb-0 [&_svg]:mx-1 [&_svg]:h-[1em] [&_svg]:w-[1em] [&_svg]:fill-current"}
-
-{{<skills layout="vertical">}}
-
-{{</aside>}}
+# Cody Shearer
 
-{{<main>}}
+Software Developer with 3 Years of Experience in Full Stack Web and Mobile Development
+{ class="mb-2"}
+
+<!-- prettier-ignore -->
+- [![](svgs/brands/github.svg)cjshearer](https://github.com/cjshearer "My GithHub")
+- [![](svgs/brands/linkedin.svg)in/cjshearer](https://linkedin.com/in/cjshearer "My LinkedIn")
+- [![](svgs/solid/house.svg)cjshearer.dev](https://cjshearer.dev "My Website")
+- [![](svgs/solid/envelope.svg)cjshearer@live.com](mailto:cjshearer@live.com "My Email")
+{ class="not-prose [&>*]:inline-svg inline-flex w-fit flex-wrap justify-center gap-4 whitespace-nowrap [&_svg]:mr-1"}
+
+</header>
+
+<main class="[&>*:is(h2,h3,p)]:break-after-avoid-page [&>*:is(p,ul)]:break-inside-avoid-page">
+
+## Skills {class="md:hidden"}
+
+<!-- prettier-ignore -->
+- Languages:
+    - TypeScript
+    - JavaScript
+    - HTML
+    - CSS
+    - Golang
+    - Node.js
+    - SQL
+    - Rust
+    - Python
+    - Java
+    - C++
+- Frameworks:
+    - React
+    - React-Native
+    - Vue
+    - Nuxt
+    - Hugo
+    - TailwindCSS
+    - Storybook
+- Concepts:
+    - Agile (Scrum)
+    - RESTful APIs
+    - Material Design
+    - Cloud Native
+    - GitOps
+    - CI/CD
+- Tools:
+    - Git
+    - Linux
+    - Docker
+    - Tailscale
+    - Postman
+- Databases:
+    - MySQL
+    - PostgreSQL
+    - MongoDB
+- Services:
+    - Auth0
+    - LogRocket
+    - Sentry
+    - Stripe
+    - SendGrid
+{ class="table pl-0 md:float-right md:block print:md:float-none print:md:table [&>li>*]:table-cell md:[&>li>*]:block print:md:[&>li>*]:table-cell [&>li>ul>li]:inline md:[&>li>ul>li]:block print:md:[&>li>ul>li]:inline [&>li>ul]:list-none md:[&>li>ul]:list-disc [&>li]:table-row"}
 
 ## Experience
 
 ### Software Developer – Full Stack, Krumware
 
-{{<date-range start="2021-03-29" end="2023-10-20">}}
+March 2021 to October 2023
 
 - Collaborated in cross-functional team following agile (scrum) methodologies
 - Improved time-to-market by up to 20% with project templates
@@ -113,15 +105,15 @@ Project Highlights:
 
 ### Research Assistant, AI and Systems Laboratory
 
-{{<date-range start="2020-08-01" end="2021-04-01">}}
+August 2020 to April 2021
 
 - Analyzed cross-platform performance behavior of deep-learning recommender system
 - Reproduced results from past research on highly configurable systems
 - Researched relevant works on causal inference and machine learning
 
 ### Software Developer – Intern, Velocity
 
-{{<date-range start="2018-06-01" end="2018-08-01">}}
+June 2018 to August 2018
 
 - Created AWS storage primitive abstracting cloud complexity for high level orchestration
 - Developed storage optimization solution for Amazon Elastic Block Storage
@@ -130,25 +122,17 @@ Project Highlights:
 
 ### BS Computer Science, University of South Carolina
 
-{{<date-range start="2017-08-17" end="2021-05-06">}}
+August 2017 to May 2021
 
 - Graduated [_magna cum laude_](pdf/usc-diploma.pdf) with a mathematics minor
 - Achieved [Outstanding Senior Award](https://sc.edu/about/offices_and_divisions/leadership_and_service_center/awards_and_recognition/senior-awards/index.php) and the [Palmetto Fellows Scholarship](https://sc.edu/about/offices_and_divisions/financial_aid/scholarships/scholarships_for_sc_residents/palmetto_fellows/index.php)
 - Earned honors including President's List, Dean's List, and [Phi Beta Kappa](https://www.pbk.org/About)
 - Served as President and Treasurer of the Carolina Movement Club (_parkour!_)
 
-## Skills {.md:hidden}
-
-{{<skills class="md:hidden">}}
-
-{{</main>}}
-
-{{<footer class="text-center">}}
+</main>
 
-_Is HTML too fancy for you? [See it in plain text](/index.txt)._
-{class="print:hidden"}
+<footer class="h-5 text-center print:fixed print:bottom-0 print:w-full">
 
-_Fully typeset with HTML and CSS — see [github.com/cjshearer/modern-hugo-resume](https://github.com/cjshearer/modern-hugo-resume)_
-{class="hidden print:block"}
+_Cody Shearer - cjshearer@live.com - References available on request_
 
-{{</footer>}}
+</footer>
diff --git a/hugo.yaml b/hugo.yaml
@@ -13,7 +13,6 @@ disableKinds:
   - taxonomy
   - term
 enableEmoji: true
-enableRobotsTXT: true
 languageCode: en-us
 markup:
   goldmark:
@@ -32,12 +31,3 @@ module:
       target: assets/watching/hugo_stats.json
     - source: node_modules/@fortawesome/fontawesome-free/svgs
       target: assets/svgs
-mediaTypes:
-  text/plain:
-    suffixes:
-      - txt
-outputFormats:
-  TXT:
-    mediaType: text/plain
-    baseName: index
-    isPlainText: true
diff --git a/layouts/404.html b/layouts/404.html
diff --git a/layouts/content/_redirects b/layouts/content/_redirects
diff --git a/layouts/index.html b/layouts/index.html
@@ -2,7 +2,7 @@
 <html lang="en">
   {{ partialCached "head.html" . }}
   <body
-    class="mx-auto grid min-h-screen max-w-[8.5in] grid-cols-resume grid-rows-resume gap-4 px-4 pb-2 pt-4 grid-areas-resume md:grid-cols-resume-md md:grid-areas-resume-md"
+    class="m-4 mb-2 print:m-0 [&>*]:mx-auto [&>*]:max-w-[8.5in] print:[&>*]:max-w-none"
   >
     {{ .Content }}
   </body>

diff --git a/layouts/index.txt b/layouts/index.txt
diff --git a/layouts/partials/css.html b/layouts/partials/css.html
diff --git a/layouts/partials/head.html b/layouts/partials/head.html
@@ -1,15 +1,24 @@
 {{ $data := .Scratch.Get "data" }}
-{{ $googleFontURL := "https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,300;0,400;0,500;1,300;1,400&display=swap" }}
+{{ $googleFontURL := "https://fonts.googleapis.com/css2?family=Roboto+Flex&display=swap" }}
 <head>
+  {{ with (.Page.Title | default $.Site.Title) }}
+    <title>{{ . }}</title>
+    <meta property="og:title" content="{{ . }}" />
+  {{ end }}
+  {{ with .Page.Description }}
+    <meta property="og:description" content="{{ . }}" />
+    <meta name="description" content="{{ . }}" />
+  {{ end }}
   <base href="{{ .Site.BaseURL }}" />
-  <meta charset="UTF-8" />
-  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  <title>{{ .Page.Title | default .Site.Title }}</title>
-
+  <link rel="canonical" href="{{ .Permalink }}" />
   <link rel="preconnect" href="https://fonts.gstatic.com" />
   <link rel="preload" href="{{ $googleFontURL }}" as="style" />
   <link rel="stylesheet" href="{{ $googleFontURL }}" />
-  <link rel="canonical" href="{{ .Permalink }}" />
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+  <meta property="og:locale" content="en_US" />
+  <meta property="og:type" content="website" />
+  <meta property="og:url" content="{{ .Permalink }}" />
   {{ with .Page.Params.faviconText }}
     {{ $faviconString := print
       `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100">`
@@ -30,19 +39,13 @@
     <link rel="icon" href="data:image/svg;," />
   {{ end }}
 
-  {{ partialCached "css.html" . }}
-
-  {{ if .Site.Params.enableMetaTags }}
-    <meta property="og:title" content="{{ .Site.Title }}" />
-    <meta property="og:url" content="{{ .Permalink }}" />
-    <meta property="og:type" content="website" />
-    {{ with $data.BasicInfo.Photo }}
-      <meta property="og:image" content="{{ . | absURL }}" />
-    {{ end }}
-    {{ with $data.Profile | htmlUnescape | emojify | truncate 200 }}
-      <meta property="og:description" content="{{ . }}" />
-      <meta name="description" content="{{ . }}" />
-    {{ end }}
+  {{ $styles := resources.Get "css/main.css" | resources.PostCSS }}
+  {{ if hugo.IsProduction }}
+    {{- with $styles | minify | fingerprint | resources.PostProcess -}}
+		<style>{{- .Content | safeCSS }}</style>
+    {{- end -}}
+  {{ else }}
+    <link href="{{ $styles.RelPermalink }}" rel="stylesheet" />
   {{ end }}
 
   {{ if .Site.GoogleAnalytics }}