barcode; about me justify

cmpadden · Sep 12, 2024 · e64470b · e64470b
1 parent df01087
commit e64470b
Show file tree

Hide file tree

Showing 3 changed files with 72 additions and 75 deletions.
diff --git a/components/Header.vue b/components/Header.vue
@@ -6,19 +6,17 @@ const route = useRoute();
 
 <template>
   <nav class="container mx-auto py-6">
-    <div class="flex items-end justify-between text-gray-200">
-      <NuxtLink
-        to="/"
-        class="font-mono text-3xl font-semibold text-white underline decoration-orange-500 underline-offset-4 hover:text-orange-500"
-        as="div"
-      >
-        who&#183;am&#183;i
+    <div class="flex items-baseline text-gray-200">
+      <NuxtLink to="/" class="flex-1">
+        <SvgBarcode class="text-white hover:text-orange-500" />
       </NuxtLink>
 
+
+      <!-- End -->
       <div class="flex items-center">
         <NuxtLink to="https://github.com/cmpadden">
           <svg
-            class="mr-2 inline h-6 w-6 hover:text-orange-500"
+            class="mr-2 inline h-6 w-6 hover:text-orange-300"
             xmlns="http://www.w3.org/2000/svg"
             viewBox="0 0 24 24"
             fill="currentColor"

diff --git a/components/section/AboutMe.vue b/components/section/AboutMe.vue
@@ -42,73 +42,50 @@
 </script>
 
 <template>
-  <section class="container mx-auto pb-8">
-    <div class="flex flex-wrap">
-      <div class="w-full">
-        <div
-          class="lg:text-normal space-y-4 font-medium tracking-wide text-white sm:text-base"
-        >
-          <template v-if="false">
-            <div>
-              I am a
-              <span class="inline-block w-48">
-                <HeadlessTransitionRoot
-                  as="template"
-                  appear
-                  :show="show"
-                  enter="transition transform duration-300 ease-out"
-                  enter-from="translate-y-2 opacity-0"
-                  enter-to="translate-x-0 opacity-100"
-                  leave="transition transform duration-300 ease-in"
-                  leave-from="opacity-100"
-                  leave-to="-translate-y-2 opacity-0"
-                >
-                  <div
-                    class="w-48 bg-white px-2 text-center font-extrabold tracking-wide text-black shadow-xl"
-                  >
-                    {{ occupation }}
-                  </div>
-                </HeadlessTransitionRoot>
-              </span>
+    <section class="container mx-auto pb-8">
+        <div class="flex flex-wrap">
+            <div class="w-full">
+                <div class="lg:text-normal space-y-4 font-medium tracking-wide text-white
+                    text-justify sm:text-base">
+                    <template v-if="false">
+                        <div>
+                            I am a
+                            <span class="inline-block w-48">
+                                <HeadlessTransitionRoot as="template" appear :show="show"
+                                    enter="transition transform duration-300 ease-out"
+                                    enter-from="translate-y-2 opacity-0" enter-to="translate-x-0 opacity-100"
+                                    leave="transition transform duration-300 ease-in" leave-from="opacity-100"
+                                    leave-to="-translate-y-2 opacity-0">
+                                    <div
+                                        class="w-48 bg-white px-2 text-center font-extrabold tracking-wide text-black shadow-xl">
+                                        {{ occupation }}
+                                    </div>
+                                </HeadlessTransitionRoot>
+                            </span>
+                        </div>
+                    </template>
+                    <div>
+                        I help educate data engineers while building the future of data orchestration at
+                        <a class="border-b-2 border-orange-500" target="_blank" rel="noopener noreferrer"
+                            href="https://dagster.io/">Dagster</a>.
+                    </div>
+                    <div>
+                        Previously, I worked at
+                        <a class="border-b-2 border-orange-500" target="_blank" rel="noopener noreferrer"
+                            href="https://www.gemini.com/">Gemini</a>
+                        building the data platform that provided company-wide insights into
+                        the exchange and business. At Georgetown University's
+                        <a class="border-b-2 border-orange-500" target="_blank" rel="noopener noreferrer"
+                            href="https://mccourt.georgetown.edu/research/the-massive-data-institute/">Massive Data
+                            Institute</a>
+                        building data warehousing, processing solutions, and portals to aid
+                        social scientists and researchers to leverage large-scale organic
+                        data. And previously I provided consulting for financial
+                        institutions and government agencies in the D.C. area around data
+                        practices, and identity and access management.
+                    </div>
+                </div>
             </div>
-          </template>
-          <div>
-            Currently, I am helping educate engineers and building the future of
-            data orchestration at
-            <a
-              class="border-b-2 border-orange-500"
-              target="_blank"
-              rel="noopener noreferrer"
-              href="https://dagster.io/"
-              >Dagster</a
-            >.
-          </div>
-          <div>
-            Previously, I worked at
-            <a
-              class="border-b-2 border-orange-500"
-              target="_blank"
-              rel="noopener noreferrer"
-              href="https://www.gemini.com/"
-              >Gemini</a
-            >
-            building the data platform that provided company-wide insights into
-            the exchange and business. At Georgetown University's
-            <a
-              class="border-b-2 border-orange-500"
-              target="_blank"
-              rel="noopener noreferrer"
-              href="https://mccourt.georgetown.edu/research/the-massive-data-institute/"
-              >Massive Data Institute</a
-            >
-            building data warehousing, processing solutions, and portals to aid
-            social scientists and researchers to leverage large-scale organic
-            data. And previously I provided consulting for financial
-            institutions and government agencies in the D.C. area around data
-            practices, and identity and access management.
-          </div>
         </div>
-      </div>
-    </div>
-  </section>
+    </section>
 </template>
diff --git a/components/svg/barcode.vue b/components/svg/barcode.vue
@@ -0,0 +1,22 @@
+<template>
+    <svg width="366" height="24" viewBox="0 0 366 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+        <path
+            d="M0 76V0.47998H11.52V76H0ZM23.04 76V0.47998H34.56V76H23.04ZM38.4 76V0.47998H42.24V76H38.4ZM46.08 76V0.47998H49.92V76H46.08ZM53.76 76V0.47998H57.6V76H53.76Z"
+            fill="currentColor" />
+        <path
+            d="M61.5 76V0.47998H73.02V76H61.5ZM76.86 76V0.47998H80.7V76H76.86ZM84.54 76V0.47998H88.38V76H84.54ZM99.9 76V0.47998H111.42V76H99.9ZM115.26 76V0.47998H119.1V76H115.26Z"
+            fill="currentColor" />
+        <path
+            d="M123 76V0.47998H134.52V76H123ZM138.36 76V0.47998H142.2V76H138.36ZM146.04 76V0.47998H157.56V76H146.04ZM161.4 76V0.47998H165.24V76H161.4ZM176.76 76V0.47998H180.6V76H176.76Z"
+            fill="currentColor" />
+        <path
+            d="M184.5 76V0.47998H196.02V76H184.5ZM199.86 76V0.47998H203.7V76H199.86ZM207.54 76V0.47998H211.38V76H207.54ZM222.9 76V0.47998H226.74V76H222.9ZM230.58 76V0.47998H242.1V76H230.58Z"
+            fill="currentColor" />
+        <path
+            d="M246 76V0.47998H257.52V76H246ZM261.36 76V0.47998H272.88V76H261.36ZM276.72 76V0.47998H280.56V76H276.72ZM284.4 76V0.47998H288.24V76H284.4ZM299.76 76V0.47998H303.6V76H299.76Z"
+            fill="currentColor" />
+        <path
+            d="M307.5 76V0.47998H311.34V76H307.5ZM315.18 76V0.47998H326.7V76H315.18ZM330.54 76V0.47998H334.38V76H330.54ZM345.9 76V0.47998H357.42V76H345.9ZM361.26 76V0.47998H365.1V76H361.26Z"
+            fill="currentColor" />
+    </svg>
+</template>